For authentication, I have a VueJS login page and it works fine.
To check if the user is authenticated, I retrieve the authenticated user via the API. If the request fails, it means that the user isn't authenticated. But in this case I get a JS error.
Failed to load resource: the server responded with a status of 401 ()
How is it possible to avoid this error in the console ?
With InertiaJS, there isn't any error in the console ... without InertiaJS, there is one. (I don't use InertiaJS in this project)
Authenticated would mean they have been verified and a token should be issued.
Otherwise if not verified then you display a message explaining.
Can you show the code where this takes place.
Like using axios:
if (error.response.status === 401) {
do something here.
One I have used in a div.
.catch(error => {
if (error.response) {
isJson(error.response.data);
showData(error.response.data);
}
});
then
function showData(data) {
var div = document.getElementById('msg');
document.getElementById("msg").style.display = "block";
for (var key in data) {
div.innerHTML += " " + data[key];
}
}
Before each request, I sent a request to retrieve the authenticated user via the API protected with Sanctum. Effectively if no user is authenticated, I get an error in the console.
The solution : I don't send any request to get the authenticated user any more, but the backend sends automatically the authenticated user as an additional data merged with the response for each request.