text/cssとtext/javascript — Webアセットの正しい配信
CSSとJavaScriptファイルが正しいtext/cssとtext/javascript MIMEタイプで配信され、レンダリングやセキュリティの問題を回避する方法。
Best Practices
詳細な説明
CSSとJavaScriptの配信
モダンブラウザはスタイルシートとスクリプトのMIMEタイプについて厳密です。間違ったタイプで配信すると、サイレントエラーが発生する可能性があります。
text/css
ブラウザは、レスポンスのContent-Typeがtext/cssでない場合、スタイルシートの適用を拒否します。これはMIMEタイプチェックと呼ばれるセキュリティ対策です。
text/javascript
RFC 9239（2022年）でtext/javascriptがJavaScriptの唯一の公式タイプとして確立されました。
| レガシータイプ | ステータス |
|---|---|
application/javascript |
非推奨（RFC 9239） |
application/x-javascript |
非標準 |
text/ecmascript |
非推奨 |
よくあるサーバー設定ミス
| 問題 | 症状 |
|---|---|
CSSをtext/plainで配信 |
スタイルが適用されない |
JSをapplication/octet-streamで配信 |
スクリプトがブロック |
| charset欠落 | 非ASCIIのエンコーディング問題 |
ユースケース
Webサーバー、CDN、ビルドツールがCSSをtext/cssで、JavaScriptをtext/javascriptで配信していることを確認します。不正なMIMEタイプは、特にX-Content-Type-Options: nosniffが有効な場合、「スタイルが読み込まれない」「スクリプトがブロックされた」問題の一般的な原因です。