Chrome menonaktifkan modifikasi document.domain

Jika situs Anda mengandalkan setelan document.domain, tindakan Anda diperlukan.

Maud Nalpas

Eiji Kitamura

Peringatan: Seperti yang telah kami umumkan pada Januari 2022, kami tidak lagi menggunakan penyetel document.domain mulai Chrome 115. Jika situs Anda mengandalkan pelonggaran kebijakan origin yang sama melalui document.domain, Anda harus segera mengambil tindakan. Perhatikan bahwa penggunaan penyetel document.domain (document.domain = ...) tidak akan menampilkan pengecualian. Hal ini hanya akan berhenti berpengaruh. Lanjutkan membaca lebih lanjut alasan perubahan ini atau lanjutkan ke kode alternatif yang dapat Anda terapkan.

Apa yang berubah, dan mengapa?

Mulai Chrome 115, situs tidak akan dapat menetapkan document.domain: Chrome akan membuat document.domain tidak dapat diubah. Untuk berkomunikasi lintas origin, Anda perlu menggunakan pendekatan alternatif, seperti postMessage() atau Channel Messaging API.

Perhatikan bahwa perubahan ini akan diluncurkan secara bertahap.

Kami memperkirakan browser lain pada akhirnya akan menghentikan penggunaan dan menghapus fungsi ini. Tinjau bagian kompatibilitas browser untuk mengetahui detailnya.

Mengapa membuat document.domain tidak dapat diubah?

document.domain dirancang untuk mendapatkan atau menetapkan nama host origin. Banyak situs menetapkan document.domain untuk mengizinkan komunikasi antarhalaman situs yang sama, tetapi lintas origin.

Meskipun ini adalah teknik yang nyaman, teknik ini menimbulkan risiko keamanan, karena melonggarkan kebijakan asal yang sama. Masalah keamanan seputar document.domain telah menyebabkan perubahan dalam spesifikasi yang memperingatkan pengguna untuk tidak menggunakannya.

Secara mendetail: Mengapa membuat document.domain tidak dapat diubah?

Cara document.domain digunakan saat ini

Banyak situs menetapkan document.domain untuk mengizinkan komunikasi antarhalaman situs yang sama, tetapi lintas origin.

Situs yang sama tetapi lintas-asal memiliki eTLD+1 yang sama, tetapi subdomainnya berbeda.

Berikut cara penggunaan document.domain hingga saat ini:

Misalnya, halaman di https://parent.example.com menyematkan halaman iframe dari https://video.example.com. Halaman ini memiliki eTLD+1 (example.com) yang sama dengan subdomain yang berbeda. Jika document.domain kedua halaman ditetapkan ke 'example.com', browser akan memperlakukan kedua origin seolah-olah berasal dari origin yang sama.

Tetapkan document.domain untuk https://parent.example.com:

// Confirm the current origin of "parent.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

Tetapkan document.domain untuk https://video.example.com:

// Confirm the current origin of "video.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

Sekarang Anda dapat membuat manipulasi DOM lintas origin di https://parent.example.com terhadap https://video.example.com.

Situs menetapkan document.domain untuk memungkinkan dokumen di situs yang sama berkomunikasi dengan lebih mudah. Karena perubahan ini melonggarkan kebijakan asal yang sama, halaman induk dapat mengakses dokumen iframe dan menjelajahi hierarki DOM, dan sebaliknya.

Ini adalah teknik yang praktis, tetapi menimbulkan risiko keamanan.

Masalah keamanan pada document.domain

Masalah keamanan seputar document.domain telah menyebabkan perubahan pada spesifikasi yang memperingatkan pengguna untuk tidak menggunakannya.

Misalnya, saat dua halaman menetapkan document.domain, halaman tersebut dapat berpura-pura seolah-olah memiliki origin yang sama. Hal ini sangat penting jika halaman ini menggunakan layanan hosting bersama dengan subdomain yang berbeda. Menetapkan document.domain akan membuka akses ke semua situs lain yang dihosting oleh layanan yang sama, sehingga memudahkan penyerang untuk mengakses situs Anda. Hal ini dimungkinkan karena document.domain mengabaikan bagian nomor port dari domain.

Untuk mempelajari lebih lanjut implikasi keamanan setelan document.domain, baca halaman"Document.domain" di MDN.

Kompatibilitas browser

• Spesifikasi HTML mengatakan bahwa fitur tersebut harus dihapus.
• Mozilla menganggap menonaktifkan document.domain secara default sebagai prototipe yang layak.
• WebKit menunjukkan bahwa mereka cukup positif tentang penghentian penggunaan penyetel document.domain.
• Diskusi dengan vendor browser lain
• Pull Request grup kerja WHATWG / HTML (pengalaman eksperimen tertunda)

Bagaimana cara mengetahui apakah situs saya terpengaruh?

Peringatan: Perhatikan bahwa mulai Chrome 115, penggunaan penyetel document.domain tidak akan menampilkan pengecualian, sesuai dengan spesifikasi. Hal ini hanya akan berhenti berpengaruh.

Jika situs Anda terpengaruh oleh perubahan ini, Chrome akan memperingatkan Anda di panel Masalah DevTools. Peringatan ini telah ditambahkan pada tahun 2022. Perhatikan tanda kuning di kanan atas DevTools.

Anda juga dapat menjalankan situs melalui audit API yang tidak digunakan lagi di Lighthouse untuk menemukan semua API yang dijadwalkan untuk dihapus dari Chrome.

Jika Anda telah menyiapkan Reporting API, Chrome telah mengirimkan laporan penghentian penggunaan untuk memberi tahu Anda tentang penghentian penggunaan mendatang ini. Pelajari lebih lanjut cara menggunakan Reporting API dengan layanan pengumpulan laporan yang ada atau dengan membuat solusi internal Anda sendiri.

Bagaimana cara melihat penerapan perubahan ini?

Perubahan ini akan diluncurkan secara bertahap, mulai dari Chrome 115. Untuk melihat cara kerja perubahan ini meskipun belum diluncurkan di browser Chrome, Anda dapat mengaktifkannya sebagai berikut:

1. Buka chrome://flags/#origin-agent-cluster-default
2. Pilih Enable.
3. Mulai ulang Chrome.

Apa alternatif yang dapat saya gunakan?

Opsi terbaiknya adalah tidak memodifikasi document.domain sama sekali, misalnya dengan menghosting halaman dan semua frame penyusun di origin yang sama. Hal ini berfungsi di semua versi semua browser. Namun, hal ini mungkin memerlukan pengerjaan ulang aplikasi yang substansial, jadi sebaiknya lihat juga alternatif yang terus mendukung akses lintas-asal.

Gunakan postMessage() atau Channel Messaging API, bukan document.domain

Dalam sebagian besar kasus penggunaan, postMessage() lintas origin atau Channel Messaging API dapat menggantikan document.domain.

Dalam contoh berikut:

1. https://parent.example.com meminta https://video.example.com dalam iframe untuk memanipulasi DOM dengan mengirim pesan melalui postMessage().
2. https://video.example.com memanipulasi DOM segera setelah menerima pesan dan memberi tahu keberhasilan kembali ke induk.
3. https://parent.example.com mengonfirmasi keberhasilan.

Di https://parent.example.com:

// Send a message to https://video.example.com
iframe.postMessage('Request DOM manipulation', 'https://video.example.com');

// Receive messages
iframe.addEventListener('message', (event) => {
  // Reject all messages except ones from https://video.example.com
  if (event.origin !== 'https://video.example.com') return;

  // Filter success messages
  if (event.data === 'succeeded') {
    // DOM manipulation is succeeded
  }
});

Di https://video.example.com:

// Receive messages
window.addEventListener('message', (event) => {
  // Reject all messages except ones from https://parent.example.com
  if (event.origin !== 'https://parent.example.com') return;

  // Do a DOM manipulation on https://video.example.com.

  // Send a success message to https://parent.example.com
  event.source.postMessage('succeeded', event.origin);
});

Coba dan lihat cara kerjanya. Jika Anda memiliki persyaratan spesifik yang tidak akan berfungsi dengan postMessage() atau Channel Messaging API, beri tahu kami di Twitter melalui @ChromiumDev atau ajukan pertanyaan di Stack Overflow dengan tag document.domain.

Sebagai upaya terakhir, kirim header Origin-Agent-Cluster: ?0

Jika memiliki alasan kuat untuk terus menetapkan document.domain, Anda dapat mengirim header respons Origin-Agent-Cluster: ?0 bersama dokumen target.

Origin-Agent-Cluster: ?0

Header Origin-Agent-Cluster memberi tahu browser apakah dokumen harus ditangani oleh cluster agen dengan kunci origin atau tidak. Untuk mempelajari Origin-Agent-Cluster lebih lanjut, baca Meminta isolasi performa dengan header Origin-Agent-Cluster.

Saat Anda mengirim header ini, dokumen Anda dapat terus menetapkan document.domain bahkan setelah menjadi tidak dapat diubah secara default.

Semua dokumen lain yang memerlukan perilaku tersebut juga harus mengirim Origin-Agent-Cluster (perhatikan bahwa document.domain tidak berpengaruh jika hanya satu dokumen yang menetapkannya).

Mengonfigurasi OriginAgentClusterDefaultEnabled untuk kebijakan perusahaan

Atau, admin dapat mengonfigurasi kebijakan OriginAgentClusterDefaultEnabled ke false untuk membuat document.domain dapat ditetapkan secara default di instance Chrome di seluruh organisasi Anda. Untuk mempelajari lebih lanjut, baca Daftar & Pengelolaan Kebijakan Chrome Enterprise | Dokumentasi.

Resource

• Document.domain - Web API | MDN
• Isolasi Origin dan Penghentian Penggunaan document.domain
• Penghentian penggunaan document.domain. · Issue #564 · w3ctag/design-reviews

Ucapan terima kasih

Foto oleh Finan Akbar di Unsplash