Mengapakah Saya Tidak Boleh Mengakses Peraturan CSS daripada Fail Setempat dalam Chrome 64?

Tidak Dapat Mengakses Peraturan CSS daripada Fail CSS Setempat dalam Chrome 64

Baru-baru ini, pembangun web telah menghadapi isu di mana mengakses peraturan CSS daripada fail CSS tempatan tidak boleh dilakukan dalam Chrome versi 64. Isu ini boleh dikaitkan dengan perubahan keselamatan yang dilaksanakan dalam penyemak imbas.

Masalahnya

Pada masa lalu, Chrome akan membenarkan pembangun mengakses peraturan CSS daripada fail tempatan. Walau bagaimanapun, dengan versi 64, fungsi ini telah dihadkan. Apabila cuba mengakses sifat cssRules helaian gaya, pembangun menghadapi respons yang tidak ditentukan atau ralat.

<code class="html"><script>
window.onload = function() {
  try {
    alert(document.styleSheets[0]); // works
    alert(document.styleSheets[0].cssRules); // undefined
  } catch (e) {
    alert(e); // error
  }
}
</script>

<link rel='stylesheet' href='myStyle.css'>

<!-- myStyle.css -->
body {
  background-color: green;
}</code>

Penyelesaian

Untuk menangani isu ini, pembangun telah mengenal pasti beberapa penyelesaian:

1. Layankan fail dalam talian atau daripada localhost: Dengan mengehos fail HTML dan CSS pada pelayan atau menggunakan localhost, dasar CORS tidak dikuatkuasakan dan peraturan CSS boleh diakses.
2. Gunakan penyemak imbas lain: Penyemak imbas lain seperti Internet Explorer, Microsoft Edge dan Firefox tidak menguatkuasakan sekatan CORS yang sama pada masa ini.
3. Pilihan baris arahan: Chrome menyediakan pilihan baris perintah --benarkan-fail-akses-dari-fail yang membenarkan akses kepada peraturan CSS daripada fail tempatan. Pilihan ini harus digunakan dengan berhati-hati.

Penjelasan

Punca isu ini terletak pada perubahan dalam peraturan keselamatan Chrome. Chrome kini mematuhi dasar Perkongsian Sumber Silang Asal (CORS), yang mengehadkan akses kepada sumber daripada asal yang berbeza. Memandangkan fail setempat mempunyai asal yang berbeza daripada fail HTML, mengakses peraturan CSS daripada fail ini melanggar dasar CORS.

Isu Terbuka

Walaupun pelaksanaan dasar CORS dalam Chrome meningkatkan keselamatan, ia juga telah mencipta beberapa isu terbuka:

• Satu-satunya cara untuk mengesan jika helaian gaya tidak boleh diakses daripada JavaScript adalah melalui blok cuba/tangkap.
• Mungkin terdapat isu pelaksanaan dalam Chrome yang memecahkan penyelesaian tertentu.
• Spesifikasi Model Objek CSS masih dalam status "Draf Kerja", memberi ruang untuk perubahan pada masa hadapan.

Atas ialah kandungan terperinci Mengapakah Saya Tidak Boleh Mengakses Peraturan CSS daripada Fail Setempat dalam Chrome 64?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!