Meet cross-origin problem when getting jwks

[poisson0106]

Hi, I met an problem when using oidc-client. At first, I can't get user info. As I checked the issues and found that I should use signinRedirectCallback to get user. So currently, my login phrase is

1. Using siginRedirect method in login page, it will redirect to a authorize page and input information to login.
2. It redirects to the pre-settings redirect-uri, currently, it is a callback page in my localhost
3. In order to test, create a button in callback page. Calling the signinRedirectCallback method in button onclick function. Meets error.
   The detailed debug information is as following:
   [HMR] Waiting for update signal from WDS...
   log.js:24:4
   In the router method, from /
   router.js:45:3
   In callback mounted
   cjs.js:23:5
   UserManager._loadUser: no user storageString
   oidc-client.min.js:1
   UserManager.getUser: user not found in storage
   oidc-client.min.js:1
   OidcClient.processSigninResponse
   oidc-client.min.js:1
   WebStorageStateStore.remove 86ffaf8e6b1748f8b5ed70693b3333f4
   oidc-client.min.js:1
   SigninState.fromStorageString
   oidc-client.min.js:1
   OidcClient.processSigninResponse: Received state from storage; validating response
   oidc-client.min.js:1
   ResponseValidator.validateSigninResponse
   oidc-client.min.js:1
   ResponseValidator._processSigninParams: state validated
   oidc-client.min.js:1
   ResponseValidator.validateSigninResponse: state processed
   oidc-client.min.js:1
   ResponseValidator._validateTokens: Validating id_token and access_token
   oidc-client.min.js:1
   JoseUtil.parseJwt
   oidc-client.min.js:1
   MetadataService.getMetadataProperty for: issuer
   oidc-client.min.js:1
   MetadataService.getMetadata: Returning metadata from settings
   oidc-client.min.js:1
   MetadataService.getMetadataProperty: metadata recieved
   oidc-client.min.js:1
   ResponseValidator._validateIdToken: Received issuer
   oidc-client.min.js:1
   MetadataService.getMetadataProperty for: jwks_uri
   oidc-client.min.js:1
   MetadataService.getMetadata: Returning metadata from settings
   oidc-client.min.js:1
   MetadataService.getMetadataProperty: metadata recieved
   oidc-client.min.js:1
   MetadataService.getSigningKeys: jwks_uri received https://xxx.com/keys/test/w3id-test.jwk
   oidc-client.min.js:1
   JsonService.getJson, url: https://xxx.com/keys/test/w3id-test.jwk
   oidc-client.min.js:1
   Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://xxx.com/test/w3id-test.jwk. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
   JsonService.getJson: network error
   oidc-client.min.js:1
   Error: Network Error
   Stack trace:
   getJson/</s.onerror@webpack-internal:///./node_modules/oidc-client/lib/oidc-client.min.js:3:4865

I know the problem is caused by CORS. Since I request jwks in my localhost. But how to solve it? I haven't found the CORS settings in our js file.

[StevenVerbiest]

The Access-Control-Allow-Origin header should be added on the oidc server (in your case: https://xxx.com).

I'm having the same issue, but I'm not really sure this is intended behaviour. When I implement the code like you did, I get CORS issues on the jwk request. (In my case: https://.net/.well-known/openid-configuration/jwks), but when I test the Vue example, I get CORS issues on the main configuration request (https://.net/.well-known/openid-configuration).

Can anyone elaborate which one of the two is the correct approach?

Update: Had CORS enabled on the oidc server and it seems to be working now. Implemented the Vue demo setup.

[StevenVerbiest]

@poisson0106 Apparently there's a workaround for CORS issues: #275

Unfortunately I can't seem to get it working either, but maybe this can help you out?

[poisson0106]

@StevenVerbiest
Fortunately, I solve the problem. My environment is also the Vue environment. I use vue-cli to create project. I set the "loadUserInfo" as false. Then it seems to read the signingKey and wouldn't request jwks_uri again for token. I'm not quite sure if this explain is true, but it solves my problem. Share it with your guys.