0

I implemented an Oauth2 authentication in a GraphQL/Spring Boot API and I want to consume it from the VueJS app using Apollo client , Currently, I am able to do that using Postman. But I have an error in Chrome about CORS :

Access to fetch at 'https://server/as/authorization.oauth2?response_type=code&client_id=DEV_CLIENT&scope=api%20profile%20openid&state=sW2aJRg-ZA8vomsiuynS-nS1QobOUJY1Ytrji_gSFz8%3D&redirect_uri=http://localhost:5000/login/oauth2/code&nonce=' (redirected from 'http://localhost:5000/pdp/api/graphql') from origin 'http://localhost:8080' 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. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

I implemented CORS config in the API like this :

 http.cors().and().csrf().disable()

I contacted the support team, theu told me this : " you are trying to send a CORS request to OIDC services. Please note, we do not have CORS enabled on federation servers. The solution will be to not make any CORS request. "

1 - How can I retrieve the Access Token from the API and use it in the front end in this case (Oauth2) ? 2 - How can I bypass CORS Policy of the server, knowing that they told my it is disabled ?

Thank you

1 Answers1

0

If you cannot control/set the CORS origin policy in the server then there is nothing much you can do from a VUEJS app from the browser. Its the browser which restricts this. You can also ask them if they have jsonp support. Here is a link how to do that.

https://www.freecodecamp.org/news/use-jsonp-and-other-alternatives-to-bypass-the-same-origin-policy-17114a5f2016/

If everything fails, then write up a small backend service which retrieves the Access Token from the API and can pass the token to the VUEJS app in the browser.

Tito
  • 8,894
  • 12
  • 52
  • 86