So I read that there are upcoming changes in Chrome to enable the usage of SharedArrayBuffer specifically "Making your website "cross-origin isolated"". My site makes use of external APIs that don't meet the requirements for this. So what I did was, offloaded the code that uses SharedArrayBuffer into an iframe using a subdomain and added the required headers to that page. Reading a bit more into it now, it seems that I still need to have the top level document served with the required headers otherwise I still get the warning in the console.
Just to clarify, my site now is using the following structure:
app.website.com -> contains the complete application functionalityservice.website.com -> contains the functionality that makes use of SharedArrayBufferI thought that I would be able to simply add the required headers to service.website.com and everything would work properly, but I'm still getting the cross origin warning. Any ideas?
SharedArrayBuffer can be only enabled in an environment where the entire frame chain is under cross-origin isolation. Even if you embed the page that uses SharedArrayBuffer, the parent page must be cross-origin isolated too.
One possible work around is to open a popup window that is cross-origin isolated if the UX is usable for this purpose. One caveat is that cross-origin isolated page won't be able to communicate with other windows.
I know it's a pain but cross-origin isolation is needed for security reasons.