I'm trying to integrate the Zoom Web Video SDK into an existing web application, and SharedArrayBuffer has become a requirement for performance reasons, and in order to enable it the site has to implement Cross Origin Isolation. I've gone ahead and added the requisite configuration to NGINX, namely:

add_header 'Cross-Origin-Embedder-Policy' 'require-corp';
add_header 'Cross-Origin-Opener-Policy' 'same-origin';

... but of course this has knock-on effects for the rest of the previously existing and working site. The Google APIs won't seem to load successfully anymore.

I changed my index.html to add the crossorigin attribute to the Google API script tag as follows:

<script src="https://apis.google.com/js/platform.js" async defer crossorigin></script>

... and in my javascript source code I have (paraphrasing and reducing complexity to get the the point):

gapi.load('client:auth2', function() { 
  gapi.client
  .init({
     client_id: 'MY-CLIENT-ID',
     cookiepolicy: 'single_host_origin',
     discoveryDocs: ['https://classroom.googleapis.com/$discovery/rest?version=v1'],
     scope: 'profile email'
  })
  .then(() => console.log('init finished'))
  .catch(e) => console.error('init failed', e));
});

In that code, gapi and gapi.client are well-defined, but the init call never completes (no console logs from the then or from the catch). Looking at the network tab in devtools shows a failed GET request to:

https://content-classroom.googleapis.com/static/proxy.html?usegapi=1& ... and bunch of other stuff i'm not sure if is sensitive so am omitting

When you dive into the response, it shows:

To use this resource from a different origin, the server needs to specify a cross-origin resource policy in the response headers:

• Cross-Origin-Resource-Policy: same-siteChoose this option if the resource and the document are served from the same site.
• Cross-Origin-Resource-Policy: cross-originOnly choose this option if an arbitrary website including this resource does not impose a security risk.

Obviously, I can't control what Google's servers do, but can anyone instruct me as to how I can get this to work correctly. This only goes awry in the presence of my NGINX configuration change at the start of this post.

Update

I partially worked around this by fetching the discovery document for the API separately and passing the result into the gapi.client.init method instead of the URL. However, while I don't get the aforementioned outcome in the network tab of devtools anymore, but I instead get weird / inconsistent results with responses like "popup_closed_by_user" and "popup_closed_by_browser" happening in response to my GoogleAuth.signIn call. If I remove the headers from NGINX it starts behaving as expected again. I don't understand what's going on with this.