每次从服务器而不是从缓存加载 index.html

Load index.html every time from the server and NOT from cache

提问by Pulkit Mittal

I have a webpage index.htmlhosted on a particular server. I have pointed example.comto example.com/index.html. So when I make changes in index.html and save it, and then try to open example.com, the changes are not reflected. Reason that the webpages are being cached.

我在特定服务器上托管了一个网页index.html。我已经指出example.com来example.com/index.html。所以当我在 index.html 中进行更改并保存，然后尝试打开 example.com 时，更改没有反映。网页被缓存的原因。

Then I manually refresh the page and since it loads the fresh copies and not from cache, it works fine. But I cannot ask my client to do so, and they want everything to be perfect. So my question is that is there a trick or technique as to how I can make the file load every time from the server and not from cache?

然后我手动刷新页面，因为它加载了新副本而不是从缓存中加载，所以它工作正常。但我不能要求我的客户这样做，他们希望一切都是完美的。所以我的问题是，是否有技巧或技术可以让我每次从服务器而不是从缓存加载文件？

P.S: I know the trick for CSS, JS and images files, i.e. appending ?v=1but don't know how to do it for index.html.

PS：我知道 CSS、JS 和图像文件的技巧，即附加?v=1但不知道如何为 index.html 执行此操作。

Any help would be appreciated. Thanks!

任何帮助，将不胜感激。谢谢！

回答by doniyor

by this:

这样：

<meta http-equiv="expires" content="0">

Setting the content to "0" tells the browsers to always load the page from the web server.

将内容设置为“0”会告诉浏览器始终从 Web 服务器加载页面。

回答by user3979672

The meta tags didn't worked for me so. i set the headers from the java class that implements filter or controller. and it worked. here is the code

元标记对我不起作用。我从实现过滤器或控制器的 java 类设置头文件。它奏效了。这是代码

HttpServletResponse httpResponse = (HttpServletResponse) response;
httpResponse.setHeader("Cache-Control", "no-cache, no-store, must-revalidate"); // HTTP 1.1
httpResponse.setHeader("Pragma", "no-cache"); // HTTP 1.0
httpResponse.setDateHeader("Expires", 0); // Proxies.

回答by Sam

There are only two most reliable way available as of 2018

截至 2018 年，只有两种最可靠的方式可用

1) **<meta http-equiv="expires" content="0">**Use this meta tag but be careful because this tag destroy the all cache of the page as soon as a web page processed by browser.

1)**<meta http-equiv="expires" content="0">**使用此元标记但要小心，因为一旦浏览器处理网页，此标记就会破坏页面的所有缓存。

2) Generate an unique ID at server for each page request and append this id at the end of the all file name inside the HTML document with ? before the unique id append on images, documents, css/js files, videos etc which need to be load from the server every time. For example if you have the HTML tag like <img src="images/profile223.jpg" alt="profile picture">then on server side append the unique id at the end of the file name like this echo '<img src="images/profile223.jpg?'.$uniqueid.'"" alt="profile picture">';. In this example i use php but you can generate the unique ID on any language. All big companies like Google, Facebook, Microsoft, Twitter etc. uses this technique because it is most effective way and does not effect the cache data you want to store on user browser like login session id. This technique is cross browser compatible and support older version of IE, Firefox, Chrome, Safari and Opera.You may append the unique id at the end of the url using the same technique

2) 在服务器上为每个页面请求生成一个唯一的 ID，并将此 ID 附加到 HTML 文档中所有文件名的末尾？在每次都需要从服务器加载的图像、文档、css/js 文件、视频等附加唯一 id 之前。例如，如果您<img src="images/profile223.jpg" alt="profile picture">在服务器端有这样的 HTML 标记，请在文件名的末尾附加唯一的 id，如下所示echo '<img src="images/profile223.jpg?'.$uniqueid.'"" alt="profile picture">';。在本例中，我使用 php，但您可以生成任何语言的唯一 ID。Google、Facebook、Microsoft、Twitter 等所有大公司都使用这种技术，因为它是最有效的方法，并且不会影响您想要存储在用户浏览器上的缓存数据，例如登录会话 ID。这种技术是跨浏览器兼容的，并支持旧版本的 IE、Firefox、Chrome、Safari 和 Opera。您可以使用相同的技术在 url 的末尾附加唯一的 id

回答by Murali Krishna Bellamkonda

You can try this below method. It worked for me.

您可以尝试以下方法。它对我有用。

Please add the below lines of code in your .htaccess file.

请在您的 .htaccess 文件中添加以下代码行。

<IfModule mod_headers.c>

    <FilesMatch "\.(html|php)$">
        Header set Cache-Control "no-cache, no-store, must-revalidate"
        Header set Pragma "no-cache"
        Header set Expires 0
    </FilesMatch>

    <FilesMatch "\.(ico|pdf|jpg|png|gif|js|css)$">
        Header set Cache-Control "max-age=172800, public, must-revalidate"
    </FilesMatch>

</IfModule>

If you use the above code, browser will not cache .html files.

如果使用上面的代码，浏览器将不会缓存 .html 文件。

回答by ahr

i ever meet this problem with my website. in your URL add the q=''

我曾经在我的网站上遇到过这个问题。在您的网址中添加 q=''

http://yoururl.com/somelinks?q=fill_with_random_number

for me, it works

对我来说，它有效

回答by GolezTrol

You can send extra headers with the file to tell the client (the browser, that is) that the file must not be cached. If you got Apache, take a look at mod_expires. If you use a server side scripting language, like PHP, you can solve it using that too.

您可以随文件一起发送额外的标头，以告诉客户端（即浏览器）该文件不能被缓存。如果您有 Apache，请查看mod_expires。如果您使用服务器端脚本语言，如 PHP，您也可以使用它来解决它。

回答by Patrik Bego

Adding this meta tags to the header works for most of the browsers (in that case index.html will not be cached):

将此元标记添加到标题适用于大多数浏览器（在这种情况下 index.html 不会被缓存）：

<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />

A bit late but it might help someone else!

有点晚了，但它可能会帮助别人！

回答by Len Atkinson Jr.

I highly recommend not using meta tags and use htaccess as Murali Krishna Bellamkonda posted. That will always be the best and most secure dependable way. You can fine tune your whole system to stay cached for long times, refresh files at specific times, etc... Go ahead and try all them meta tags at once, and see what happens! (no I wouldnt) Look into Header set Cache-Control "max-age=5, immutable" with ExpiresDefault A5 for a no cache option.

我强烈建议不要使用元标记，而是像 Murali Krishna Bellamkonda 发布的那样使用 htaccess。这将永远是最好和最安全可靠的方式。您可以微调您的整个系统以长时间保持缓存，在特定时间刷新文件等...继续尝试所有元标记，看看会发生什么！（不，我不会）使用 ExpiresDefault A5 查看 Header set Cache-Control "max-age=5, immutable" 以获取无缓存选项。