CORS problems with Auth0 and React

MoeSattler picture MoeSattler · Dec 28, 2015 · Viewed 9.1k times · Source

I am currently trying implement Auth0 in my NodeJS + React App. This tutorial given is really good and helpful, though I have one big problem. Every time I try to login/register via Auth0 I get

XMLHttpRequest cannot load https://XYZ.eu.auth0.com/usernamepassword/login. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

So I have a rough understanding what that means. But I just don't know where to set the needed options to allow this request to Auth0. On the Server side? In the Browser code?

Best regards


EDIT: as Rodrigo López Dato pointed out, I can write Origins in my app here: https://manage.auth0.com/#/applications

What should I put there when I am developing locally? My IP?

Answer

Kassandra Perch picture Kassandra Perch · Dec 28, 2015

If you are developing locally, you can put the URL you are going to redirect to. For instance, if you are running on your localhost at port 4000, and you want to redirect to your route called /callback, you can put:

http://localhost:4000/callback

in that field.