ホームページ >ウェブフロントエンド >CSSチュートリアル >Chrome 64 の CSS ルールにローカル ファイルからアクセスできないのはなぜですか?
Chrome 64 の CSS ルールにローカル ファイルからアクセスできないのはなぜですか?
- Linda Hamiltonオリジナル
- 2024-11-03 06:48:30922ブラウズ
Chrome 64 で CSS オブジェクト モデルへのアクセスが制限される
Chrome 64 では、ローカルに読み込まれたスタイルシートからの CSS ルールへのアクセスに問題が発生しました。この問題を理解するには、次のようにします。次のコード スニペットを検討してください。
<code class="html"><head>
<link rel='stylesheet' href='myStyle.css'>
<script>
window.onload = function() {
try {
alert(document.styleSheets[0]); // works
alert(document.styleSheets[0].cssRules); // doesn't even print undefined
} catch (e) { alert(e); } // catch and alert the error
}
</script>
</head></code>
Chrome 64 以降では、document.styleSheets[0] がスタイルシート オブジェクトを返しても、cssRules にアクセスするとエラーが発生します。
原因:
これは、Chrome 64 で適用されたスタイルシートのセキュリティ ルールの変更によるものです。具体的には、ローカル ファイルから CSS オブジェクト モデル (CSSOM) にアクセスすると、クロスオリジン リソース共有 (CORS) に違反します。
解決策:
- ローカル開発サーバーを使用する: これにより、CORS ポリシーが緩和された制御された環境が提供されます。
- オンラインまたはローカルホストでファイルをホストします: Web サーバーを使用すると、CORS の問題が解消されます。
- 他のブラウザを使用します: Firefox、Edge、 Internet Explorer では、ローカル ファイルからの CSSOM アクセスが許可されます。
影響と回避策:
この変更は、ローカル ファイル システムから CSS 機能をテストする開発者に影響します。 online/localhost ファイルや他のブラウザを使用するなどの回避策が一時的な解決策となります。
議論と未解決の質問:
セキュリティ修正であるにもかかわらず、議論や議論が継続中です。この変化。アクセシビリティの問題を検出する代替方法がないのは不便だと主張する人もいます。他のブラウザでの実装の範囲を疑問視する人もいます。 W3C 仕様はまだ開発中であるため、この問題がどのように発展するかはまだわかりません。
以上がChrome 64 の CSS ルールにローカル ファイルからアクセスできないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。