ホームページ >ウェブフロントエンド >jsチュートリアル >ローカル ファイルのロード時に「Origin null は Access-Control-Allow-Origin によって許可されていません」が発生するのはなぜですか?また、その解決方法は何ですか?

ローカル ファイルのロード時に「Origin null は Access-Control-Allow-Origin によって許可されていません」が発生するのはなぜですか?また、その解決方法は何ですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-12-10 21:38:15478ブラウズ

Why Does

クロスオリジンリクエストのブロック: 「Origin null is not allowed by Access-Control-Allow-Origin」エラーについて

試行時XSL スタイルシートから生成された HTML 出力をロードするなど、異なるオリジンにまたがって外部リソースをロードする場合、発生する一般的なエラーは次のとおりです。 「Origin null は Access-Control-Allow-Origin では許可されません。」このエラーは、Web ブラウザによって実装されている Same Origin Policy (SOP) が原因で発生します。SOP は、悪意のある攻撃を防ぐためにクロスオリジン インタラクションを制限します。

特定のシナリオでは、リソースの読み込みを開始する HTML ページ (HTML 出力) Weather.xsl ファイルから) は、ローカル ファイル URL (例: 「file:///」) を介してロードされます。ほとんどのブラウザは SOP をローカル ファイルに適用し、ドキュメントと同じディレクトリからであってもリソースをロードすることを禁止します。これは、ローカルにロードされたファイルのオリジンが「null」であると見なされ、リソースを提供するサーバーの Access-Control-Allow-Origin ヘッダーに含まれていないためです。

この問題を解決するにはjQuery を使用して HTML 出力を div にロードするには、次の 2 つのアプローチが考えられます:

  1. Web サーバーをインストールする: HTML ページをローカルにロードする代わりに、HTTP URL (例: "http://localhost/weather.html") を使用して Web サーバーを通じて提供できます。これにより、Web サーバーは、Access-Control-Allow-Origin などの必要なヘッダーを構成して、別のオリジンからのリソースの読み込みを許可できるようになります。
  2. ブラウザ拡張機能を使用します: SOP を変更し、ローカル ファイルからのクロスオリジン リソースのロードを可能にするブラウザ拡張機能がいくつか存在します。ただし、このような拡張機能の使用によるセキュリティへの影響については注意することが重要です。

以上がローカル ファイルのロード時に「Origin null は Access-Control-Allow-Origin によって許可されていません」が発生するのはなぜですか?また、その解決方法は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。