Keep getting "blocked by CORS" error (after login) but CORS is setup

while using Okta Developer setup, everything works 100% ok.

my company supports many existing implementations. this is just a new app I created. I am trying to figure out if the issue is on my side (client) or okta configuration side.

when I start porting to my internal company Okta, I keep getting this error even though i’ve verified all the CORS settings:

AuthApiError

Access to XMLHttpRequest at 'https://mycompany.okta.com/oauth2/xxxxxx/v1/keys' from origin 'https://mywebsite-dev.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

however:

  1. my CORS (Trusted Origins) is setup for https://mywebsite-dev.com

  2. i can see the xhr OPTIONS call to https://mycompany.okta.com/oauth2/xxxxxx/v1/keys come back with Access-Control-Allow-Origin: https://mywebsite-dev.com - I compared side by side with working developer Okta, and see all the same headers

  3. in my browser XHR calls i see this after logging in: response success {user: {…}, type: "SESSION_SSO", session: {…}, status: "SUCCESS"}

okta log shows successful logins.

is there maybe a way to gete a more verbose log on what happened?

UPDATE

it works in incognito mode

You might need to add a new trusted origin under API > Trusted Origins.

hi,

Trust Origins are already setup (#1 on my list)

In that case, I’d send an email to developers@okta.com to open a support ticket. You might need some feature flags turned on for your company account.

ah, sorry i should have added that my company supports many existing implementations. this is just a new app I created. I am trying to figure out if the issue is on my side (client) or okta configuration side. from their perspective its a very similar setup so they believe its correct. i’m looking for more troubleshooting ideas to confirm the issue… maybe some verbose log ??

Hi,

I have the same problem here.
I am sending requests to the okta API:

The change password request works fine, but when I am calling the users update endpoint, I am getting:

Access to XMLHttpRequest at ‘https://myoktadomain.com/api/v1/users/00ufnasdfrM345TX3S4x6’ from origin ‘http://localhost:8080’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

In both requests I am using the SSWS token the same way and build up the requests with axios the same way, too. I have already set up the trusted origins, otherwise the first request would also not go through. So I am lost now.

Can anybody help here?

Here is the requests that is not working, copied from browser:

curl 'https://myoktadomain.com/api/v1/users/00ufn12312312TX3S4x6' \
-H 'Connection: keep-alive' \
-H 'Pragma: no-cache' \
-H 'Cache-Control: no-cache' \
-H 'Accept: application/json, text/plain, */*' \
-H 'Authorization: SSWS apitoken' \
-H 'User-Agent: Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.106 Mobile Safari/537.36' \
-H 'Content-Type: application/json;charset=UTF-8' \
-H 'Origin: http://localhost:8080' \
-H 'Sec-Fetch-Site: cross-site' \
-H 'Sec-Fetch-Mode: cors' \
-H 'Sec-Fetch-Dest: empty' \
-H 'Referer: http://localhost:8080/account' \
-H 'Accept-Language: en-US,en;q=0.9,de;q=0.8' \
--data-binary '{"profile":{"locale":"de-DE"}}' \
--compressed

I’m surprised the first endpoint is working for you, as neither of these calls indicate they are CORS enabled, unlike, say Get Current User, /api/v1/users/me, which can work based on the session cookie in the user’s browser: https://developer.okta.com/docs/reference/api/users/#get-user

Additionally, in terms of security, it is not a good idea to be making calls with an API key via the front end of your application. If your application does not have a back-end, you may want to look into using the /authn endpoint as the Change Password request for it does not require an API key: https://developer.okta.com/docs/reference/api/authn/#request-example-for-change-password