1. ホーム
  2. フロントエンド
  3. CSS

フロントエンドの落とし穴 リソースはスタイルシートとして解釈されるが、MIMEタイプはtext/htmlで転送される。"<URL>". css スタイルの失敗

2022-01-21 09:40:18

フロントエンドの落とし穴 リソースはスタイルシートとして解釈されるが、MIMEタイプはtext/html: ""で転送される。

エラーメッセージ:以下

今日、tomcatにデプロイしたWebプロジェクトを実行したところ、以前はまだCSSスタイルがきちんと表示されていたのに、今日実行したら突然表示されなくなりました。ブラウザのコンソールを開くと、上の画像のようなメッセージが表示されました。

cssファイルがインポートされていることを確認した後、ウェブ上で多くの記事を検索し、最終的に以下のように問題の解決策を得ることができました。

.NETからjspページを削除します。

<!DOCTYPE html>

  • 1

その後、再度cssスタイルを表示できることがわかりましたが、cssスタイルは表示されても

ウェブ上の理由のほとんどを最終的にまとめると

フィルターにひと手間加える response.setContentType("text/html;charset=UTF-8") とします。 こうすることで、レスポンスにあるcssのリクエストも解析のためにtext/html形式に設定され、ブラウザは上記の警告を表示するようになります。

ウェブでも、上記のような解決策がいくつか紹介されています。

まず1つ目。

String accept = request.getHeader("Accept");
response.setContentType(accept==null ? "text/html;charset=UTF-8":accept+";charset=UTF-8");

  • 1
  • 2

2番目。
cssのリクエストをインターセプトするために別のフィルタを書く @WebFilter("*.css")
そして、そのフィルターに

response.setContentType("text/css;charset=UTF-8");
You can try both of the above methods!