O que é Cross-Origin-Opener-Policy (COOP) e Cross-Origin-Embedder-Policy (COEP)?

Cross-Origin-Opener-Policy (COOP) e Cross-Origin-Embedder-Policy (COEP) são dois cabeçalhos de resposta HTTP introduzidos pelo Chromium em 2020 e hoje suportados por todos os principais navegadores (Chrome 83+, Firefox 79+, Safari 15.2+). COOP controla se uma página partilha o seu grupo de contexto de navegação com janelas que abre ou que a abriram; COEP controla se a página pode carregar sub-recursos cross-origin. Combinar COOP: same-origin com COEP: require-corp ou credentialless coloca a página em modo "cross-origin isolated", necessário para usar SharedArrayBuffer, performance.measureUserAgentSpecificMemory() e timers de alta precisão de performance.now(). Fazem parte do hardening pós-Spectre do navegador, juntamente com Cross-Origin-Resource-Policy (CORP).

Porque foram introduzidos COOP e COEP?

Em janeiro de 2018 as vulnerabilidades de canal lateral de CPU Spectre e Meltdown (CVE-2017-5753, CVE-2017-5715, CVE-2017-5754) mostraram que JavaScript malicioso pode ler memória de outras origens dentro do mesmo processo de renderização. Os navegadores desativaram SharedArrayBuffer e reduziram a resolução de performance.now() de microssegundos para 100 µs. COOP e COEP permitem pedir explicitamente um contexto isolado por processo e limpo em cross-origin.

O que faz Cross-Origin-Opener-Policy (COOP)?

• unsafe-none — por defeito.
• same-origin-allow-popups — popups abertos por ti mantêm a referência.
• same-origin — isolamento total.

Cross-Origin-Opener-Policy: same-origin

O que faz Cross-Origin-Embedder-Policy (COEP)?

• unsafe-none — por defeito.
• require-corp — cada sub-recurso cross-origin tem de optar por Cross-Origin-Resource-Policy: cross-origin ou CORS.
• credentialless — desde Chrome 96 (outubro 2021). Pedidos cross-origin sem cookies.

Cross-Origin-Embedder-Policy: require-corp

O que é cross-origin isolation?

if ( self.crossOriginIsolated ) {
  // SharedArrayBuffer e timers de alta resolução disponíveis
}

Sem isolamento, navegadores modernos bloqueiam new SharedArrayBuffer() e arredondam performance.now() para 100 µs.

Quando preciso de COOP e COEP num site WordPress?

• Não precisas num site de conteúdo, blog ou WooCommerce normal. Ativar pode partir embeds (YouTube, Maps, Stripe, Facebook).
• Precisas se executas WebAssembly multi-thread (Photopea, Figma, FFmpeg.wasm), edição de vídeo no browser, jogos Emscripten ou medições de perf precisas.
• Só COOP (same-origin-allow-popups) é útil em páginas de login e dashboards contra tabnabbing.

Como configurar COOP e COEP em WordPress?

Apache:

<IfModule mod_headers.c>
  Header set Cross-Origin-Opener-Policy "same-origin"
  Header set Cross-Origin-Embedder-Policy "require-corp"
  Header set Cross-Origin-Resource-Policy "same-site"
</IfModule>

Nginx:

add_header Cross-Origin-Opener-Policy "same-origin" always;
add_header Cross-Origin-Embedder-Policy "require-corp" always;
add_header Cross-Origin-Resource-Policy "same-site" always;

O que parte ao ativar COEP: require-corp?

• iframes do YouTube e Vimeo.
• Google Fonts sem CORS.
• Avatares externos como Gravatar.
• Pixels de tracking, Stripe.js, hCaptcha.

DevTools » Rede » coluna "Bloqueado" mostra os culpados. credentialless alivia o requisito.

Como testar se o meu site está cross-origin isolated?

1. Abrir o site no Chrome.
2. DevTools (F12) » Application » Frames » top » ver "Cross-Origin Isolated: Yes".
3. Ou executar self.crossOriginIsolated na consola.

O que o InspectWP verifica

O InspectWP analisa cada cabeçalho HTTP de resposta da página rastreada e reporta a presença e o valor de Cross-Origin-Opener-Policy, Cross-Origin-Embedder-Policy e Cross-Origin-Resource-Policy na secção Segurança. A ausência é marcada como aviso, não crítico, já que a maioria dos sites não precisa de isolamento completo.