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. Artikel ini adalah artikel pendamping yang menjelaskan alasan isolasi lintas asal diperlukan untuk mengaktifkan fitur canggih di browser.
Latar belakang
Web dibangun berdasarkan kebijakan asal 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 dicegah mengakses data yang dihosting di https://b.example.
Namun, kebijakan origin yang sama memiliki beberapa pengecualian historis. Situs mana pun dapat:
- Menyematkan iframe lintas origin
- Menyertakan 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, pada saat komunitas web menyadari manfaat utama dari kebijakan asal yang sama secara ketat, web sudah mengandalkan pengecualian ini.
Efek samping keamanan dari kebijakan origin yang sama yang longgar tersebut telah diperbaiki dengan dua cara. Salah satu caranya adalah dengan memperkenalkan protokol baru yang disebut Cross
Origin Resource Sharing (CORS)
yang tujuannya adalah untuk memastikan bahwa server mengizinkan berbagi resource dengan
asal tertentu. Cara lainnya adalah dengan menghapus secara implisit akses skrip langsung ke resource lintas-origin sambil mempertahankan kompatibilitas mundur. Resource
lintas origin tersebut disebut resource "buram". Misalnya, inilah alasan mengapa manipulasi piksel gambar lintas origin melalui CanvasRenderingContext2D gagal kecuali jika CORS diterapkan pada gambar.
Semua keputusan kebijakan ini terjadi dalam grup konteks penjelajahan.
Sejak 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.
Semua ini 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 diperlukan untuk operasi tertentu, penyerang
dapat menebak isi cache CPU, dan dengan demikian, isi memori
proses. Serangan waktu seperti itu dapat terjadi dengan timer bergranularitas rendah
yang ada di platform, tetapi dapat dipercepat dengan timer bergranularitas tinggi,
baik eksplisit (seperti performance.now()) maupun implisit (seperti
SharedArrayBuffers). Jika evil.com menyematkan gambar lintas origin, mereka dapat menggunakan serangan Spectre untuk membaca data pikselnya, yang membuat perlindungan yang mengandalkan "keopaquekan" menjadi tidak efektif.
Idealnya, semua permintaan lintas origin harus diperiksa secara eksplisit oleh server yang memiliki resource. Jika pemeriksaan tidak disediakan oleh server pemilik resource, data tidak akan pernah masuk ke grup konteks penjelajahan aktor jahat, dan oleh karena itu akan tetap berada di luar jangkauan serangan Spectre yang dapat dilakukan halaman web. Kami menyebutnya sebagai status terisolasi lintas asal. Inilah yang dimaksud dengan COOP+COEP.
Dalam status terisolasi lintas origin, situs yang meminta dianggap kurang berbahaya dan hal ini memungkinkan 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 asal yang tidak memberikan izin secara eksplisit kepada dokumen (menggunakan CORP atau CORS). Dengan fitur ini, Anda dapat menyatakan 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 asal mendukung Cross Origin Resource Sharing (CORS), Anda dapat menggunakan atribut crossorigin untuk memuatnya ke halaman web Anda 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 agar permintaan untuk mengambil resource akan menggunakan mode CORS. Hal ini juga mencegah gambar dimuat kecuali jika gambar tersebut 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 benar.
Kebijakan Resource Lintas Asal
Cross Origin Resource Policy (CORP) awalnya diperkenalkan sebagai opsi keikutsertaan untuk melindungi resource Anda agar tidak dimuat oleh asal lain. Dalam konteks COEP, CORP dapat menentukan kebijakan pemilik resource tentang 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.)
Cross Origin Opener Policy
Cross Origin Opener Policy
(COOP) memungkinkan Anda memastikan
bahwa jendela tingkat atas diisolasi dari dokumen lain dengan menempatkannya dalam
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 penjelajahan yang sama dengan dokumen yang berasal dari origin yang sama yang juga ditandai secara eksplisit sebagai same-origin.
Cross-Origin-Opener-Policy: same-origin-allow-popups
Dokumen tingkat teratas dengan same-origin-allow-popups mempertahankan referensi ke pop-upnya yang tidak menetapkan COOP atau yang memilih untuk tidak diisolasi dengan menetapkan COOP unsafe-none.
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, 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 asal" menggunakan COOP dan COEP.