Allow setting COOP and COEP headers in Github Pages #13309

josephrocca · 2022-03-23T06:22:14Z

josephrocca
Mar 23, 2022

In order to use SharedArrayBuffer and WebAssembly Threads, COOP and COEP headers need to be set, such that the page becomes cross-origin isolated (explanation at web.dev). Since Wasm is becoming well supported across browsers, many libraries (e.g. image editing, ML) and applications are starting to use it, and so the inability to set these headers in Github Pages is becoming a bigger and bigger problem (for me, at least).

Note that there are hacky workarounds, like this: https://github.com/gzuidhof/coi-serviceworker But these can cause a bunch of other problems. I think the emergence of libraries like that (which explicitly mention Github Pages in their README) is evidence enough that this feature should be added.

Thanks!

mithrendal · 2022-10-10T19:09:04Z

mithrendal
Oct 10, 2022

I want this too ...

1 reply

SuperBlueEyeBall Oct 25, 2024

I need this to run my godot project on my github pages site. 2 years without being fixed too!??!?

josephrocca · 2022-10-11T04:52:24Z

josephrocca
Oct 11, 2022
Author

For people who want a quick and very hacky workaround, include this script in your <head>:

https://github.com/josephrocca/clip-image-sorter/blob/main/enable-threads.js

(Note: You can't paste it inline - it needs to be in a separate script file and imported like <script src="enable-threads.js"></script>)

6 replies

utkrssh Mar 15, 2023

Setting require-corp instead of credentialless as Cross-Origin-Embedder-Policy makes it works in both, Chrome and Firefox.

josephrocca Jun 22, 2023
Author

Yep, credentialless is the best value to use here (because it doesn't block loading images from a cross-domain CDN, and other stuff like that), but it's quite new and not supported on Firefox or Safari yet, as of writing: https://caniuse.com/mdn-http_headers_cross-origin-embedder-policy_credentialless

iamshreeram Jul 11, 2024

@josephrocca ,

Thank you for sharing the script, this will be helpful if it works. I'm testing it on this page - https://shreeram.us/video.transcoder/. Unfortunately, it doesn't seem to be working for my specific situation in both Chrome and Firefox.

In Chrome, the "else" part is being triggered frequently, causing the page to continually reload.
In Firefox, I'm getting the following error message: Uncaught (in promise) TypeError: navigator.serviceWorker is undefined at line 53 and 68 of enable-threads.js.

I am using credentialless as it is supported in both Chrome and Firefox.

Appreciate any help here. thanks!

vitaly-castLabs Sep 14, 2024

Doesn't work for me. It gets me around SharedArrayBuffer checks, but nothing actually works

stereomatchingkiss Sep 14, 2024

Doesn't work for me. It gets me around SharedArrayBuffer checks, but nothing actually works

Use netlify, remember to place header like this one

mithrendal · 2022-10-11T19:41:43Z

mithrendal
Oct 11, 2022

@josephrocca my app is already using an own service worker which would conflict with the one you proposed... I also already tricked it to overwrite the headers ... nonetheless this feels still very hacky ... would prefer a straight forward solution where github would offer to allow to enable us COOP and COEP headers. Your script is interesting, mine for example did not consider request.mode == 'no-cors' ... thank you very much 👍, will continue to study and learn from it

0 replies

coatless · 2023-03-14T17:47:44Z

coatless
Mar 14, 2023

Any thoughts as to whether something akin to Netlify's header specification could be added? The lack of being able to address Cross-Origin-Opener-Policy (COOP) and Cross-Origin-Embedder-Policy (COEP) on a pro-developer portal is surprising.

0 replies

yoannchaudet · 2023-07-10T15:04:41Z

yoannchaudet
Jul 10, 2023

Hello,

This is a scenario we would support with custom headers. No ETA at the moment as to when this feature will be available.

5 replies

coatless Jul 18, 2023

Wonderful! Could we expect an approach like Netlify's header specification _headers to specify the custom header? Also, is there a way to look at a roadmap or public timeline view for updates? Or will you be updating the progress in this thread?

Cundiff7 Feb 2, 2024

Hi :)
Has there been any update to the timing of this feature? Thanks!

HarikrishnanBalagopal Feb 23, 2024

Same question here. Trying to use SharedArrayBuffer with Atomics.wait for async stuff in WebAssembly.
However since Github Pages isn't crossOriginIsolated it's not available.

Any update on if we can get at least a CORS headers checkbox in the Settings > GH Pages tab of a repo?

webJose Sep 9, 2024

Hello! As all others, I'm in the same boat. I created @wjfe/async-workers, and contains 5 synchronization objects based on Atomics and SharedArrayBuffer that I would like to showcase in its demo deployed in GitHub Pages, but currently cannot.

Is there an open issue that we can track ourselves regarding the feature that allows adding HTTP headers?

stereomatchingkiss Sep 9, 2024

Use netlify, remember to place header like this one

stereomatchingkiss · 2024-02-03T04:29:28Z

stereomatchingkiss
Feb 3, 2024

Hi :) Has there been any update to the timing of this feature? Thanks!

Use netlify

3 replies

Cundiff7 Feb 3, 2024

I ported to netlify, but i am still having trouble. My goal is to embed an HTML 5 game onto a webpage via itch.io. I have tried a few different things for the headers, but have not had luck. Any tips?

utkrssh Feb 4, 2024

[[headers]]
for = "/*"
  [headers.values]
    Cross-Origin-Opener-Policy = "same-origin"
    Cross-Origin-Embedder-Policy = "require-corp"

This had worked for me.

Cundiff7 Feb 7, 2024

I will check it out, thanks!

joyel24 · 2024-05-18T21:53:16Z

joyel24
May 18, 2024

Would be nice for Godot HTML5 export !

0 replies

DesignThinkerer · 2024-06-11T13:31:46Z

DesignThinkerer
Jun 11, 2024

Any update on this ? I'm attempting to setup a github page with wasm+sqlite, I'll share here if the workarounds mentioned in this thread are still working or not.

0 replies

moalhaddar · 2024-07-06T18:45:09Z

moalhaddar
Jul 6, 2024

Any updates? I want to publish a wasm example from my repository but i'm limited by this.

1 reply

joyel24 Jul 11, 2024

Any updates? I want to publish a wasm example from my repository but i'm limited by this.

Maybe if we ping @microsoft @github all together ! 😁

gregdan3 · 2024-07-23T14:22:27Z

gregdan3
Jul 23, 2024

Working on a data vis project that would greatly benefit from this! Mostly in response times, ehe.

0 replies

floooh · 2024-10-31T16:24:18Z

floooh
Oct 31, 2024

I would also greatly appreciate that for my WASM demos hosted on Github pages (e.g. https://floooh.github.io/sokol-html5/ or https://floooh.github.io/visualz80remix/), IMHO not being able to control COOP/COEP headers on simple web hosting services like Github is the one thing that's holding back WASM threading.

0 replies

This comment was marked as spam.

Sign in to view

Allow setting COOP and COEP headers in Github Pages #13309

Replies: 12 comments · 16 replies

josephrocca Oct 11, 2022 Author

josephrocca Jun 22, 2023 Author

This comment was marked as spam.

Replies: 12 comments 16 replies

josephrocca
Oct 11, 2022
Author

josephrocca Jun 22, 2023
Author