SharedArrayBuffer error showing up when making cross origin request

Question

We have a local development enviorment (localhost/) that communicates with our development API on a remote server (api-dev.host.com).

After the latest Chrome upgrade, I am getting the following console error when attempting to communicate from localhost to the remote server:

[Deprecation] SharedArrayBuffer will require cross-origin isolation as of M92, around July 2021. See https://developer.chrome.com/blog/enabling-shared-array-buffer/ for more details.

While the link in the error does display some information, it is unclear to me how to fix this issue. Is there anyway to fix this from the backend? Any answers would be appreciated.

Answer 1

According to the link in the error message, this is due to a new security feature implemented in Chrome v92.

Chrome v92 is now requiring the Cross-Origin-Resource-Policy header in order to share resources between two or more origins. I assume you are trying to use a cookie or other resource set by api-dev.host.com and so you would need to implement the header or have your CORS configuration set to Access-Control-Allow-Origin: *.

If you do not have the Access-Control-Allow-Origin set to * you can set the Cross-Origin-Resource-Policy header using the following Nginx configuration:

add_header Cross-Origin-Resource-Policy 'cross-origin' always;

There are multiple different values to the header but cross-origin will allow you to access resources between origins (localhost and api-dev.host.com are different origins).

Notice that you may have had SameSite=Lax or other configuration. In order to access the cookies supposed to be set by the remote server together with the Cross-Origin-Resource-Policy you will need to have the following cookie configuration (you can check your cookie SameSite configuration here):

SameSite=None; Secure;

This should work assuming you are trying to access a cookie set by the remote server of a separate origin and do not have Access-Control-Allow-Origin set to *.