I’m trying to implement Auth0 authentication locally in a web app.
I have a backend service in node (with express) and a frontend service in VueJs.
I implemented the backend according to the instructions, so now if an endpoint requires authentication, I get a 302 code and redirected to the login screen.
However, when I call the endpoint from the frontend, the redirect is blocked by the browser with this error:
Access to XMLHttpRequest at ‘riseup…’ (redirected from ‘https://localhost:9090/api/no-auth/login’) from origin ‘https://localhost:9090’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
To my understanding, it’s not possible to prevent the redirect and do it manually.
I configured my endpoints in “Allowed Web Origins” and “Allowed Origins (CORS)” to no avail.
Can someone see what I’m doing wrong?
3 Likes
Hi,
did you understand what you did wrong? I can do all the authentication but now that I am calling:
let data = {
roles: this.ROLE_USER
}
let instance = axios.create({
baseURL: `https://${process.env.VUE_APP_AUTH0_DOMAIN}/api/v2/users/`,
method: 'post',
mode: 'no-cors',
headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'POST, OPTIONS',
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + this.accessToken,
},
});
return await instance.post(`${userId}/roles`, JSON.stringify(data));
it started the error:
Access to XMLHttpRequest at ‘https://dev-1flzkotdey2fm74y.us.auth0.com/api/v2/users/auth0|6458c2dc3bed7617bbc58df5/roles’ from origin ‘http://localhost:9999’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
And in the Application I have:
and
For this reason authentication and JWT is working smoothly.
What am I missing?
