search

segmentio / analytics-next

Segment Analytics.js 2.0
https://segment.com/docs/connections/sources/catalog/libraries/website/javascript
MIT License
410 stars 135 forks source link

Scripts fail to load with COOP-COEP (when window.crossOriginIsolated is true) #841

Open yeldarby opened 1 year ago

yeldarby commented 1 year ago

We're working on making our site cross origin isolated to get access to multithreaded WASM, but once we set the headers on our page to

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

Several of our analytics scripts stop loading.

image

In order to fix this you have to add a crossorigin="anonymous" attribute to the script tags.

I forked this repo & added this to packages/browser/src/lib/load-script.js at line 36:

if (window.crossOriginIsolated)
      script.setAttribute('crossorigin', 'anonymous')

Which worked for the tags that get loaded directly by analytics-next.

image

Unfortunately for some scripts, like Amplitude, it looks like they load a script that injects another script which doesn't have the crossorigin attribute & so fails to load.

image

I was able to set a breakpoint in the debugger & manually inject the attribute:

image

to verify that this fixes the issue:

image

But have no way to actually edit the code coming down from this URL https://cdn.segment.com/next-integrations/integrations/amplitude/3.3.3/amplitude.dynamic.js.gz to persist the change.

Could someone at Segment update those remote scripts to inject crossorigin="anonymous" on tags they're adding when window.crossOriginIsolated is true? Besides Amplitude, it looks like the other integrations we have that are failing are gtag, reddit and LinkedIn.

yeldarby commented 1 year ago

Actually I see there's a repo that contains these integration scripts here but it's not clear whether I can just add a little proxy script that injects the crossorigin attribute into the scripts coming back 🤔

silesky commented 1 year ago

@yeldarby Thanks for the very well-written issue.

sametaylak commented 10 months ago

any updates on this?

MoonsuCha commented 8 months ago

Could this be a solution (https://www.npmjs.com/package/coi-serviceworker )? Are there any expected problems if we receive segment js through Service Worker?

erwanvivien commented 8 months ago

We are having the exact same problem

Multithreaded Wasm using some SharedArrayBuffer and we can't use Segment on this page due to COOP / COEP