无法在 IE 和 Firefox 中从服务器重新加载 HTML5 文件答案

【问题标题】：Unable to reload HTML5 file from server in IE and Firefox无法在 IE 和 Firefox 中从服务器重新加载 HTML5 文件
【发布时间】：2014-08-21 12:56:11
【问题描述】：

我有一个 HTML5 页面，它显示的不仅仅是一个名称列表，一个简单的表单，用户可以在其中填写他们的姓名。提交按钮作为操作调用一个 PHP 文件，该文件在列表中添加/删除名称，然后（通过使用 header()）重定向回调用 PHP 文件的 HTML 文件。

在 Google Chrome 中，用户点击提交按钮后，他会立即看到名称已正确添加到名称列表中/从中删除。

在 IE、Firefox 中（据在 Android 和 Safari 上为我测试过的人说），点击提交按钮后，会显示以前版本的 html 文件，而没有刚刚对其进行的更改通过 PHP 文件中的代码。即使在重新加载甚至清除缓存之后，我在 IE 和 Firefox 中尝试过，仍然显示旧版本。同时，在 Chrome 中加载文件确实会显示更改的（=当前）版本。大概过了20分钟左右，终于可以在IE和FF中加载更新的html文件了。即使使用 JS window.location.reload(true); 重新加载，只是为了看看这是否至少强制更新版本，不会更新页面（它确实重新加载，但仍然显示未更改的版本）。

我在互联网上搜索了大约 6 个小时，但没有找到解决方案，甚至没有找到其他人报告此问题。添加META HTTP-EQUIV ... 对html5 无效，而且确实（最终还是尝试了）并不能解决任何问题。我没有使用缓存清单（从未使用过）。所以页面不应该被缓存，但正如我所提到的，即使清除缓存并重新加载也不会给出页面的新版本（即使在重新启动 IE/FF 后也不会）。

我还在学习，去年才开始设计网页。所以，我（显然）并不完全了解服务器和浏览器之间发生的一切。所以这个问题对我来说似乎很奇怪，我很想知道这里发生了什么。此外，此页面从服务器下载和显示当前版本也很重要，因为用户需要看到他们的名字被添加到列表中/从列表中删除。

这里是html页面的大纲（抱歉，可能不是正确的英文单词）：

<!DOCTYPE html>
<html>
  <head>
    <title>Title text</title>
    <link rel='stylesheet' type='text/css' href='corStylesheet.css' />
    <meta name='robots' content='noindex,nofollow' />
  </head>
  <body>
    [content here]
    <script src='corJavaScript.js'> // (some of the js did not work when place in head)
    </script>
  </body>
</html>

所以，我在这里基本上有两个问题： 1. 这是怎么回事？即怎么不可能加载当前版本的html文件？ 2、如何强制从服务器下载当前版本并显示？

【问题讨论】：

标签： php html internet-explorer firefox loading

【解决方案1】：

如果您希望每次都强制浏览器重新加载页面，您可以设置标题，这样就不允许缓存文件。

您也可以通过 PHP 来实现（阅读更多信息 here）；

header("Cache-Control: no-cache, must-revalidate");

也可以直接在HTML中设置：

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />

编辑：刚刚发现一篇关于如何用不同语言设置的非常好的帖子； How to control web page caching, across all browsers?

【讨论】：

【解决方案2】：

在 PHP 端的重定向中，您可以添加一些数字 unix 时间或 micro unix 时间让浏览器认为它是新页面：

header('location: yourhtmlfile.html?'.microtime());

【讨论】：

【解决方案3】：

我的 (Javascript) 方法是，将随机字符串附加到请求的 URL。

该资源随后被视为新资源，绕过浏览器缓存。

当您想从无法添加/修改响应标头的地址（例如在第 3 方 CDN 上）重新加载外部资源时，这也适用。

var currentUrl = document.URL;
if (currentUrl.search('?') === -1) {
    window.location.href = currentUrl + '?' + Math.floor(Math.random() * 11);
} else {
    window.location.href = currentUrl + '&' + Math.floor(Math.random() * 11);
}

【讨论】：

这可行，但使用 currentUrl.search('\\?') （问号前的双反斜杠）。现在也将这个想法与我的php文件中的header函数一起使用。
@ChrisKras 不知道斜线必须在那里。不客气