web-dev-qa-db-ja.com

MIMEタイプの不一致が原因でブロックされたリソース(X-Content-Type-Options:nosniff)

JavaScriptとHTMLを使用してWebページを開発していますが、HTMLページから次のエラーリストを受け取ったときはすべて正常に機能していました。

The resource from “https://raw.githubusercontent.com/dataarts/dat.gui/master/build/dat.gui.min.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/dev/build/three.js” was
  blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/master/examples/js/renderers/CanvasRenderer.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/master/examples/js/renderers/Projector.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/dev/build/three.js” was
  blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).

これらのエラーは、ブラウザの自動更新(Mozilla Firefox)の後に現れたもので、セットアップで何かが変更された可能性があります。この問題を解決する方法を知っていますか?

42
Sim81

ファイルパスが正しく、ファイルが存在するかどうかを確認します-私の場合は問題でした-それを修正すると、エラーが消えました

38
dav

これはURLを変更することで修正できます。例:

https://raw.githubusercontent.com/svnpenn/bm/master/yt-dl/yt-dl.js
Content-Type: text/plain; charset=utf-8

良い例:

https://cdn.rawgit.com/svnpenn/bm/master/yt-dl/yt-dl.js
content-type: application/javascript;charset=utf-8

rawgit.comはgithubのキャッシングプロキシサービスです。また、そこに移動して、元のraw.githubusercontent.comURLに対応するURLをインタラクティブに導出することもできます。 FAQ を参照してください

20
Steven Penny

パスを確認してください。指定されたパスにファイルが存在しない場合、このエラーが発生します。

5

私の場合、get_template_directory_uri()の後にスラッシュ「/」がなかったため、結果として生成されたパスが間違っていました。

私の間違ったコード:

wp_enqueue_script( 'retina-js', get_template_directory_uri().'js/retina.min.js' ); 

私の修正されたコード:

wp_enqueue_script( 'retina-js', get_template_directory_uri().'/js/retina.min.js' );
4
Sabir Hussain

これは、ブラウザがファイルにアクセスできないことが原因である可能性があります。 node.jsでアプリケーションを作成すると、このタイプのエラーに遭遇しました。スクリプトファイルを直接リクエストして(URLのコピーと貼り付け)、取得できるかどうかを確認できます。そうすれば、実際の問題が何であるかがわかります。ファイルが置かれているフォルダーの許可が原因であるか、ブラウザーがファイルへのパスが正しくないためにファイルを見つけられない可能性があります。 node.jsでは、ファイルへのルートを指定すると、すべてが機能します。

2
Vadi

エクスプレスを使用していますか?

パスを確認します(/ public /の後の「/」に注意してください):

app.use(express.static(__dirname + "/public/"));

//注意: "css"の前に "/"は必要ありません。既に含まれているためです:

rel="stylesheet" href="css/style.css

お役に立てれば

2
JPaulino

Js-filesの文字セットをBOMなしのUTF-8からNotepad ++のシンプルなUTF-8に変更することで、この問題を解決しました。

2
Sergey

DevopsチームがX-Content-Type-Options: nosniffを追加してウェブサーバーの設定を変更した後、本番環境でこのエラーに直面し始めました。現在、これにより、ブラウザーは、応答ヘッダーのcontent-typeパラメーターで言及されているように、リソースの解釈を強制されました。

さて、最初から、アプリケーションサーバーは明示的にjsファイルのコンテンツタイプをtext/plainとして設定していました。 X-Content-Type-Options: nosniffがWebサーバーに設定されていなかったため、ブラウザーはjsファイルをJavaScriptファイルとして自動的に解釈しましたが、content-typeはtext/plainとして言及されていました。これは、MIMEスニッフィングと呼ばれます。現在、X-Content-Type-Options:nosniffを設定した後、ブラウザーは、MIME-sniffingを実行せず、応答ヘッダーに記載されているcontent-typeを使用するように強制されました。このため、jsファイルをプレーンテキストファイルとして解釈し、実行を拒否またはブロックしました。同じことがエラーに表示されます。

解決策:サーバーにJSファイルのcontent-typeを次のように設定させることです

application/javascript;charset=utf-8

これにより、すべてのJSファイルが正常にロードされ、問題が解決されます。

1
Manish Bansal

間違ったパスである可能性があります。メインアプリファイルに次のものがあることを確認します。

app.use(express.static(path.join(__dirname,"public")));

Cssへのリンク例:

<link href="/css/clean-blog.min.css" rel="stylesheet">

jsファイルへのリンクについても同様:

<script src="/js/clean-blog.min.js"></script>
0
Mwongera808

プロトコルHTTPSおよびHTTPを参照

混合プロトコルを使用している場合[これは主にJSONPコールバックで発生します]、このエラーが発生することがあります。

Webページとリソースページの両方が同じHTTPプロトコルを持っていることを確認してください。

0
Clain Dsilva