**文書の過去の版を表示しています。**
Windowsでローカルのファイル読み込み時のCORSエラーの解決
Windows環境でローカルのHTMLファイルから同じディレクトリ内に存在するJSONファイルを参照しようとしたところ、以下のようなエラーが発生
Access to XMLHttpRequest at 'file:///〇〇' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
エラー原因としては
CORS リクエストは URL スキームが HTTPS の場合のみ利用できますが、リクエストで指定された URL が異なる種類のものです。これは、ローカルファイルを指定する URL が、 file:/// の URL を使用している場合によく起こります。 この問題を修正するには、単純に CORS に関するリクエストを発行する際に HTTPS の URL を使用するようにしてください。
とのこと。
解決策としては以下のようにして、ローカルサーバを立ち上げればよい。
方法
npmでHTTPサーバソフトウェアをインストール
$ npm install -g http-server
HTMLファイルの存在するディレクトリに移動し、HTTPサーバを起動
$ http-server
最後にhttp://localhost:8080/にアクセス