Halaman ini diterjemahkan oleh Cloud Translation API.

Mengamankan interaksi pop-up dengan properti terbatas

Dapatkan isolasi lintas origin dan perlindungan kebocoran lintas situs saat berinteraksi dengan pop-up.

Arthur Hemery

Maud Nalpas

Nilai baru untuk Cross-Origin Opener Policy (COOP) tersedia: restrict-properties. Fitur ini memberikan manfaat keamanan dan mempermudah penerapan isolasi lintas origin sekaligus memungkinkan situs Anda berinteraksi dengan pop-up pihak ketiga untuk pembayaran, autentikasi, atau kasus penggunaan lainnya.

Untuk mulai bereksperimen dengan restrict-properties, ikuti uji coba origin mulai Chrome 116.

Alasan menggunakan `restrict-properties`

restrict-properties memiliki dua kasus penggunaan utama:

Mencegah kebocoran lintas situs tanpa kerusakan.
Membuat situs Anda diisolasi lintas origin.

Mencegah kebocoran lintas situs tanpa kerusakan

Secara default, situs apa pun dapat membuka aplikasi Anda dalam pop-up dan mendapatkan referensi ke aplikasi tersebut.

Situs berbahaya dapat memanfaatkan hal ini untuk melakukan serangan seperti kebocoran lintas situs. Untuk mengurangi risiko ini, Anda dapat menggunakan header Cross-Origin-Opener-Policy (COOP).

Sampai sekarang, opsi Anda untuk Cross-Origin-Opener-Policy terbatas. Anda dapat:

Tetapkan same-origin, yang memblokir semua interaksi lintas origin dengan pop-up.
Tetapkan same-origin-allow-popups, yang memblokir semua interaksi lintas origin yang membuka situs Anda dalam pop-up.
Tetapkan unsafe-none, yang mengizinkan semua interaksi lintas asal dengan pop-up.

Hal ini membuat situs yang tidak perlu dibuka di pop-up dan berinteraksi dengan pembuka untuk menerapkan COOP tidak mungkin dilakukan. Hal ini membuat kasus penggunaan utama seperti single sign-on dan pembayaran tidak terlindungi dari kebocoran lintas situs.

Cross-Origin-Opener-Policy: restrict-properties akan memecahkan masalah ini.

Dengan restrict-properties, properti yang dapat digunakan untuk penghitungan frame dan serangan kebocoran lintas situs lainnya tidak akan tersedia. Namun, komunikasi dasar antara jendela melalui postMessage dan closed diizinkan.

Tindakan ini akan meningkatkan keamanan situs sekaligus mempertahankan beberapa kasus penggunaan utama. Contoh:

Jika Anda menyediakan layanan di pop-up, menyetel Cross-Origin-Opener-Policy: restrict-properties akan melindungi diri Anda dari berbagai serangan kebocoran lintas situs. Anda tetap dapat membuka semua halaman yang sebelumnya dapat dibuka.
Jika Anda perlu mengakses pop-up lintas origin, menyetel Cross-Origin-Opener-Policy: restrict-properties juga akan melindungi situs Anda dari penghitungan iframe. Anda akan dapat membuka kumpulan {i>pop-up<i} yang sama dengan yang Anda buka hari ini.
Jika pembuka dan pembuka menetapkan header, dan halaman tersebut lintas origin, perilakunya mirip dengan salah satu yang menetapkan header. Jika berasal dari origin yang sama, akses penuh akan diberikan.

Membuat situs diisolasi lintas origin

Alasan kita memerlukan isolasi lintas asal

Beberapa web API meningkatkan risiko serangan side-channel seperti Spectre. Untuk mengurangi risiko tersebut, browser menawarkan lingkungan terisolasi berbasis keikutsertaan yang disebut isolasi lintas origin. Dengan status terisolasi lintas origin, halaman web dapat menggunakan fitur istimewa termasuk SharedArrayBuffer, performance.measureUserAgentSpecificMemory() dan timer presisi tinggi dengan resolusi yang lebih baik, sekaligus mengisolasi origin dari orang lain kecuali jika diikutsertakan.

Sebelumnya, Anda harus menetapkan Cross-Origin-Opener-Policy: same-origin untuk menggunakan API ini. Namun, tindakan ini akan mengganggu alur pop-up lintas origin yang mungkin Anda perlukan, seperti single sign-on dan Payments.

Cross-Origin-Opener-Policy: restrict-properties kini dapat digunakan sebagai pengganti Cross-Origin-Opener-Policy: same-origin untuk mengaktifkan isolasi lintas asal. Daripada memutuskan hubungan pembuka, tindakan ini hanya membatasinya ke subset komunikasi minimal window.postMessage() dan window.closed.

Anda akan dapat mengaktifkan isolasi lintas asal dengan dua header berikut:

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

atau

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

Pelajari credentialless lebih lanjut di Memuat resource lintas origin tanpa header CORP menggunakan COEP: credentialless.

Demo

Coba berbagai opsi header dalam demo isolasi lintas asal ini.

Bereksperimen dengan uji coba origin

Untuk bereksperimen dengan Cross-Origin-Opener-Policy: restrict-properties, pilih uji coba origin.

Dukungan browser

Cross-Origin-Opener-Policy: restrict-properties saat ini hanya didukung di Chrome. Browser lain aktif terlibat dalam diskusi terkait standardisasi.

FAQ

Situs saya harus berkomunikasi dengan pop-up origin yang sama, apakah saya harus menggunakan `COOP: restrict-properties` untuk mengaktifkan isolasi lintas asal?

Menetapkan COOP: restrict-properties pada pop-up dan halaman utama tidak akan menyebabkan pembatasan. Menetapkannya hanya di pop-up atau hanya di halaman utama akan mencegah akses ke properti selain postMessage dan closed di seluruh pembuka, meskipun keduanya berasal dari origin yang sama.

Apakah kumpulan properti yang diizinkan telah diperbaiki?

Berdasarkan masukan sejauh ini, window.postMessage dan window.closed diduga cukup untuk sebagian besar alur kerja, tetapi kami masih mempertimbangkan untuk membukanya ke properti lain. Jika Anda memiliki kasus penggunaan yang tidak dapat diselesaikan hanya dengan postMessage dan closed, berikan masukan Anda di thread Intent untuk Eksperimen.