Currently, I am utilizing Laravel API passport to handle authentication in my Single Page Application (SPA) built with Vue. At the moment, whenever I need to access the backend server, I have to include a header in order to be allowed through the protected routes.
// Retrieve user object from local storage
const userObj = JSON.parse(window.localStorage.getItem('token'));
// Constructing the necessary headers for authorization
var header = {
'Accept' : 'application/json',
'Authorization' : 'Bearer '+ userObj.access_token
}
// Making a GET request to a protected route
axios.get('/prod/test',{headers : header})
.then(response=>{
console.log(response);
});
}
I was wondering if there is a more streamlined and cleaner approach to achieve this. Thank you.