Okta React & Custom Login Example - Error


#1

I’m following the instructions, https://github.com/okta/samples-js-react/blob/master/custom-login/README.md, to install the Okta React & Custom Login Example.

I received no errors and the React app loads with the Home page Custom Login Page with Sign in Widget. However, when I try logging in with my Okta developer username and password I get a spinning circle that eventually displays the following message, “Unable to connect to the server, please check your network connection.” I also tried creating another user account for testing but still get the same error message.

I wasn’t able to login successfully so I didn’t integrate the resource server.

Does anyone have an idea why I’m receiving the “Unable to connect to the server, please check your network connection” error? Any advice is greatly appreciated.

Thank you
Mark


#2

Hi Mark, I’ve been doing UAT of the samples since we have launched them. I started over from scratch with my org, and I’m not seeing the issue. Custom Login with the widget works correctly. If CORS isn’t set up correctly in your org, then you will get a CORS error and the widget will spin, but I don’t think it is that. It should be clear from the console that you are hitting a CORS issue.

Do you mind sharing your samples config? Just want to check a few things.


#4

The following is my samples config

    export default {
  oidc: {
    clientId: '0oadyu38uxFdYiOEU0h7',
    issuer: 'https://dev-971170.com/oauth2/default',
    redirectUri: 'http://localhost:8080/implicit/callback',
    scope: 'openid profile email',
  },
  resourceServer: {
    messagesUrl: 'http://localhost:8000/api/messages',
  },
};

#5

Looking at your config, it looks like your issuer URL is missing oktapreview.
It should be - https://dev-971170.oktapreview.com/oauth2/default

You can use the well-known URI to get more information - https://dev-971170.oktapreview.com/oauth2/default/.well-known/openid-configuration


#6

This worked, thank you!