Why is page opening with axios request not successful with Bearer <token>, unless manually requested with a button click

[kwesiaryee]

I have my api.intercepter set on the axios.js script as below;

api.interceptors.request.use( function(config) { api.defaults.headers.common["Accept"] = "application/json"; api.defaults.headers.common["Content-Type"] = "application/json"; let token = localStorage.getItem("user.token"); console.log("token", token); if (token) { api.defaults.headers.common["Authorization"] = "Bearer " + localStorage.getItem(token); } return config; }, function(error) { console.log("intercept"); return Promise.reject(error); } );

When I open a page/component with an axios request, the page open as usual but request returns 401, apparently because the bearer token not included with initial request (request method added to component created()) unless manually activated with a button click.

How can I get the axios request to include the bearer header and display the response when page open. Any help will be appreciated.

[MilosPaunovic]

This is more of an axios related question, so I would suggest you search for help on their repository.