Alasan Anda perlu "isolasi lintas asal" untuk mendapatkan fitur canggih

Pelajari alasan isolasi lintas asal diperlukan untuk menggunakan fitur canggih seperti SharedArrayBuffer, performance.measureUserAgentSpecificMemory(), dan timer resolusi tinggi dengan presisi yang lebih baik.

Pengantar

Dalam artikel Membuat situs Anda "diisolasi lintas origin" menggunakan COOP dan COEP, kami menjelaskan cara menerapkan status "isolasi lintas origin" menggunakan COOP dan COEP. Ini adalah artikel pendamping yang menjelaskan alasan isolasi lintas origin diperlukan untuk mengaktifkan fitur canggih di browser.

Latar belakang

Web dibuat berdasarkan kebijakan origin yang sama: fitur keamanan yang membatasi cara dokumen dan skrip dapat berinteraksi dengan resource dari asal lain. Prinsip ini membatasi cara situs dapat mengakses resource lintas origin. Misalnya, dokumen dari https://a.example tidak dapat mengakses data yang dihosting di https://b.example.

Namun, kebijakan dari origin yang sama memiliki beberapa pengecualian historis. Situs apa pun dapat:

  • Menyematkan iframe lintas origin
  • Sertakan resource lintas origin seperti gambar atau skrip
  • Membuka jendela pop-up lintas origin dengan referensi DOM

Jika web dapat didesain dari awal, pengecualian ini tidak akan ada. Sayangnya, saat komunitas web menyadari manfaat utama dari kebijakan origin yang sama yang ketat, web sudah mengandalkan pengecualian ini.

Efek samping keamanan dari kebijakan origin yang sama yang longgar tersebut di-patch dengan dua cara. Salah satu caranya adalah melalui pengenalan protokol baru yang disebut Cross Origin Resource Sharing (CORS) yang tujuannya adalah memastikan server memungkinkan berbagi resource dengan asal tertentu. Cara lainnya adalah dengan secara implisit menghapus akses skrip langsung ke resource lintas origin sekaligus mempertahankan kompatibilitas mundur. Resource lintas asal tersebut disebut resource "buram". Sebagai contoh, di sinilah manipulasi piksel pada gambar lintas asal melalui CanvasRenderingContext2D akan gagal kecuali jika CORS diterapkan pada gambar.

Semua keputusan kebijakan ini terjadi dalam grup konteks penjelajahan.

Grup Konteks Penjelajahan

Untuk waktu yang lama, kombinasi CORS dan resource buram sudah cukup untuk membuat browser aman. Terkadang kasus ekstrem (seperti kerentanan JSON) ditemukan dan perlu di-patch, tetapi secara keseluruhan prinsip untuk tidak mengizinkan akses baca langsung ke byte mentah resource lintas origin berhasil.

Ini semua berubah dengan Spectre, yang membuat data apa pun yang dimuat ke grup konteks penjelajahan yang sama dengan kode Anda berpotensi dapat dibaca. Dengan mengukur waktu yang dibutuhkan operasi tertentu, penyerang dapat menebak konten cache CPU, dan melalui itu, konten memori proses. Serangan pengaturan waktu tersebut dapat terjadi dengan timer dengan tingkat perincian rendah yang ada di platform, tetapi dapat dipercepat dengan timer dengan tingkat perincian tinggi, baik eksplisit (seperti performance.now()) maupun implisit (seperti SharedArrayBuffer). Jika evil.com menyematkan gambar lintas origin, dia dapat menggunakan serangan Spectre untuk membaca data pikselnya, yang membuat perlindungan yang mengandalkan "keburaman" menjadi tidak efektif.

Spek

Idealnya, semua permintaan lintas origin harus diperiksa secara eksplisit oleh server yang memiliki resource tersebut. Jika pemeriksaan tidak disediakan oleh server yang memiliki resource, data tidak akan pernah masuk ke dalam grup konteks penjelajahan pelaku kejahatan, sehingga akan jauh dari serangan Spectre yang dapat dilakukan oleh halaman web. Kami menyebutnya status terisolasi lintas asal. Inilah yang dimaksud dengan COOP+COEP.

Dalam status yang diisolasi lintas origin, situs yang meminta dianggap tidak terlalu berbahaya dan hal ini akan membuka fitur canggih seperti SharedArrayBuffer, performance.measureUserAgentSpecificMemory(), dan timer resolusi tinggi dengan presisi yang lebih baik yang dapat digunakan untuk serangan seperti Spectre. Hal ini juga mencegah modifikasi document.domain.

Kebijakan Penyemat Lintas Asal

Cross Origin Embedder Policy (COEP) mencegah dokumen memuat resource lintas origin apa pun yang tidak secara eksplisit memberikan izin dokumen (menggunakan CORP atau CORS). Dengan fitur ini, Anda dapat mendeklarasikan bahwa dokumen tidak dapat memuat resource tersebut.

Cara kerja COEP

Untuk mengaktifkan kebijakan ini, tambahkan header HTTP berikut ke dokumen:

Cross-Origin-Embedder-Policy: require-corp

Kata kunci require-corp adalah satu-satunya nilai yang diterima untuk COEP. Tindakan ini menerapkan kebijakan bahwa dokumen hanya dapat memuat resource dari asal yang sama, atau resource yang ditandai secara eksplisit sebagai dapat dimuat dari asal lain.

Agar resource dapat dimuat dari origin lain, resource tersebut harus mendukung Cross Origin Resource Sharing (CORS) atau Cross Origin Resource Policy (CORP).

Cross-Origin Resource Sharing (CORS)

Jika resource lintas origin mendukung Cross Origin Resource Sharing (CORS), Anda dapat menggunakan atribut crossorigin untuk memuatnya ke halaman web tanpa diblokir oleh COEP.

<img src="https://third-party.example.com/image.jpg" crossorigin>

Misalnya, jika resource gambar ini disalurkan dengan header CORS, gunakan atribut crossorigin sehingga permintaan untuk mengambil resource akan menggunakan mode CORS. Tindakan ini juga mencegah gambar dimuat kecuali jika header CORS ditetapkan.

Demikian pula, Anda dapat mengambil data lintas origin melalui metode fetch(), yang tidak memerlukan penanganan khusus selama server merespons dengan header HTTP yang tepat.

Kebijakan Resource Lintas Asal

Cross Origin Resource Policy (CORP) awalnya diperkenalkan sebagai keikutsertaan untuk melindungi resource Anda agar tidak dimuat oleh origin lain. Dalam konteks COEP, CORP dapat menentukan kebijakan pemilik resource terkait siapa yang dapat memuat resource.

Header Cross-Origin-Resource-Policy memiliki tiga kemungkinan nilai:

Cross-Origin-Resource-Policy: same-site

Resource yang ditandai sebagai same-site hanya dapat dimuat dari situs yang sama.

Cross-Origin-Resource-Policy: same-origin

Resource yang ditandai sebagai same-origin hanya dapat dimuat dari asal yang sama.

Cross-Origin-Resource-Policy: cross-origin

Resource yang ditandai sebagai cross-origin dapat dimuat oleh situs mana pun. (Nilai ini ditambahkan ke spesifikasi CORP bersama dengan COEP.)

Kebijakan Pembuka Lintas Asal

Cross Origin Opener Policy (COOP) memungkinkan Anda memastikan bahwa jendela tingkat atas terisolasi dari dokumen lain dengan menempatkannya di grup konteks penjelajahan yang berbeda, sehingga tidak dapat berinteraksi langsung dengan jendela tingkat atas. Misalnya, jika dokumen dengan COOP membuka jendela pop-up, properti window.opener-nya akan menjadi null. Selain itu, properti .closed dari referensi pembukanya akan menampilkan true.

COOP

Header Cross-Origin-Opener-Policy memiliki tiga kemungkinan nilai:

Cross-Origin-Opener-Policy: same-origin

Dokumen yang ditandai sebagai same-origin dapat memiliki grup konteks penjelajahan yang sama dengan dokumen asal yang sama yang juga ditandai secara eksplisit same-origin.

COOP

Cross-Origin-Opener-Policy: same-origin-allow-popups

Dokumen tingkat atas dengan same-origin-allow-popups akan mempertahankan referensi ke salah satu pop-upnya yang tidak menetapkan COOP atau yang memilih untuk tidak diisolasi dengan menetapkan COOP unsafe-none.

COOP

Cross-Origin-Opener-Policy: unsafe-none

unsafe-none adalah default dan memungkinkan dokumen ditambahkan ke grup konteks penjelajahan pembukanya, kecuali jika pembuka itu sendiri memiliki COOP same-origin.

Ringkasan

Jika Anda menginginkan akses terjamin ke fitur canggih seperti SharedArrayBuffer, performance.measureUserAgentSpecificMemory(), atau timer resolusi tinggi dengan presisi yang lebih baik, ingat bahwa dokumen Anda harus menggunakan COEP dengan nilai require-corp dan COOP dengan nilai same-origin. Jika tidak ada keduanya, browser tidak akan menjamin isolasi yang memadai untuk mengaktifkan fitur canggih tersebut dengan aman. Anda dapat menentukan situasi halaman dengan memeriksa apakah self.crossOriginIsolated menampilkan true.

Pelajari langkah-langkah untuk menerapkannya di Membuat situs Anda "terisolasi lintas origin" menggunakan COOP dan COEP.

Referensi