window.location.reload with clear cache 使用清除缓存的方式重新加载页面。

15 浏览
0 Comments

window.location.reload with clear cache 使用清除缓存的方式重新加载页面。

我想使用JavaScript重新加载页面，但我也想清除缓存，这样在页面刷新时，页面上的所有内容都是来自服务器的最新版本。
\n除了IE以外的其他浏览器没有获取到最新的内容。\n有IE9的解决方案吗？

0

3 答案

0 Comments

问题出现的原因：在PWA应用的service worker中使用location.reload(true);无法清除缓存，并导致无限重载。

解决方法：在PWA应用的service worker中使用self.skipWaiting();来清除缓存并实现重载。

以下是解决方法的代码示例：

self.addEventListener('install', function(event) {
  // 安装 service worker
});
self.addEventListener('activate', function(event) {
  // 激活 service worker
  self.skipWaiting(); // 清除缓存并实现重载
});
self.addEventListener('fetch', function(event) {
  // 处理请求
});

0
0 Comments

问题原因：

- 在页面加载时，meta标签的cache-control属性和expires属性并不能清除已保存在客户端浏览器中的缓存。

- 在URL的末尾添加时间戳也无法解决问题，因为浏览器会仍然使用缓存文件。

- 通过在页面加载前添加HTTP缓存头可以立即清除缓存，但这仍然需要重新加载页面。

解决方法：

- 在head标签中添加meta标签，设置cache-control属性为"no-cache"，可以阻止页面被缓存。

- 在head标签中添加meta标签，设置expires属性为"-1"，可以删除页面的缓存。

- 在URL的末尾添加一个时间戳参数，确保每次获得的URL都不相同，从而强制浏览器获取最新版本的文件。

- 使用JavaScript编写一个eraseCache函数，在页面加载时调用该函数，可以重新加载页面并在URL末尾添加一个GET参数。后端代码可以根据这个参数添加meta标签和一个包含时间戳的缓存变量，以解决缓存问题。

- 通过在服务器端添加HTTP缓存头，可以在页面加载之前立即清除缓存，而无需重新加载页面。

以上方法都可以解决重新加载页面并清除缓存的问题。

0
0 Comments

(window.location.reload with clear cache)问题出现的原因是参数被废弃，不再被现代浏览器支持。解决方法是通过改变URL的搜索参数来强制重新获取页面，达到清除缓存的目的。

在代码中，使用location.reload(true)来强制重新加载页面，忽略浏览器缓存。然而，这个参数从未被标准化，并且在现代浏览器中已经被废弃和移除。因此，在Chrome和Safari浏览器中无法使用这个方法来清除缓存。

另一种解决方法是通过改变URL的搜索参数，并加上一个时间戳作为参数的一部分，以强制浏览器重新获取页面。例如：window.location.href = window.location.origin + window.location.pathname + window.location.search + (window.location.search ? '&' : '?') + 'reloadTime=' + Date.now().toString() + window.location.hash;。这样做可以确保浏览器重新获取页面并清除缓存。

需要注意的是，这种方法只影响当前的URL，其他页面的缓存不受影响。如果需要清除所有页面的缓存，可以在生成资源时给每个资源添加一个版本参数或重命名资源。这样做可以确保每次更改版本参数时，浏览器都会重新获取最新的资源。

当使用(window.location.reload with clear cache)时，需要注意参数已被废弃，并且在现代浏览器中无法使用。可以通过改变URL的搜索参数来强制重新获取页面，达到清除缓存的目的。这种方法只影响当前的URL，其他页面的缓存不受影响。可以通过给每个资源添加版本参数或重命名资源的方式，清除所有页面的缓存。

0