Authorization Header: Basic Auth header sent in Safari but Chrome sends Bearer

Summary

I’ve scoured stack overflow and the issues list on this site and I cannot find a similarly described problem (or potential solution) for the problem I’m seeing.

I’m running an express server in NodeJS that serves up an API and the client front end. The API is authenticated with JWT while the client is authenticated with Basic.

Axios is configured on the client and is used to make API calls.

For reference:

this.axios = axios.create({ baseURL: '/api', headers: { Authorization: Bearer ${getToken()} } });

Problem:

When using a browser other than Chrome

Using axios to make an API call, it seems that the browser is ignoring the axios configuration for the authorization header and instead replacing it with: Authorization: Basic XXXXXXXXXX

I’m not certain this is an axios issue and I do not know why Chrome works as expected but other browsers do not.

Any help would be greatly appreciated.

Context

• axios version: latest
• Environment: node v9.1.0, express 4.14.0, Safari 11.1.0

[bluce1017]

The latest version of firefox sends the correct Auth Header. Safari and IE seem to ignore it and continue to send Basic Auth…

[niksynov]

@mmmikeal We added support for other name of Authorization header on the backend. That was a solution. And I guess this is not related to axios at all. This is specific case of safari