web-dev-qa-db-ja.com

無効にするchromeローカル開発での厳密なMIMEタイプチェック

私のローカル開発サーバー（webpack）が明らかに間違ったMIMEタイプでサービスを提供しているCSSファイルがあります。

Refused to apply style from 'http://localhost:10001/font-awesome/css/font-awesome.min.css' 
because its MIME type ('text/html') is not a supported stylesheet MIME type, 
and strict MIME checking is enabled.

これを無効にする方法はありますか？私はそれがchrome=設定であると思います。少なくとも特定のホストでは。

このような基本的なことを行わない場合、webpack構成を掘り下げることは、通常、イライラするヤクの剃毛の練習です。

他のほとんどの回答は、サーバーを修正する方法に言及しています。サーバーが頑固なので、このクライアント側をハックしたいだけです。

関連：

google-chromewebpackmime-types
10
dcsan

あなたの質問は少し前からですが、この問題についてGoogleでランク付けされているので、いくつかのヒントを入れてみました。

変装したHTTP/404である可能性があります

エラーメッセージはおそらくあなたを誤解させるだけです。 Google Chromeが「ネットワーク」開発パネルのプレビューを含めて、応答を完全に削除するのは残念です。

サーバーがHTTP 404メッセージで応答しているため、MIMEタイプが正しくない可能性があります。
テストするには：ブラウザでCSSファイルへのURLを直接開くか、wgetなどのツールでフェッチします。

パスが正しいかどうか確認しましたか？構成によっては、cssファイルが以前の場所にない場合があります（webpackまたはその構成に問題がないと想定）。

私はここで盲目的に正しいURLが何であるかを推測することができます...
http://localhost:10001/node_modules/font-awesome/css/font-awesome.min.css
http://localhost:10001/css/font-awesome/font-awesome.min.css
http://localhost:10001/css/font-awesome.min.css
http://localhost:10001/font-awesome.min.css

リクエストヘッダーの確認

一般に、CSS応答の場合だけではありません。
text/html応答が返された場合（たとえば、デフォルトのApache 404ページ）、要求ヘッダーは正常にフォールバックするように準備できます。
Accept: text/css, text/plain, */*

ただし、*/*をすべてのリクエストで受け入れられるようにしないように構成する必要があります。ローカルの開発環境であっても、常に役立つとは限りません。間違ったタイプの応答は早期に修正する必要があります。

フレームワークがこれを優雅に処理したい理由

サーバーは正しい回答を配信する可能性がありますが、Content-Typeヘッダーが正しくありません。フレームワークは、サーバーが「アプリケーション/ jsonを意味している必要がある」と想定し、JSONパーサーにその処理を許可します。

これが機能する場合、フレームワークは誤ったContent-Typeを無視しても機能します。
主な目的は、.htaccess設定の編集が不可能な共有ホスティング環境で実行することです。
アプリケーションがコンテンツタイプをより厳密に処理する場合は問題ありませんが、このようなエラーを時々デバッグするという欠点があります。

関連回答
これでも問題が解決しない場合は、ここからの回答が役に立ちました。
MIMEタイプのため、スタイルシートはロードされません

10
Peter Krebs

ハードリロードまたはキャッシュを空にして、ページをハードリロードしてください。

それを行うには：

  1. 検査を開きます。 （CTRL + SHIFT + I）
  2. （アドレスバーの前にある）更新ボタンを右クリックし、適切なオプションを選択します。
0
Vighnesh Raut