I'm submitting this issue for the package(s):
- jwt-verifier
- okta-angular
- oidc-middleware
- okta-react
- okta-react-native
- okta-vue
Re: Error: No 'Access-Control-Allow-Origin' header is present on the requested resource. This is not a fix for production or when application has to be shown to the client, this is only helpful when UI and Backend development are on different servers and in production they are actually on same server. There are some caveats when it comes to CORS. First, it does not allow wildcards. but don't hold me on this one I've read it somewhere and I can't find the article now. If you are making requests from a different domain you need to add the allow origin headers.
I'm submitting a:
- Bug report
- Feature request
- Other (Describe below)
![The The](https://cdn.crunchify.com/wp-content/uploads/2016/04/How-to-fix-Access-Control-Allow-Origin-issue-for-your-HTTPS-enabled-WordPress-site.png)
Current behavior
When logging in, Okta redirects the user back to [url]/implicit/callback with the token info attached to the URI. When that happens, the user is the redirected again to /implicit/callback without the token and
AuthApiError
is shown.Expected behavior
Login works as normal and the token is stored correctly in localStorage.
Minimal reproduction of the problem with instructions
I am unable to provide a demo due to this only happening after being deployed. (I cannot reproduce the issue locally even if I build the app locally)
Extra information about the use case/user story you are trying to implement
My local development toolchain consists of two node instances running. The first instance is the UI (which contains the okta-react package). The second Node instance is the backend (services stack).
The UI is based in Create-React-App and is built using react-scripts (Webpack derivative)
The backend is plain old Node/express that is packed with traditional Webpack.
The backend is plain old Node/express that is packed with traditional Webpack.
Running [email protected] works as expected but has issues regarding paths within the UI router that have been fixed by 1.1.3. The only thing changed is okta-react to v1.1.3 (and any deps that it needs) and then the error happens.
Environment
- Package Version: 1.1.3
- Browser: Chrome
- OS: MacOS and Windows
- Node version (
node -v
): 8.11.2 - Other:
![Present Present](/uploads/1/2/4/7/124715051/437905925.png)
I have an Express server where I run the Angular app (because I need server side rendering).
The problem is that first time I make a request from the application everything works fine.
The problem appears when I navigate to some page, and come back to the previous page where the request worked fine. When I navigate back the request doesn't work anymore, it shows me the next error:
Access to XMLHttpRequest at 'http://myserver/api/endpoint' from origin 'http://localhost:4000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I've tried to use CORS and other stuff, but it gives me the same error in the end.
This is the part where I use CORS:
Have tried as well without CORS:
So, what might be the problem that first time it works, and second time not?
Can this be related with this error from express console: 'ERROR TypeError: spanEl.getBoundingClientRect is not a function' ?
Exari ConstantinExari Constantin
1 Answer
Joel JosephJoel Joseph