‘Access-Control-Allow-Origin’ error when deploy to heroku

Hello everyone,
We have an app that uses okta widget to login and sign up new users. All working perfectly in development on localhost 3000.
As soon as I deployed the app to heroku, I get an error:

callback:1 Failed to load https://dev-497398.oktapreview.com/oauth2/default/v1/keys: The ‘Access-Control-Allow-Origin’ header has a value ‘http://localhost:3000’ that is not equal to the supplied origin. Origin ‘https://triplan.herokuapp.com’ is therefore not allowed access.

I changed the app settings to:

  1. Login redirect URIs :
    https://triplan.herokuapp.com/implicit/callback
  2. Initiate login URI:
    https://triplan.herokuapp.com/implicit/callback

and also went to Security > API >Trusted Origins and added the new origin: https://triplan.herokuapp.com

I looked at the other answers to the same question with no success. I also read this:
https://developer.okta.com/docs/api/getting_started/enabling_cors with no help.

as I mentioned, it creates a new user or doing the authentication on login, but then throw this error.

I don’t understand why in localhost is all working and when changed to heruko we have a CORS problem.

please, any help appreciated!

Your app sends the redirect URI as a parameter, so you probably have it hard coded somewhere. You can make it dynamic setting the redirect URI to window.location.origin.