Chromeで「ローカル リソースのロードが許可されていません」エラーが出たときの直し方 – ステップバイステップ完全ガイド

Chromeのコンソールに表示される「Not allowed to load local resource（ローカル リソースのロードが許可されていません）」というエラーは、主にブラウザが画像・CSSファイル・スクリプトなどの読み込みに失敗した際に発生します。この問題は、Webページがローカルファイルシステム上のリソースを、別のドメインやプロトコル経由で読み込もうとしたときに起こります。エラーの原因は複数ありますが、最も多いのはChromeのセキュリティ制限です。

それ以外にも、古いホストキャッシュの残存、オリジン間リソース共有（CORS）の設定、ファイルパスやURLの不備なども、このエラーを引き起こす要因となります。

本記事では、このエラーの考えられる原因と、それぞれに対する具体的な解決策を詳しく解説します。順番に試して、エラーを解消しましょう。

1. Chromeのセキュリティ設定を無効にする

Chromeのセキュリティ機能を一時的に無効化することで、「リソースのロードが許可されていません」エラーが解決する場合があります。Chromeはデフォルトで強力なセキュリティ対策を備えており、悪意あるアクティビティやローカルリソースへの不正アクセスからユーザーを守っています。

しかし、エラーの原因がCORSやファイルパスの問題など正当なものである場合、セキュリティ機能を一時的にオフにすることでリソースの読み込みが成功することがあります。ただし、セキュリティを無効にするとブラウザやシステムがリスクにさらされる可能性があるため、あくまでトラブルシューティング目的のみに限定し、確認後は必ず元に戻してください。手順は以下の通りです。

1. パソコンでGoogle Chromeを開きます。
2. 右上にある3点メニュー（⋮）をクリックします。
3. ドロップダウンメニューから「設定」を選択します。
4. 左側の「プライバシーとセキュリティ」をクリックし、続けて「セキュリティ」を選択します。
5. 「セーフブラウジング」の項目にある「保護なし（非推奨）」をクリックします。
6. 確認画面が表示されたら、「オフにする」ボタンをクリックします。
7. 後で元に戻したい場合は、同じ手順で設定し直せばOKです。
8. 必要な変更が完了したら、設定タブを閉じます。
9. これで、設定どおりにChromeのセキュリティ機能が無効になります。

2. DNS設定を変更する

DNS設定も、状況によっては「リソースのロードが許可されていません」エラーの原因となることがあります。DNSの構成ミス、誤ったDNSサーバーの指定、名前解決の失敗などがあると、ブラウザがリソースに関連付けられたドメイン名を正しく解決できなくなります。

その結果、有効な接続を確立できないため、ブラウザはそのリソースを「読み込みが許可されていない」と判断してしまいます。以下の手順でDNS設定を変更し、エラーを修正しましょう。

1. Windows + Rキーを同時に押して、「ファイル名を指定して実行」ダイアログを開きます。
2. 検索ボックスに「ncpa.cpl」と入力してEnterキーを押します。「ネットワーク接続」ウィンドウが開きます。
3. 使用中のネットワークアダプターを選択し、「プロパティ」ボタンをクリックします。
4. 「インターネット プロトコル バージョン 4 (TCP/IPv4)」を選択し、「プロパティ」ボタンをクリックします。
5. 「次のDNSサーバーのアドレスを使う」を選択し、以下のIPアドレスを入力します。
6. 優先DNSサーバーには8.8.8.8と入力します。
7. 代替DNSサーバーには8.8.4.4と入力します。
8. 「終了時に設定を確認する」のチェックボックスにチェックを入れます。
9. 変更を保存して完了です。

3. ホストキャッシュをクリアする

ホストキャッシュのクリアも、「リソースのロードが許可されていません」エラーを解決するのに有効な手段です。通常、ブラウザはページの表示速度を上げるためにWebサイトの情報をキャッシュに保存します。しかし、キャッシュが古くなったり破損したりすると、リソースを正しく取得・読み込めなくなることがあります。ホストキャッシュをクリアすると古い情報が破棄されて新しいデータが再取得され、リソースが正常に読み込まれ、エラーが解消される可能性があります。

1. Chromeを開きます。
2. アドレスバーに以下のアドレスを貼り付けて移動します。

   chrome://net-internals/#dns

3. 「Clear host cache（ホストキャッシュをクリア）」ボタンをクリックします。
4. ブラウザを再起動します。

問題が解決したか確認し、解決しない場合は次の手順に進みましょう。

4. HTTPサーバーをセットアップする

HTTPサーバーを立ち上げることで、「リソースのロードが許可されていません」エラーを解決できるケースがあります。リソースをHTTPサーバー上でホストすれば、適切なドメインとプロトコル経由でアクセスできるようになり、ブラウザの制限を回避できます。これによりリソースが正しく読み込まれ、エラーが解消されてWebページが正常に機能するようになります。手順は以下の通りです。

1. こちらから拡張機能をダウンロードします。
2. 「Chromeに追加」ボタンをクリックします。
3. 確認画面が表示されたら、「アプリを追加」ボタンをクリックします。
4. インストール後、アプリを開きます。アプリは「chrome://apps/」からアクセスできます。
5. 「Choose folder（フォルダを選択）」ボタンをクリックし、プロジェクトフォルダを選択します。
6. 表示されたURLをクリックしてプロジェクトを実行します。
7. これで問題が解決するはずです。