Proteggi le interazioni popup con le proprietà di limitazione

Ricevi isolamento cross-origin e protezione dalle fughe di dati cross-site durante l'interazione con i popup.

Arthur Hemery
Maud Nalpas
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 contempo al tuo sito di interagire con popup di terze parti per pagamenti, autenticazione o altri casi d'uso.

Per iniziare a eseguire esperimenti 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:

Evitare fughe di dati tra siti senza interruzioni

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

Un sito web dannoso può sfruttare questa situazione per eseguire attacchi come le fughe di dati tra siti. Per ridurre questo rischio, puoi utilizzare l'intestazione Cross-Origin-Opener-Policy (COOP).

Fino a oggi, le opzioni per Cross-Origin-Opener-Policy erano limitate. Puoi:

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

Ciò ha reso impossibile per i siti web che devono essere aperti in un popup e interagire con la pagina di apertura applicare la COOP. Ciò ha lasciato casi d'uso chiave come l'accesso singolo e i pagamenti non protetti dalle fughe di dati tra siti.

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

Con restrict-properties, le proprietà che possono essere utilizzate per il conteggio dei frame e per altri attacchi di fuga di dati tra siti 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 principali. Ad esempio:

  • Se offri un servizio in un popup, l'impostazione Cross-Origin-Opener-Policy: restrict-properties ti proteggerà da una serie di attacchi di fuga di dati tra siti. Puoi comunque aprire tutte le pagine che potevi aprire in precedenza.
  • Se devi accedere a un popup cross-origin, l'impostazione Cross-Origin-Opener-Policy: restrict-properties proteggerà allo stesso modo il tuo sito dal conteggio degli iframe. Potrai aprire lo stesso insieme di popup che puoi aprire oggi.
  • Se sia l'apertura sia la pagina aperta impostano l'intestazione e le pagine sono di origini diverse, il comportamento è simile a quello in cui è stata impostata l'intestazione da una delle due pagine. Se sono della 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 lato canale come Spectre. Per attenuare questo rischio, i browser offrono un ambiente isolato basato su attivazione chiamato isolamento multiorigine. Con uno stato di isolamento cross-origin, la pagina web può utilizzare funzionalità privilegiate, tra cui SharedArrayBuffer, performance.measureUserAgentSpecificMemory() e timer ad alta precisione con una risoluzione migliore, isolando al contempo l'origine dalle altre, a meno che non siano attivate.

Fino a questo momento, per utilizzare queste API era necessario impostare Cross-Origin-Opener-Policy: same-origin. Tuttavia, questo potrebbe interrompere qualsiasi flusso popup cross-origin di cui potresti avere bisogno, ad esempio l'accesso singolo e i pagamenti.

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

Potrai attivare l'isolamento cross-origin con i seguenti due parametri:

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

o

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

Scopri di più su credentialless in Carica risorse cross-origin senza intestazioni CORP utilizzando COEP: credentialless.

Demo

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

Sperimenta con la prova dell'origine

Per eseguire esperimenti su Cross-Origin-Opener-Policy: restrict-properties, attiva la prova dell'origine.

Supporto browser

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

Domande frequenti

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

L'impostazione di COOP: restrict-properties sia nel popup sia nella pagina principale non causerà limitazioni. Se lo imposti solo nel popup o solo nella pagina principale, impedirai qualsiasi accesso a proprietà diverse da postMessage e closed nell'opener, anche se sono della stessa origine.

L'insieme di proprietà consentite è fisso?

In base ai feedback ricevuti finora, window.postMessage e window.closed dovrebbero essere sufficienti per la maggior parte dei flussi di lavoro, ma stiamo ancora valutando la possibilità di aprirli 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.

Risorse