dackdive's blog

新米webエンジニアによる技術ブログ。JavaScript(React), Salesforce, Python など

<link rel>でCSSとかJSファイルの後ろにつける?(クエスチョンマーク)のこと

Web サイトで <link rel> タグ使って静的リソースを読み込んでいるところで、以下のような書き方を見た。

<link rel="stylesheet" type="text/css" href="/static/css/main.css?ee5b27d5462...

<> は半角を使うとコードが表示されないようなので全角にしてる)

リソース名の後ろに ?クエスチョンマーク)がつき、その後に無意味な文字列が。

調べてみると、ブラウザのキャッシュが残るのを回避するための手段だったらしい。

たしかに、web アプリケーションなどでバージョンを上げた直後に
古いバージョンのキャッシュが残っていて正常に動作しないといったことは想像がつく。

そういったことを避けるため、バージョン名や時間値(またはそこから算出したハッシュ値)などをリソース名の後ろにつけて
バージョンごとに異なる GET リクエストでキャッシュされるようにするテクニックとのこと。

上記リンクを読んで気づきましたが、よくよく考えると ? 以下は GET リクエストのクエリパラメータですね。