Getting userinfo creates CORS error after successful login

Help
,
1

Hi All,

I have a strange issue. In a React SPA I use something very similar to the recommended:

webAuth.parseHash({ hash: window.location.hash }, function(err, authResult) {
  if (err) {
    return console.log(err);
  }

  webAuth.client.userInfo(authResult.accessToken, function(err, user) {
    // Now you have the user's information
  });
});

The error I get: Error:

"Request has been terminated
Possible causes: the network is offline, Origin is not allowed by Access-Control-Allow-Origin, the page is being unloaded,

As said the login did not show any CORS problem. I also see that the XHR GET https://srcd.auth0.com/userinfo is successful and the returned json includes all user info. Any ideas what I am doing wrong?

3

Hey @JensC, when you get a min can you snag us a HAR file and DM me your tenant name so we can take a deeper look at this. Thanks!

4

Whats a HAR file and a tenant (maybey the subdmain name)? Sorry for the silly question.

5

No worries @JensC, an HTTP Archive (HAR) is a JSON formatted log of a web browser’s interactions with a web server. This can aid us when trying to narrow down what challenges you may be facing. I have included some helpful documentation below. Please let me know if you have any questions.

6

I wonder how long it takes to answer my DM? The requested HAR file has been sent 5 days ago. Thanks, Jens

7

I apologize for the delay, this is still being reviewed. I’ll let you know as soon as I have an update.

8

Thanks, James! This is very appreciated.

9

Hey @JensC, I took a look at your HAR file with our Support team and it looks like there is an issue within your application and the port it is utilizing as we see in the HAR file we are successfully delivering a profile to you but based on the headers on the options call to your application (Access-Control-Allow-Origin http://localhost:8888) You’re allowed to use port 8888 instead of 3000. When you get a moment can you give it another look? Thanks!

10

Thanks James! My app stack exists of a SPA-React app running on port 8888 and a Rails restful api on port 3000. The SPA sends api requests with the JWT token to the Rails app which checks for permissions. Both localhost:3000 and 8888 are in the "Allowed Web Origins " list. So I would expect that it works. Any idea what could be wrong? Thanks Jens.

11

Hi @JensC. I inspected the .HAR file looking for the error, but there’s nothing that stands out. As you say, the /userinfo returns the expected information, and there are other OPTIONS checks for CORS (for your own API), but they all seem to return the expected headers (and there are successful requests for the API).

/userinfo, in particular, allows any origin, so it should be a problem in CORS requests.

Where exactly are you getting this error? In the callback for .userInfo()? Does the console show anything that might help?

1 Like
12

Thanks Nicolas,
Yes I am as puzzled about it as you are. The odd thing is that it was working with auth0-js 7.2.1. For the 9.x version I made a few changes, but nothing essentially and currently I am on a localhost environment. Strange!?
Thanks anyways,
Jens

13

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.