Enable CORS with Google IAP

Question

I'm are trying make an ajax call to my web api server from a third party JavaScript integration. However after enabling IAP on my API server, I'm unable to make the calls to my web apis from my integration server. I have added my integration server as Authorized JavaScript origins in the Client ID for Web application.

Below is the error.

Access to XMLHttpRequest at 'https://webapiserver.com/apiendpoint1' from origin 'https://myintegration.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Please let me know if there is other configuration missing at my end. Thanks.

Answer 1

CORS requires unauthenticated OPTIONS request. Your API server needs to allow it, to do it, you need:

1. Add code to your app that responds to the OPTIONS requests.
2. Change the setting access_settings.cors_settings.allow_http_options to true so that IAP passes OPTIONS requests through to your application.

More information about customizing IAP in the official Google documentation.

This feature was not previously available, and proposed workaround existed:

In the same GCP project create App Engine services:

• A UI server
• An API server

The UI server makes calls to the API server. To get around the CORS problem, use Routing with a dispatch file: https://cloud.google.com/appengine/docs/standard/python/how-requests-are-routed#routing_with_a_dispatch_file

Normally, when the UI server wants to call API server, it calls api-dot-MY_PROJECT.appspot.com

In this workaround, the UI server calls itself with a specified path ("/api"): MY_PROJECT.appspot.com/api

Since the UI server is calling itself, CORS does not apply.