Auth0 Home Blog Docs

CORS issue with React / graph.cool project on localhost

nodejs
authentication
cors
react
localhost

#1

I am trying to get auth0 working in my local project. I googled the CORS issue and it seems you have to enable the proper URLs in the auth0 client settings, which I did though. It seems I keep overseeing something. Please have a look at following screenshots and code:

I would really love to use auth0 in this project, so I appreciate any hints. Thank you in advance!


#2

You’re trying to make use of cross-origin authentication and the associated setting (Cross Origin Authentication Location) does not allow just localhost in the URL. According to the current placeholder it expects https://domain.tld/path. I don’t have additional information about the reasoning for this limitation, but for development purposes you can just use something like https://cool.localtest.me:{port}; except for readme.localtest.me (which explains how to use it) every other sub-domain of localtest.me points to 127.0.0.1 by default so you can use it to target your local app (and if you’re paranoid about the real owner changing things under you then you can always force a specific one to always map to your local machine through an hosts entry). This way you avoid the constraint on the setting.


#3

@jmangelo I’m having the same CORS issue as @maxim.zubarev, even after using http://cool.localtest.me:3000. Have tried other browsers with the same result.


#4

@jmangelo I’m having the same CORS issue as @maxim.zubarev, even after using http://cool.localtest.me:3000. Have tried other browsers with the same result.


#5

My answer focused a bit on the issue about the inability to use localhost in one the settings shown in the screenshot, however, that’s only part of the equation. Depending on tenant configuration there are a few settings that can influence CORS; the first thing to ensure is to have set Allowed Web Origins correctly. If that does not affect the end result then you should probably submit your question with information about endpoints being called, endpoint that fails with CORS and client configuration.


#6