Cross-Origin-Embedder-Policy Memerlukan Opt-In Resource
Halaman web dapat memuat script, image, font, worker, frame, dan resource lain dari origin di luar origin miliknya. Dependensi tersebut sering melewati batas administratif sekaligus batas origin. Cross-Origin-Embedder-Policy (COEP) memungkinkan dokumen menetapkan kondisi yang lebih ketat sebelum browser memuat resource cross-origin ke dalam konteksnya.
Nilai restriktif yang umum adalah:
Cross-Origin-Embedder-Policy: require-corpDengan require-corp, resource cross-origin yang dimuat tanpa CORS harus secara eksplisit mengizinkan konteks embedding melalui Cross-Origin Resource Policy (CORP). Resource yang diambil dalam mode CORS dapat memenuhi pemeriksaan CORS yang relevan sebagai jalur alternatif.
COEP adalah embedder policy, bukan pernyataan bahwa semua resource remote dapat dipercaya. Policy ini mengubah syarat penerimaan resource; kode aplikasi tetap memerlukan kontrol integritas, otorisasi, dan konten yang sesuai.
require-corp mengubah default untuk resource no-CORS
Banyak elemen HTML dapat mengirim request dalam mode no-cors. Tanpa COEP, browser dapat memuat resource cross-origin yang memenuhi syarat meskipun response tidak membawa header CORP.
Dokumen dapat memperketat perilaku tersebut:
Cross-Origin-Embedder-Policy: require-corpResource cross-origin yang memang ditujukan bagi dokumen itu dapat memberi opt-in melalui response CORP yang sesuai, misalnya:
Cross-Origin-Resource-Policy: cross-originPemilik resource dapat memilih nilai CORP yang lebih sempit ketika deployment memungkinkan. Nilai tersebut berada pada response resource karena pemilik resource menyatakan tempat response boleh digunakan menurut semantik CORP.
Pembagian tanggung jawab ini penting secara operasional. Penambahan COEP pada aplikasi dapat menampakkan dependensi yang sebelumnya bekerja hanya karena browser menerima perilaku pemuatan cross-origin default.
CORS dan CORP adalah jalur penerimaan yang berbeda
COEP tidak mengubah CORP menjadi CORS. Keduanya menjawab persoalan yang berbeda.
Resource yang diminta dalam mode CORS dapat diterima ketika pertukaran CORS berhasil. Pada script module, API fetch, atau request lain yang memakai CORS, response Access-Control-Allow-Origin dari server ikut menentukan hasil tersebut.
Resource no-cors di bawah require-corp memerlukan policy CORP yang berlaku. Contohnya:
<img src="https://media.example/banner.png" alt="">Jika image tersebut diambil tanpa CORS dan response tidak memiliki header CORP yang kompatibel, COEP dapat memblokir penggunaannya oleh dokumen.
Mengubah request ke mode CORS bukan perbaikan kosmetik. Server remote harus mendukung request CORS dan mengirim response header yang diperlukan. Rencana deployment perlu mengelompokkan setiap dependensi berdasarkan request mode, bukan menambahkan header secara acak.
Credentialless mengubah penanganan kredensial no-CORS
COEP juga mendefinisikan nilai credentialless:
Cross-Origin-Embedder-Policy: credentiallessUntuk request cross-origin dalam mode no-cors, policy ini menghilangkan kredensial. Sebagai konsekuensinya, response tersebut tidak memerlukan opt-in CORP eksplisit hanya untuk memenuhi COEP. Request dengan mode lain tetap mengikuti aturan CORS normalnya.
Tradeoff ini dapat sesuai untuk resource publik yang tidak bergantung pada cookie atau autentikasi HTTP. Nilainya tidak setara dengan require-corp, dan resource yang responsenya berubah berdasarkan kredensial dapat rusak.
Sebelum memilih credentialless, periksa apakah dependensi mengharapkan cookie, identitas client, konten personal, atau redirect terautentikasi. Resource yang terlihat statis pada satu URL masih dapat berada di belakang infrastruktur yang sensitif terhadap kredensial.
COEP adalah satu bagian dari cross-origin isolation
Dokumen yang memerlukan lingkungan cross-origin isolated umumnya menggabungkan COEP dengan Cross-Origin Opener Policy yang kompatibel:
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corpCOOP dan COEP melindungi batas yang berbeda. COOP mengatur relasi opener top-level dan browsing context group. COEP mengatur penerimaan resource cross-origin untuk dokumen yang melakukan embedding.
Ketika persyaratan terkait terpenuhi, browser dapat mengekspos crossOriginIsolated sebagai true:
if (crossOriginIsolated) {
// Kode dapat memakai API yang mensyaratkan cross-origin isolation.
}Nilai boolean tersebut sebaiknya diperiksa saat runtime ketika perilaku aplikasi bergantung padanya. Keberadaan satu header pada konfigurasi server tidak menetapkan keseluruhan state browser.
Dependensi pihak ketiga menjadi bagian dari rollout
Deployment COEP sering gagal pada batas dependensi, bukan pada kode first-party. Script analytics, host media, layanan font, worker script, tool embedded, dan asset CDN dapat memiliki request mode serta response header yang berbeda.
Bangun inventaris dari traffic jaringan yang nyata. Untuk setiap dependensi cross-origin, catat pola URL, request mode, credential mode, rantai redirect, dan response header akhir. Redirect perlu diperiksa karena resource akhir tetap harus memenuhi policy yang berlaku pada request.
Resource yang dikendalikan organisasi lain mungkin tidak menyediakan response CORS atau CORP yang diperlukan. Dalam kondisi tersebut, aplikasi perlu mengubah integrasi, memakai endpoint yang kompatibel, atau tidak mengaktifkan policy yang tidak dapat dipenuhi dependensi. Mem-proxy resource pihak ketiga melalui origin aplikasi juga memindahkan tanggung jawab caching, keamanan, ketersediaan, dan validasi konten ke aplikasi tersebut.
Mode report-only dapat menampakkan masalah sebelum enforcement
COEP memiliki pasangan report-only:
Cross-Origin-Embedder-Policy-Report-Only: require-corpDeployment report-only dapat membantu menemukan resource yang akan bertentangan dengan policy tanpa langsung menerapkan pembatasan. Reporting tetap memerlukan konfigurasi pelaporan dan dukungan browser yang sesuai.
Perlakukan report sebagai bukti, bukan inventaris dependensi yang lengkap. Jalankan alur aplikasi nyata, termasuk area terautentikasi, antarmuka yang dimuat secara lazy, startup worker, halaman error, dan alur administratif yang jarang dipakai.
Setelah enforcement aktif, periksa response akhir sesudah pemrosesan CDN dan reverse proxy. Header yang ada di kode aplikasi tetapi dihapus atau diganti pada layer upstream tidak menghasilkan policy browser yang dimaksud.
Pertahankan kepemilikan resource secara eksplisit
COEP paling efektif ketika kepemilikan resource dan maksud embedding terlihat pada response HTTP. require-corp meminta dependensi cross-origin masuk melalui CORS yang berhasil atau policy CORP eksplisit. credentialless menyediakan batas berbeda untuk request no-CORS yang memenuhi syarat dengan menghilangkan kredensial.
Kedua mode tidak memvalidasi isi resource yang diizinkan. Script pihak ketiga yang telah dikompromikan tetap berbahaya jika aplikasi sengaja memuat dan mengeksekusinya. Subresource Integrity, CSP, pemisahan origin, peninjauan dependensi, dan otorisasi aplikasi menangani bagian risiko yang lain.
Properti yang diberikan COEP lebih sempit: embedding cross-origin berhenti menjadi asumsi ambient. Setiap dependensi harus memiliki jalur request dan response yang dapat diterima browser di bawah policy dokumen.
Referensi
- MDN, Cross-Origin-Embedder-Policy: https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Cross-Origin-Embedder-Policy
- MDN, Cross-Origin-Resource-Policy: https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Cross-Origin-Resource-Policy
- WHATWG HTML, cross-origin isolation: https://html.spec.whatwg.org/multipage/browsers.html