ファイルの拡張子が無くてmime-typeのエラーでファイルが読み込めない時の回避方法

WordPressをHTMLサイトに変換したサイトで、GoogleフォントのCSSを読み込めない事例がありました。

GoogleフォントのCSSをheadタグ内で読み込んでいるのですが、CSSファイルをローカルにコピーしたものを読み込んでいました。

<link rel=”stylesheet” …. という部分がローカルから読み込むようになっていました。

ローカルに置かれたCSSファイルの拡張子がcssになっていないので、mime-typeエラーになり読み込めません。

HTMLサイトなのでheadタグは各ページごとに直書きされているので直すのが大変です。

拡張子を持たないファイルのmime-typeのエラーを回避する方法

ssh等でシンボリックリンクが使える場合

シンボリックリンクとリダイレクトを組み合わせるとmime-typeエラーを回避できます。

• 拡張子を追加したシンボリックリンクを作る
• .htaccessで拡張子が無いファイルを拡張子があるファイルにリダイレクトする

シンボリックリンクが使えない場合

拡張子が無いファイルを拡張子ありにリネームすれば同じことができます。

• 拡張子が無いファイルを拡張子ありにリネームする
• .htaccessで拡張子が無いファイルを拡張子があるファイルにリダイレクトする

.htaccessでリダイレクトする記述

RewriteRule ^css$ https://www.hoge-corp.net/css1.css [R=301,L]
RewriteRule ^css2$ https://www.hoge-corp.net/css2.css [R=301,L]

まとめ

HTMLサイトに変換した時に、外部ファイルをローカルにコピーしたものを読み込むケースがありますが、外部サイトのファイル名がmime-typeに対応していないことがあります。

その場合は今回のカスタマイズを思い出して対応してください。