web-dev-qa-db-ja.com

Javascriptファイルのキャッシュを防ぐ方法は？

私は簡単なhtmlを持っています：

<html>
<body>
<head>
<meta charset="utf-8">
<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>
<script src="test.js"></script>
</body>
</html>

Test.jsでJavascript関数を変更しましたが、ブラウザーがこのファイルをキャッシュしています。スクリプトsrcのキャッシュを無効にする方法は？

javascriptcaching
102
Bdfy

ランダムなクエリ文字列をsrcに追加します

変更するたびにクエリ文字列をインクリメントすることにより、手動でこれを行うことができます。

<script src="test.js?version=1"></script>

または、サーバー側言語を使用している場合、これを自動的に生成できます。

ASP.NET：

<script src="test.js?rndstr=<%= getRandomStr() %>"></script>

キャッシュ無効化の詳細については、次を参照してください。

https://curtistimson.co.uk/post/front-end-dev/what-is-cache-busting/

151
Curt
<script src="test.js?random=<?php echo uniqid(); ?>"></script>

編集：または、ファイル変更時間を使用して、クライアントにキャッシュすることもできます。

<script src="test.js?random=<?php echo filemtime('test.js'); ?>"></script>
29
Alex Pliutau

Webサーバーの設定 スクリプトのキャッシュ制御HTTPヘッダーを送信します。

HTMLドキュメントの偽のヘッダー：

  1. 実際のHTTPヘッダーほどサポートされていない
  2. リンク先のリソースではなく、HTMLドキュメントに適用する
12
Quentin

QueryStringをsrcに追加し、更新バージョンをリリースするときにのみ変更できます。

<script src="test.js?v=1"></script>

このようにして、ブラウザは新しいバージョンが指定されるまでキャッシュバージョンを使用します（v = 2、v = 3 ...）

11
daveoncode

スクリプトを指すURLにクエリ文字列としてランダム（または日時文字列）を追加できます。そのようです：

<script type="text/javascript" src="test.js?q=123"></script>

ページを更新するたびに、「q」の値が変更されていることを確認する必要があります。

6
Bas Slagter