前端缓存 自己去配置一下

缓存，主要是为了提高网页打开速度，降低服务器的负担，可以看一下怎么去配置的缓存，以及配置缓存的策略。

缓存一般也就指强缓存与协商缓存。缓存是作用在cdn查询之前的阶段，在向服务端请求静态资源时会去查看本地有没有对应的强缓存，如果没有命中或者缓存过期了的话才向后端请求静态资源，缓存过期了是会去走协商缓存的。而协商缓存也就是每次都会去请求服务端，不过会携带文件上次的修改时间，以及文件的hash，服务端会进行比对，如果过期了会重新返回新的文件给你，没有过期的话返回304状态码，这时浏览器会直接去读取对应的缓存资源。

现在去配置缓存大多都是利用的 Cache-Control 这个 header去配置的

强缓存：最开始的话是通过设置 Expires 的 header去实现的，也就是设置的资源的最大过期日期，不过这样的话有一些问题，如果你本地的时间不准确，那么是会出现缓存不生效或者缓存永远都不会过期这样的情况的，后面http1.1的话是去设置的max-age，也就是最大的有效时间，单位是秒，也就是说资源是否过期，是由浏览器来进行计算的。

Cache-control: max-age=600

协商缓存：设置完协商缓存后，每次的请求都会携带etag和last-modified去请求服务器，也就是文件内容的hash与文件的最后修改时间。

Cache-control: no-cache

网站的缓存设置的话可以在入口 html 文件 Cache-Control 设置 no-cache，其他文件 max-age，（对于一些第三方库的话设置的时间可以久一点，设置为半年，一年都行，但是对于业务文件的话一般设置为十几分钟或者一两天这样）

这样入口文件会用本地缓存但每次都协商，能及时更新，而其他资源不会发请求，能减少服务端压力。

当然如果我们不需要缓存的话呢，直接把Cache-Control 设置 no-Store就可以了。

在我们自己的服务器去配置缓存.

在nginx的配置

        location / {
            root   /root/app;
            autoindex on;
           index  index.html index.htm;
           try_files $uri $uri/ /index.html;
       }

配置入口文件，且防止刷新后404

       location /api {
proxy_pass 后端地址;
}

配置反向代理

接下来的话去配置umi.js的缓存。只是举例一个简单的例子，访问/umi.js。

location   /umi.js {
root /root/app;
add_header Cache-Control max-age=3600;
}

配置的强缓存。过期时间一个小时

再看我们配置完成后的效果

最后就是nginx的配置

OK了，然后就是记得配置完成，服务器重启后，强制刷新一下(crtl+f5)

其实强制刷新的话也是去走的协商缓存。