I have a problem that started recently in a web application protected by Google Identity Aware Proxy.
Here's my setup:
- An API GKE pod, served by a backend service, protected by IAP.
- An SPA GKE pod, service by a backend service, protected by IAP.
- The two backend services are configured to use the same OAuth client ID.
- The API and the SPA are serving off the same domain - the SPA is serving off example.domain.com and the API is serving off example.domain.com/api.
- The SPA calls the API from JavaScript (using axios) inside the web browser.
- A very similar setup exists for two other services, this time on GAE.
Until yesterday, everything worked smoothly, both for the services that are deployed on GAE and GKE. However, today I've started getting occasional errors in the browser console on the JavaScript requests inside the browser, saying:
Access to XMLHttpRequest at 'https://example.domain.com/api' from origin 'https://example.domain.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I've tried changing the CORS policy on the server, allowing all origins and even allowing OPTIONS request without cors header. In the client, I've tried changing some header request (used Axios default before), like setting axios.defaults.withCredentials = true. Nothing helped.
The only workaround I could find is to manually go in another tab to the API URL (example.domain.com/api), then go back to the SPA tab and refresh it, but it has to be done every hour (I guess it's related to the OAUTH token expiration).