在没有清除缓存 js 的情况下强制重新加载

在开发网页应用时，经常会遇到由于浏览器缓存而导致js文件更新无效的情况。通常我们会清除浏览器缓存再加载页面，但有些情况下用户可能无法很方便地执行该操作，这时我们需要使用一些技巧来强制让浏览器重新加载js文件。本文介绍两种常用的方法。

方法一：给js文件加随机参数

我们可以在js文件的url上加上随机数参数，这样可以使浏览器认为这是一个新的url，从而强制重新加载该文件。这种方法比较简单，只需要在引用js文件的url后面加上一个随机数即可，例如：

<script src="js/app.js?v=123456"></script>

每次更新js文件时只要修改随机数即可。需要注意的是，如果js文件已经被浏览器缓存，修改url参数并不一定能够使浏览器重新加载该文件。因此，在实际使用时，我们需要设置js文件的缓存控制头，例如：

app.use(express.static(__dirname + '/public', {
  maxAge: '1d',  // 设置缓存1天
  etag: false    // 禁止使用etag来验证文件是否更改
}));

这样可以确保浏览器在缓存过期后强制重新加载该文件。

方法二：使用localStorage

我们可以在localStorage中保存一个版本号，每次更新js文件时增加版本号。在应用初始化时，我们通过比较localStorage中的版本号和当前版本号来判断是否需要强制重新加载js文件。具体实现如下：

var version = '1.0.0';  // 当前版本号
var localVersion = localStorage.getItem('version');

if (localVersion === version) {
  // 本地版本号和当前版本号相同，不需要重新加载
} else {
  // 本地版本号和当前版本号不同，需要重新加载
  localStorage.setItem('version', version);
  location.reload(true);
}

使用localStorage的好处是，即使用户关闭了浏览器，下次打开应用时仍然可以从localStorage中获取上次保存的版本号，从而避免了每次打开应用都需要重新加载的情况。

以上就是在没有清除缓存 js 的情况下强制重新加载的两种常用方法。在实际应用中，可以根据具体情况来选择合适的方法。