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 Membuat situs Anda "terisolasi lintas origin" menggunakan COOP dan COEP, kami menjelaskan cara mengadopsi status "terisolasi lintas origin" menggunakan COOP dan COEP. Ini adalah artikel pendamping yang menjelaskan alasan isolasi lintas asal 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 origin lain. Prinsip
ini membatasi cara situs dapat mengakses resource lintas origin. Misalnya, dokumen dari https://a.example
dicegah mengakses data yang dihosting di https://b.example
.
Namun, kebijakan origin yang sama memiliki beberapa pengecualian historis. Setiap situs dapat:
- Menyematkan iframe lintas origin
- Menyertakan resource lintas-asal seperti gambar atau skrip
- Membuka jendela pop-up lintas origin dengan referensi DOM
Jika web dapat dirancang dari awal, pengecualian ini tidak akan ada. Sayangnya, pada 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 untuk memastikan server mengizinkan berbagi resource dengan origin tertentu. Cara lainnya adalah dengan menghapus akses skrip langsung secara implisit ke resource lintas-asal sekaligus mempertahankan kompatibilitas mundur. Resource lintas origin
tersebut disebut resource "buram". Misalnya, inilah sebabnya
manipulasi piksel gambar lintas origin melalui CanvasRenderingContext2D
gagal kecuali jika CORS diterapkan ke gambar.
Semua keputusan kebijakan ini terjadi dalam grup konteks penjelajahan.
Selama bertahun-tahun, 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.
Semuanya berubah dengan
Spectre, yang
membuat data apa pun yang dimuat ke grup konteks penjelajahan yang sama dengan kode Anda
mungkin dapat dibaca. Dengan mengukur waktu yang diperlukan operasi tertentu, penyerang
dapat menebak konten cache CPU, dan melaluinya, konten
memori proses. Serangan pengaturan waktu semacam ini dapat dilakukan 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, penyerang dapat menggunakan
serangan Spectre untuk membaca data pikselnya, sehingga perlindungan yang mengandalkan
"ketidaktransparan" menjadi tidak efektif.
Idealnya, semua permintaan lintas-asal harus diperiksa secara eksplisit oleh server yang memiliki resource. Jika pemeriksaan tidak disediakan oleh server yang memiliki resource, data tidak akan pernah masuk ke grup konteks penjelajahan pelaku kejahatan, sehingga akan tetap berada di luar jangkauan serangan Spectre yang dapat dilakukan halaman web. Kami menyebutnya status yang diisolasi lintas asal. Inilah yang dimaksud dengan COOP+COEP.
Dalam status terisolasi lintas origin, situs yang meminta dianggap kurang
berbahaya dan hal ini 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 perubahan
document.domain
.
Kebijakan Penyemat Lintas Asal
Kebijakan Embedder Asal-Lintas (COEP) mencegah dokumen memuat resource lintas-asal yang tidak secara eksplisit memberikan izin dokumen (menggunakan CORP atau CORS). Dengan fitur ini, Anda dapat mendeklarasikan bahwa dokumen tidak dapat memuat resource tersebut.
Untuk mengaktifkan kebijakan ini, tambahkan header HTTP berikut ke dokumen:
Cross-Origin-Embedder-Policy: require-corp
COEP menggunakan satu nilai require-corp
. Hal ini menerapkan kebijakan bahwa dokumen hanya dapat memuat resource dari origin yang sama, atau resource yang secara eksplisit ditandai sebagai dapat dimuat dari origin lain.
Agar dapat dimuat dari origin lain, resource 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 ditayangkan dengan header CORS, gunakan atribut crossorigin
sehingga permintaan untuk mengambil resource akan menggunakan mode CORS. Hal ini juga mencegah gambar dimuat, kecuali jika menetapkan header CORS.
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 untuk siapa yang dapat memuat resource.
Header Cross-Origin-Resource-Policy
memiliki tiga kemungkinan nilai:
Cross-Origin-Resource-Policy: same-site
Resource yang ditandai same-site
hanya dapat dimuat dari situs yang sama.
Cross-Origin-Resource-Policy: same-origin
Resource yang ditandai same-origin
hanya dapat dimuat dari origin yang sama.
Cross-Origin-Resource-Policy: cross-origin
Resource yang ditandai cross-origin
dapat dimuat oleh situs mana pun. (Nilai
ini ditambahkan ke
spesifikasi CORP bersama dengan COEP.)
Kebijakan Pembuka Lintas Asal
Kebijakan Pembuka Lintas Asal
(COOP) memungkinkan Anda memastikan
bahwa jendela tingkat atas diisolasi 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 pop-up, properti
window.opener
-nya akan menjadi null
. Selain itu, properti .closed
dari
referensi pembuka ke properti tersebut akan menampilkan true
.
Header Cross-Origin-Opener-Policy
memiliki tiga kemungkinan nilai:
Cross-Origin-Opener-Policy: same-origin
Dokumen yang ditandai same-origin
dapat berbagi grup konteks browser yang sama dengan dokumen dengan origin yang sama yang juga ditandai secara eksplisit same-origin
.
Cross-Origin-Opener-Policy: same-origin-allow-popups
Dokumen tingkat teratas dengan same-origin-allow-popups
mempertahankan referensi ke
popup yang tidak menetapkan COOP atau yang memilih tidak ikut isolasi dengan
menetapkan COOP unsafe-none
.
Cross-Origin-Opener-Policy: unsafe-none
unsafe-none
adalah default dan memungkinkan dokumen ditambahkan ke grup konteks browser
pembukanya, kecuali jika pembuka itu sendiri memiliki COOP same-origin
.
Ringkasan
Jika Anda menginginkan akses yang terjamin ke fitur canggih seperti SharedArrayBuffer
,
performance.measureUserAgentSpecificMemory()
, atau timer
resolusi tinggi dengan presisi yang lebih baik, ingatlah
bahwa dokumen Anda harus menggunakan COEP dengan nilai require-corp
dan
COOP dengan nilai same-origin
. Jika tidak ada salah satu dari 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.