このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docsコミュニティーについてもっと知り、仲間になるにはこちらから。
Reason: CORS request not HTTP
理由
Reason: CORS request not HTTP
エラーの原因
CORS リクエストは URL スキームが HTTPS の場合のみ利用できますが、リクエストで指定された URL が異なる種類のものです。これは、ローカルファイルを指定する URL が、file:/// スキームを使用している場合によく起こります。
この問題を修正するには、CORS が関わるリクエスト、例えばfetch()、XMLHttpRequest、ウェブフォント (@font-face)、WebGL textures、XSL スタイルシートなどを発行させるには、必ず HTTPS の URL を使用してください。
ローカルファイルの読み込み
同じディレクトリーおよびサブディレクトリーにあるローカルファイルは、以前は同一オリジンから取得されたものとして扱われていました。つまり、テスト中にファイルとそのリソースすべてを、CORS エラーが発生することなく、ローカルディレクトリーまたはサブディレクトリーから読み込むことができたということです。
残念ながら、この問題にはセキュリティ上の問題があり、勧告（CVE-2019-11730）で指摘されています。Firefox や Chrome を含む多くのブラウザーは現在、（既定では）すべてのローカルファイルを不透明なオリジンとして扱います。その結果、ローカルリソースが含まれたローカルファイルを読み込むと、CORS エラーが発生します。
テストをローカルで実行する必要がある開発者は、ローカルサーバーを構築する必要がでてきました。すべてのファイルが同じスキームとドメイン (localhost) から提供されるため、すべて同じオリジンを持ち、オリジン間エラーは発生しません。
メモ:この変更は、URL 仕様と一致しており、ファイルのオリジンの動作は実装に委ねられますが、疑わしい場合はファイルのオリジンは不透明として扱うことが推奨されています。