从Javascript强制“空缓存和硬重新加载”

Question

有很多类似的问题，但答案与我看到的不同。

这是我在Chrome中看到的：

在服务器上进行更改，并通过AJAX/Javascript提醒客户端刷新页面。客户端JS尝试location.reload(true)。它会刷新，但不会对页面进行更改。我还包括了以下内容：

window.applicationCache.swapCache();
location.reload(true);

这并没有帮助，applicationCache应该被弃用。

然后，我尝试使用修改后的URL (附加的?id=122)刷新页面，但没有正确刷新。

我手动尝试了F5和Control F5。再说一次，没有变化。

在Google Chrome的开发者模式下，我手动选择了"Normal Relaod“和"Hard Reload"，但没有变化。直到我手动选择"Empty Cache and Hard Reload“，更新后的页面才能正确显示。

如何在客户端JS中以编程方式使用“空缓存和硬重新加载”来强制页面刷新？

Answer 1

旧线程，但我发现最好的方法，因为Chrome缓存所有东西，以节省资源，并试图比你更聪明的是使用缓存破坏。这通常可以通过添加"?ver=1234“(增量)或将数据附加到对JS和CSS引用的引用的末尾来使用。是的，它不是最好的，因为它每次都会加载资源，并且不允许用户缓存，这意味着在缓存崩溃的每个页面上的加载时间略长一些。

但它确实起作用了。您可以通过JS手动使用增量生成器，也可以通过在JS/CSS引用中添加"?ver=XXXOrWhateverHere“来选择服务器端代码。

你的推荐信可能看起来像这样。

<script type="text/javascript" src="//example.com/scripts/MyFile.js?ver=12345"></script>

或者，如果你想通过Javascript添加它，就像这样(同样只有一种方式)

 <script type="text/javascript">
 var newDate = new Date();
 var AddJsToHead = document.createElement('script');
 AddJsToHead.type = 'text/javascript';
 AddJsToHead.src = 'https://example.com/scripts/myfile.js?v=' + 
 newDate.getUTCMilliseconds(); 
 document.head.appendChild(AddJsToHead);
 </script>