Ativar isolamento de origem cruzada (cross-origin isolation) numa página — necessário para usar recursos como SharedArrayBuffer ou medir memória com precisão — exige enviar o cabeçalho Cross-Origin-Embedder-Policy: require-corp. O problema é que, a partir daí, todo <iframe> de terceiros embutido na página precisa responder com Cross-Origin-Resource-Policy ou CORP, algo que você não controla quando o conteúdo é de outro domínio. O atributo credentialless resolve isso carregando o iframe num contexto efêmero, sem cookies nem credenciais, dispensando essa exigência.
O problema do COEP
Sem credentialless, uma página com COEP ativado simplesmente recusa carregar um iframe de terceiros que não tenha configurado os cabeçalhos corretos:
<!-- Página com Cross-Origin-Embedder-Policy: require-corp -->
<iframe src="https://widget-de-terceiro.com/embed"></iframe>
<!-- Bloqueado se o servidor do widget não enviar CORP -->
Pedir para cada provedor de widget, mapa ou player de vídeo ajustar os próprios cabeçalhos raramente é viável. Antes do credentialless, isso obrigava a escolher entre abrir mão do COEP ou abrir mão de embutir esse conteúdo.
Como funciona o atributo credentialless
Basta adicionar credentialless ao iframe. O navegador carrega o conteúdo num contexto novo, sem acesso a cookies, localStorage ou qualquer credencial da origem que está sendo embutida — como se fosse uma aba anônima só para aquele iframe:
<iframe src="https://widget-de-terceiro.com/embed" credentialless></iframe>
Como o iframe não carrega com credenciais, ele deixa de estar sujeito às regras de COEP: a página pode ter require-corp ativado e ainda assim embutir esse conteúdo, mesmo que o servidor de terceiro não envie nenhum cabeçalho de CORP.
Ativando via JavaScript
O mesmo comportamento pode ser definido programaticamente com a propriedade credentialless do elemento, útil quando o iframe é criado dinamicamente:
const iframe = document.createElement('iframe');
iframe.src = 'https://widget-de-terceiro.com/embed';
iframe.credentialless = true;
document.body.appendChild(iframe);
Antes de depender do recurso, vale checar o suporte em tempo de execução:
if ('credentialless' in HTMLIFrameElement.prototype) {
iframe.credentialless = true;
} else {
console.warn('credentialless não suportado neste navegador.');
}
Armazenamento particionado, não compartilhado
Um iframe credentialless não fica totalmente isolado de outros iframes credentialless: cookies e storage criados dentro dele são particionados por um identificador único gerado uma vez por documento de nível superior. Ou seja, dois iframes credentialless da mesma origem, na mesma página, podem compartilhar estado entre si — mas nada disso é visto pela versão "normal" (com credenciais) daquela mesma origem, nem persiste entre recarregamentos da página principal:
<iframe src="https://chat-widget.com/embed" credentialless></iframe>
<iframe src="https://chat-widget.com/notificacoes" credentialless></iframe>
<!-- Os dois podem compartilhar cookies entre si, mas não com
https://chat-widget.com acessado fora de um iframe credentialless -->
Quando usar
- Embutir widgets, players de vídeo ou mapas de terceiros numa página que precisa de isolamento de origem cruzada (
SharedArrayBuffer, WebAssembly com threads,performance.measureUserAgentSpecificMemory()). - Exibir anúncios ou conteúdo de terceiros sem depender desses provedores adicionarem cabeçalhos CORP.
- Renderizar HTML não confiável (como preview de conteúdo enviado por usuários) num contexto sem acesso a credenciais da origem original.
Cuidados
Por não carregar cookies nem credenciais, um iframe credentialless não é adequado para embutir conteúdo que dependa do usuário estar autenticado naquela origem — como um painel logado ou um formulário que exige sessão. Nesses casos, o conteúdo simplesmente carrega como se o usuário nunca tivesse feito login. O recurso também não é Baseline: hoje funciona em navegadores baseados em Chromium, mas ainda não tem suporte no Firefox nem no Safari, então é importante testar o comportamento de fallback antes de depender dele em produção.
Compatibilidade
Conclusão
O credentialless destrava um dos maiores atritos de adotar isolamento de origem cruzada: a dependência de que todo conteúdo de terceiro embutido também implemente COEP. Trocando credenciais por um contexto efêmero, ele permite manter o COEP ativo na página principal sem exigir nada dos serviços de terceiros embutidos nela.
0 Comentário
Deixe seu Comentário!
Dúvida, sugestão ou só um "valeu!" — tudo é bem-vindo por aqui.