[v3] The server must emit the COOP/COEP response headers to enable those (Warning)

[pieterjanmaes]

Hi,

When I navigate with NuxtLink I get following warning when I navigate the first time:

Ignoring inability to install OPFS sqlite3_vfs: Cannot install OPFS: Missing SharedArrayBuffer and/or Atomics. The server must emit the COOP/COEP response headers to enable those. See https://sqlite.org/wasm/doc/trunk/persistence.md#coop-coep

How can I add COOP/COEP response headers to the queryCollection composable?

dependencies used:

• "@nuxt/content": "^3.0.0"
• "nuxt": "^3.15.2"
• "vue": "latest"
• "vue-router": "latest"

[lenndewolten]

I encountered the same issue when deploying on Cloudflare Pages and resolved it by specifying the missing headers.
To fix this create a _headers file in the root directory of your project with the following content:

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

These headers are required for enabling cross-origin isolation, which allows features like OPFS.
The /* is a wildcard that enables these headers on every url.

A redeploy will resolve the warning. If you are using a different hosting provider, the fix will be the same, but the method for specifying headers may differ.

[stafyniaksacha]

A workaround is to use nuxt-security module with:

export default defineNuxtConfig({
  modules: ['nuxt-security'],
  security: {
    headers: {
      crossOriginEmbedderPolicy: 'require-corp',
      crossOriginOpenerPolicy: 'same-origin', // or 'credentialless'
    },
  },
})

Note that by default contentSecurityPolicy will be enabled, which may break your app in production, setup according to your usage.

[PikachuEXE]

For vercel use https://vercel.com/guides/how-to-enable-cors but replace the headers

Though I still got Ignoring inability to install OPFS sqlite3_vfs: The OPFS sqlite3_vfs cannot run in the main thread because it requires Atomics.wait()...

[farnabaz]

You can ignore this warning for the moment. It will be fixed in the next release.

Note that OPFS is required by SQLite-WASM to persist databases in browser storage. Nuxt Content does not use this feature; therefore, we can safely ignore it.