axios: axios is not sending auth information

I’ve been trying to send a GET call to the stormpath API which requires some authorization to access the tenant data. When using Postman to test it worked just fine. Same result with curl. But when I tried using axios in my react app I get a 401 error.

XMLHttpRequest cannot load https://api.stormpath.com/v1/tenants/current. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 401.

this is what I used

 axios({	
  method: 'get',
  url: "https://api.stormpath.com/v1/tenants/current", 
  auth:
        {
          username: 'api ID',
          password: 'api Secret'
        }
}).then(function(response){console.log(response)})

I don’t know why but it’s not delivering the username and password according to the response I got.

code:401
developerMessage:"Authentication with a valid API Key is required."
message:"Authentication required."
moreInfo:"http://www.stormpath.com/docs/quickstart/connect"
requestId:"3686f590-d69e-11e6-9b8a-22000a8ce5d1"
status:401

But since the keys I used worked for the above previous cases the keys cannot be the problem. It most likely has to do with my configuration right?

About this issue

Original URL
State: closed
Created 7 years ago
Comments: 20 (1 by maintainers)

Most upvoted comments

I’m closing as it seems an issue on how the browser handles preflight requests and authorization, not an axios issue.

+50

rubennorte on Apr 2, 2017

I have a similar issue, when using the method helpers (axios.get, axios.post etc…) the auth headers are not getting included. But when constructing the request myself using just axios, it works as expected.

Working, headers get set:

axios({
  // ...
  auth: {
    user: 'user',
    password: 'password',
  },
});

Not working, headers don’t get set:

axios.get(url, {
  // ...
  auth: {
    user: 'user',
    password: 'password',
  },
});

Perhaps this is expected behaviour? But it is kind of odd you can’t use the helper methods and pass through some authentication.

+24

benjaminreid on Mar 10, 2017

I just solved this as well by not using axios.post(), instead using axios(). In my case the OPTIONS request was accepted by the server, but the following POST didn’t have any headers in it.

+11

johan-lejdung on Aug 20, 2017

Experiencing the above issue with the latest axios version - using the shorthand methods to specific request types results in ignoring the auth parameters and ends with a failed Basic Auth strategy.

I’m using Express + Passport on the server side and Axios within the client.

reksc on Mar 9, 2018

I recently had a similar issue and it turned out that the browser’s OPTIONS request, which is made in advance of a GET or POST, didn’t include the auth info and so the actual GET or POST was never made due to the OPTIONS request error. However, the first error you show is a CORS error. Hmm…

tsongas on Feb 15, 2017

My issue was about OPTIONS request. Now I don’t have any workaround to send auth info with OPTIONS request. But I solved the problem by modifying the server (nginx) configuration to disable basic auth only when clients send OPTIONS requests.

My configuration like the following:

location / {
    if ($request_method = OPTIONS ) {
        add_header Access-Control-Allow-Origin *;
        add_header Access-Control-Allow-Methods "POST, GET, OPTIONS";
        add_header Access-Control-Allow-Headers "Origin, Authorization, Accept, Content-Type";
        add_header Access-Control-Allow-Credentials true;
        add_header Content-Length 0;
        add_header Content-Type text/plain;
        return 200;
    }
    auth_basic "Restricted";
    auth_basic_user_file /path/to/passwordfile;
}

kohkimakimoto on Mar 15, 2017

JerryLeeCS on Aug 1, 2018

The W3 specification says that preflight requests should never include credentials.

john-harding on Jun 23, 2017

In server side try to add this block with your response head

res.header('Access-Control-Allow-Origin', 'http://' + url.parse(req.headers.referer).host)
res.header('Access-Control-Allow-Credentials', true)
res.header('Access-Control-Allow-Methods', 'GET, POST')
res.header('Access-Control-Allow-Headers', 'X-Requested-With,content-type,authorization')

PRABIRSOFT on Dec 6, 2018