Proteggi le interazioni popup con le proprietà di limitazione

Ottieni l'isolamento cross-origin e la protezione dalle perdite cross-site durante l'interazione con i popup.

Arthur Hemery

Maud Nalpas

È disponibile un nuovo valore per Cross-Origin Opener Policy (COOP): restrict-properties. Offre vantaggi in termini di sicurezza e semplifica l'adozione dell'isolamento cross-origin, consentendo al tuo sito di interagire con i popup di terze parti per pagamenti, autenticazione o altri casi d'uso.

Per iniziare a sperimentare con restrict-properties, partecipa alla prova dell'origine a partire da Chrome 116.

Perché utilizzare `restrict-properties`

restrict-properties ha due casi d'uso principali:

Prevenzione delle fughe di dati cross-site senza interruzioni.
Rendere il tuo sito con isolamento multiorigine.

Evitare fughe di informazioni cross-site senza interruzioni

Per impostazione predefinita, qualsiasi sito web può aprire la tua applicazione in un popup e ottenere un riferimento.

Un sito web dannoso può sfruttare questa situazione a proprio vantaggio per eseguire attacchi come cross-site leaks. Per mitigare questo rischio, puoi utilizzare l'intestazione Cross-Origin-Opener-Policy (COOP).

Finora, le opzioni per Cross-Origin-Opener-Policy erano limitate. Puoi:

Imposta same-origin,, che blocca tutte le interazioni multiorigine con i popup.
Imposta same-origin-allow-popups, che blocca tutte le interazioni multiorigine che aprono il tuo sito in un popup.
Imposta unsafe-none, che consente tutte le interazioni multiorigine con i popup.

In questo modo, i siti web che devono essere aperti in un popup e interagire con la pagina di apertura non possono applicare COOP. Ciò ha lasciato casi d'uso chiave come il single sign-on e i pagamenti non protetti dalle perdite cross-site.

Cross-Origin-Opener-Policy: restrict-properties risolve questo problema.

Con restrict-properties, le proprietà che possono essere utilizzate per il conteggio dei frame e altri attacchi di perdita cross-site non sono disponibili, ma è consentita la comunicazione di base tra le finestre tramite postMessage e closed.

In questo modo, la sicurezza di un sito viene migliorata mantenendo i casi d'uso chiave. Ad esempio:

Se fornisci un servizio in un popup, l'impostazione di Cross-Origin-Opener-Policy: restrict-properties ti proteggerà da una serie di attacchi di perdita di dati cross-site. Puoi comunque aprire tutte le pagine che potevi aprire in precedenza.
Se devi accedere a un popup multiorigine, l'impostazione Cross-Origin-Opener-Policy: restrict-properties proteggerà in modo simile il tuo sito dal conteggio degli iframe. Potrai aprire lo stesso insieme di popup che puoi aprire oggi.
Se sia l'apertura che l'apertura impostano l'intestazione e le pagine sono cross-origin, il comportamento è simile a quello di una delle due che ha impostato l'intestazione. Se hanno la stessa origine, viene concesso l'accesso completo.

Rendere il sito con isolamento multiorigine

Perché abbiamo bisogno dell'isolamento multiorigine

Alcune API web aumentano il rischio di attacchi side-channel come Spectre. Per mitigare questo rischio, i browser offrono un ambiente isolato basato sull'attivazione chiamato isolamento multiorigine. Con uno stato di isolamento multiorigine, la pagina web può utilizzare funzionalità privilegiate, tra cui SharedArrayBuffer, performance.measureUserAgentSpecificMemory() e timer ad alta precisione con una risoluzione migliore, isolando l'origine dalle altre, a meno che non abbiano attivato la funzionalità.

Finora, per utilizzare queste API, dovevi impostare Cross-Origin-Opener-Policy: same-origin. Tuttavia, questo interromperebbe qualsiasi flusso popup multiorigine di cui potresti avere bisogno, come l'accesso unico e i pagamenti.

Ora è possibile utilizzare Cross-Origin-Opener-Policy: restrict-properties anziché Cross-Origin-Opener-Policy: same-origin per attivare l'isolamento multiorigine. Anziché interrompere la relazione con l'apertura, la limita al sottoinsieme minimo di comunicazione di window.postMessage() e window.closed.

Potrai attivare l'isolamento cross-origin con le seguenti due intestazioni:

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

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

Scopri di più su credentialless all'indirizzo Carica risorse multiorigine senza intestazioni CORP utilizzando COEP: credentialless.

Demo

Prova varie opzioni di intestazione in questa demo dell'isolamento cross-origin.

Sperimenta con la prova dell'origine

Per sperimentare Cross-Origin-Opener-Policy: restrict-properties, partecipa alla prova dell'origine.

Supporto browser

Cross-Origin-Opener-Policy: restrict-properties è attualmente supportato solo in Chrome. Altri browser sono attivamente coinvolti nella discussione sulla standardizzazione.

Domande frequenti

Il mio sito web deve comunicare con i popup della stessa origine. Devo utilizzare `COOP: restrict-properties` per attivare l'isolamento multiorigine?

L'impostazione COOP: restrict-properties sia nel popup sia nella pagina principale non causerà restrizioni. Se lo imposti solo nel popup o solo nella pagina principale, impedirai l'accesso a proprietà diverse da postMessage e closed nell'apertura, anche se hanno la stessa origine.

Il set di proprietà consentite è fisso?

In base al feedback ricevuto finora, window.postMessage e window.closed sono sospettati di essere sufficienti per la maggior parte dei flussi di lavoro, ma stiamo ancora valutando la possibilità di aprirlo ad altre proprietà. Se hai un caso d'uso che non può essere risolto utilizzando solo postMessage e closed, lascia il tuo feedback nel thread Intent to Experiment.