Esta página foi traduzida pela API Cloud Translation.

Interações pop-up seguras com propriedades de restrição

Tenha isolamento entre origens e proteção contra vazamentos entre sites ao interagir com pop-ups.

Arthur Hemery

Maud Nalpas

Um novo valor para a política de abertura entre origens (COOP) está disponível: restrict-properties. Ele traz benefícios de segurança e facilita a adoção do isolamento entre origens, permitindo que seu site interaja com pop-ups de terceiros para pagamentos, autenticação ou outros casos de uso.

Para começar a testar o restrict-properties, participe do teste de origem a partir do Chrome 116.

Por que usar `restrict-properties`

restrict-properties tem dois casos de uso principais:

Evite vazamentos entre sites sem causar problemas.
Faça com que seu site seja isolado de origem cruzada.

Evitar vazamentos sem interrupções entre locais

Por padrão, qualquer site pode abrir seu aplicativo em um pop-up e receber uma referência dele.

Um site malicioso pode usar isso a seu favor para realizar ataques, como vazamentos entre sites. Para reduzir esse risco, use o cabeçalho Cross-Origin-Opener-Policy (COOP).

Até agora, suas opções de Cross-Origin-Opener-Policy eram limitadas. Você pode:

Defina same-origin,, que bloqueia todas as interações entre origens com pop-ups.
Defina same-origin-allow-popups, que bloqueia todas as interações de origem cruzada que abrem o site em um pop-up.
Defina unsafe-none, que permite todas as interações de origem cruzada com pop-ups.

Isso tornou impossível para sites que precisam ser abertos em um pop-up e interagir com o abridor para aplicar o COOP. Isso deixava casos de uso importantes, como logon único e pagamentos, desprotegidos contra vazamentos entre sites.

Cross-Origin-Opener-Policy: restrict-properties resolve esse problema.

Com restrict-properties, as propriedades que podem ser usadas para contagem de frames e outros ataques de vazamento entre sites não estão disponíveis, mas a comunicação básica entre janelas por postMessage e closed é permitida.

Isso melhora a segurança de um site e mantém os principais casos de uso. Exemplo:

Se você oferecer um serviço em um pop-up, a configuração Cross-Origin-Opener-Policy: restrict-properties vai proteger você contra vários ataques de vazamento entre sites. Você ainda pode abrir todas as páginas que abria antes.
Se você precisar acessar um pop-up entre origens, definir Cross-Origin-Opener-Policy: restrict-properties protegerá seu site da contagem de iframes. Você poderá abrir o mesmo conjunto de pop-ups que pode abrir hoje.
Se o abridor e o abertor definirem o cabeçalho e as páginas forem de origem cruzada, o comportamento será semelhante ao de um deles ter definido o cabeçalho. Se forem da mesma origem, o acesso total será permitido.

Deixar o site isolado de origem cruzada

Por que precisamos do isolamento de origem cruzada

Algumas APIs da Web aumentam o risco de ataques de canal lateral, como o Spectre. Para mitigar esse risco, os navegadores oferecem um ambiente isolado baseado em ativação chamado isolamento de origem cruzada. Com um estado isolado entre origens, a página da Web pode usar recursos privilegiados, incluindo SharedArrayBuffer, performance.measureUserAgentSpecificMemory() e timers de alta precisão com uma resolução melhor, isolando a origem de outras, a menos que elas sejam ativadas.

Até agora, para usar essas APIs, era necessário definir Cross-Origin-Opener-Policy: same-origin. No entanto, isso interromperia qualquer fluxo de pop-up entre origens que você precisa, como login único e pagamentos.

Agora, Cross-Origin-Opener-Policy: restrict-properties pode ser usado em vez de Cross-Origin-Opener-Policy: same-origin para ativar o isolamento entre origens. Em vez de interromper a relação com o abridor, ele apenas a restringe ao subconjunto de comunicação mínimo de window.postMessage() e window.closed.

Use os dois cabeçalhos a seguir para ativar o isolamento de origem cruzada:

Cross-Origin-Opener-Policy: restrict-properties
Cross-Origin-Embedder-Policy: require-corp

Cross-Origin-Opener-Policy: restrict-properties
Cross-Origin-Embedder-Policy: credentialless

Saiba mais sobre credentialless em Carregar recursos entre origens sem cabeçalhos CORP usando COEP: credentialless.

Demonstração

Teste várias opções de cabeçalho nesta demonstração de isolamento entre origens diferentes.

Testar o teste de origem

Para testar o Cross-Origin-Opener-Policy: restrict-properties, participe do teste de origem.

Suporte ao navegador

Atualmente, o Cross-Origin-Opener-Policy: restrict-properties só é aceito no Chrome. Outros navegadores estão ativamente envolvidos na discussão sobre padronização.

Perguntas frequentes

Meu site precisa se comunicar com pop-ups de mesma origem. Devo usar `COOP: restrict-properties` para ativar o isolamento de origem cruzada?

Definir COOP: restrict-properties no pop-up e na página principal não vai causar restrições. Definir essa propriedade apenas no pop-up ou apenas na página principal vai impedir qualquer acesso a propriedades diferentes de postMessage e closed no abridor, mesmo que sejam de mesma origem.

O conjunto de propriedades permitidas é fixo?

Com base no feedback até agora, window.postMessage e window.closed devem ser suficientes para a maioria dos fluxos de trabalho, mas ainda estamos considerando abrir para outras propriedades. Se você tiver um caso de uso que não possa ser resolvido usando apenas postMessage e closed, envie seu feedback na linha de execução da Intent to Experiment.