[WIP] SPA 構成でデプロイできるようにする

[k-miyake]

ハンズオン当日のデプロイバックアップ先として GitHub Pages 等の静的ホスティングで実行できるかどうかを検証しておく。

[k-miyake]

@ubugeeei pnpm generate しただけでは起動しないようです。
画面上は Initializing WebContainer から先に進まず、ブラウザの Console では以下の例外が出ていました。

webcontainer.e7ca9335.js:1 Uncaught (in promise) DataCloneError: Failed to execute 'postMessage' on 'Worker': SharedArrayBuffer transfer requires self.crossOriginIsolated.
    at iframe.main.e7ca9335.js:1:75783
    at new Promise (<anonymous>)
    at _0x3169b5 (iframe.main.e7ca9335.js:1:75085)
    at Object.apply (iframe.main.e7ca9335.js:1:73217)
    at _0x4be0fb.init (iframe.main.e7ca9335.js:4:37654)

[ubugeeei]

なるほど，Worker...?

[ubugeeei]

これっぽいですね

https://webcontainers.io/guides/troubleshooting#webcontainers-not-loading-and-postmessage-error

[ubugeeei]

https://webcontainers.io/guides/quickstart#cross-origin-isolation

[ubugeeei]

@k-miyake

COOP/COEP headers を設定しないといけないみたいです．

https://webcontainers.io/guides/configuring-headers

GitHub Pages で設定ができるのか軽く確認して欲しいかもです

[ubugeeei]

netlify, cloudflare あたりはできるらしい

https://webcontainers.io/guides/configuring-headers#cloudflare

Nuxt の設定もあるけどこれは SSG の時には効くのか...? (効かなそう)

https://webcontainers.io/guides/configuring-headers#nuxt-3

[k-miyake]

@ubugeeei GitHub Pages には設定する場所がなさそうなので、素の Cloudflare Pages 等で試してみます。