修改了html文件，可是就是不显示更改后的内

找到保存的html文件，用浏览器打开（一定要先保存）；

如果是用建站程序做网站，那么就用ctrl + F5强制刷新；

总结一下——一般浏览器的刷新是ctrl R，有些时候这样刷新无效时，就用强制刷新。

解决index.html缓存问题

一般项目发版后前端静态文件会有缓存问题，

不强制刷新很难解决，

但是用户不会去强制刷新，

这就需要我们开发人员在配置方面解决浏览器缓存静态文件问题。

一般浏览器缓存的文件有html、css、js等。

css、js文件被缓存的解决方案

一般html中引入的css和js的名字都加了哈希值，所以新版本css、js和就旧版本的名字是不同的，不会有缓存问题。

如果index.html文件被缓存就稍微麻烦些

首先可以在index.html文件头部添加mate标签禁止缓存

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

<meta http-equiv="Pragma" content="no-cache">

<meta http-equiv="Cache-control" content="no-cache">

<meta http-equiv="Cache" content="no-cache">

浏览器的缓存解决，

但是一般在服务器端还是会有缓存，

当浏览器访问index.html时拿到的就是服务器缓存的文件，所有我们还需要解决服务器的缓存

这需要在服务器配置不让缓存index.html

nginx 配置如下：

location = /index.html {

add_header Cache-Control "no-cache, no-store"

}

1、url+enter或者a标签的超链接点击

2、F5刷新

3、ctrl+F5刷新

这三种刷新究竟有何不同呢？举三个简单的例子大家就明白了。

条件：此url路径您已经使用浏览器最近访问过，并没有超过缓存的时间，比如您在前1分钟刚刚访问过此url路径。

1、url+enter或者a标签的超链接点击

哇！一张我梦想座驾三菱EVO X的图片出现了。

我们发现用firebug查看网络请求是灰色的，后面说明此请求来自于缓存，其实此请求并没有发送到后端node.js，而是浏览器直接读取的缓存的数据。这里只需要在 response.setHeader(‘Cache-Control’, ‘public, max-age=3600’)//缓存一小时

2、F5刷新

还是那个url地址，只不过这次我轻轻的按了下F5哦~

我们仔细看响应状态码，变成304了，这里浏览器是去请求了后端node.js服务器，同时它带上了2个重要的参数：

1、If-Modified-Since：对应的node.js响应头 Last-Modified

2、If-None-Match：对应的node.js响应头 Etag

当node.js服务器收到这样的http请求后，则去判断是否需要更新客户端的缓存，至于使用 Last-Modified 还是 Etag 来判断缓存是否更新就要看您的node.js服务器代码是怎么写的了。

expressjs是优先判断Etag，至于Etag的值如何获取，也要看您使用的web服务器是怎么获取的，可以是修改时间+文件大小的md5值或者其他。

如果node.js服务器判断 Last-Modified 还是 Etag 后认为此请求资源还在缓存，然后返回 304状态码，和最新的 Last-Modified和Etag。

并且响应头没有“Content-Length”属性，说明响应的body是空的，

浏览器收到304状态码以后，认为资源未被修改，所以就去取缓存响应给用户了。

3、ctrl+F5刷新

强制刷新！

我们可以仔细看下请求头，没有了第2种情况的2个缓存头，和第一次来访问此url地址是一样的，所以node.js服务器就直接将图片响应给浏览器了，所以这里的151.1KB是这张图片的大小，不使用任何浏览器缓存。

总结发言：

三种刷新的情况相信您已经全看明白了，百分之90%的用户是使用第一或者第二种的，所以缓存技术至关重要。对于一些不经常修改的页面完全可以使用 Cache-Control 让请求都不用发了，节约服务器资源，快速响应。对于一些静态图片等一定要加上 Last-Modified 或者 Etag，因为一般此类资源体积都比较大，缓存做好的话可以提高不少效率。

当然不论是静态文件还是json数据或者是html数据都可以充分的利用浏览器缓存，只要你遵循http协议。

---