API is not receiving my access token

Question

fetchData () {
  axios.get('https://some-address.com/orders', {
    params: {
      limit: this.limit,
      offset: this.offset
    },
    headers: auth.getAuthHeader()
  })
    .then((resp) => {
      this.req = resp.data
      console.log(resp)
    })
    .catch((err) => {
      console.log(err)
    })
}

Storing token in "auth/index.js"

  // The object to be passed as a header for authenticated requests
  getAuthHeader () {
    return {
      'Authorization': localStorage.getItem('access_token')
    }
  }

When i send GET request to receive a list of items, i'm getting the following headers in response:

in request:

Status code 403, obviously API is not getting my access_token. But if i make the same request in Postman (manually pasting access token value) - it works.

Error from console:

The response/request you've shown looks like a CORS preflight request, which will be made by the browser automatically (this doesn't happen when using Postman). Your server shouldn't 403 for a preflight request, so I suggest looking into that. — Kirk Larkin, Aug 22 '18 at 10:56
I can't be sure - Can you confirm that it's the `OPTIONS` request that is giving a 403? — Kirk Larkin, Aug 22 '18 at 11:01
Ok, so your update confirms that the server is behaving badly. [This](https://stackoverflow.com/questions/44966434/response-for-preflight-403-forbidden) might help confirm what I've said so far. — Kirk Larkin, Aug 22 '18 at 11:19

score 1 · Answer 1 · edited Aug 22 '18 at 11:57

1

Try defining headers before:

axios.defaults.headers.common = {
    'Authorization' : localStorage.getItem('access_token')
};

edited Aug 22 '18 at 11:57

Erubiel

2,934
14
32

answered Aug 22 '18 at 10:49

Max Maximilian

591
2
20

1

I've already tried `axios.defaults.headers.common['Authorization'] = localStorage.getItem('access_token')` above `fetchData ()` in my case. No effect :( – Alexander Kim Aug 22 '18 at 10:53
Use axios interceptor for request and check if the Authorization is present in the headers before the request is made https://github.com/axios/axios#interceptors – Allkin Aug 22 '18 at 11:02

score 0 · Accepted Answer · answered Aug 23 '18 at 05:07

0

It was indeed issue on the backend side, thanks to @KirkLarkin, he pointed me in the right direction. I had to coordinate with backend developer for making correct headers for CORS requests.

answered Aug 23 '18 at 05:07

Alexander Kim

17,304
23
100
157

API is not receiving my access token

2 Answers2