如何防止caching我的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函数,但是我的浏览器正在caching这个文件。 如何禁用脚本src的caching?

更新:如何添加使用JavaScript的随机脚本?

添加一个随机查询string到src

您可以通过每次更改查询string时手动执行此操作:

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

或者,如果您使用服务器端语言,则可以自动生成以下内容:

ASP.NET:

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

更多关于cache-busting的信息可以在这里find:

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

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

编辑:或者您可以使用文件修改时间,以便它在客户端上caching。

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

configuration您的networking服务器为脚本发送caching控制HTTP标头。

在HTML文件中伪造标题:

  1. 不如真正的HTTP头支持
  2. 应用于HTML文档,而不是链接到的资源

你可以附加一个queryString到你的src,只有当你发布一个更新的版本时才能改变它:

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

通过这种方式,浏览器将使用caching版本,直到指定新版本(v = 2,v = 3 …)

您可以将随机(或date时间string)作为查询string添加到指向您的脚本的url。 像这样:

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

每次刷新页面时,都需要确保“q”的值已更改。