web前端为什么用使用缓存?如何设置缓存?

猿友 2021-06-10 11:44:53 浏览数 (3378)
反馈

对于刚入行不久的新手们肯定少不了的是“怎么做?为什么这么做?实现的方法?”这些问题。那么今天就来说说“web前端为什么用使用缓存?如何设置缓存?”这个问题吧!

一、为什么要用缓存?

1.加快请求:将内容缓存在本地浏览器中或者在距离最近的服务器,在没有影响交互之下大大提高网站加载速度。

2.节省宽带:已缓存文件可以减少请求宽带。

3.降低服务器压力:当在大量用户并发请求的情况时,可以起到平衡负载的作用,降低压力。

二、如何设置缓存?

1.​HTML Meta​标签控制缓存(非HTTP协议定义)

我们通过下面这串代码来进行设置,告诉浏览器当前页面不被缓存,所以每次访问都会去服务器获取。代码如下:

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">

2.HTTP头信息控制缓存

这个方法的话是通过 ​Expires​(强缓存)、​Cache-control​(强缓存)、​Last-Modified/If-Modified-Since​(协商缓存)、​Etag/If-None-Match​(协商缓存)这些方式实现的。

(1). ​Expires​(强缓存)描述的是一个绝对的时间,是由服务器返回的。

(2). ​Cache-control​(强缓存)这个也是个描述相对时间的方法,在和 ​Expires​(强缓存)进行对比中这个方法会比较安全有效一些。而且在这个方法中的值可以是 ​public​、​private​、​no-cache​、​no- store​、​no-transform​、​must-revalidate​、​proxy-revalidate​、​max-age​这些。如果我们在使用的时候同时使用这两个方法的话,浏览器只会执行一个。因为在​ response header​ 中 ​Cache-Control​优先级高于​Expires​ 。

(3).​Last-Modified/If-Modified-Since​(协商缓存)这个方法是需要搭配 ​Cache-Control​一起使用的。

(4).​Etag/If-None-Match​(协商缓存)这个方法也是要搭配 ​Cache-Control​ 一起使用的。

总结:

以上就是一个有关于“”web前端为什么用使用缓存?如何设置缓存?的方法,当然如果你有更好的方法可以和大家分享你的经验和见解噢!希望小编的分享对你有所帮助,更多的Web前端的知识我们可以在W3cschool中进行学习和了解。


参考文章:

浏览器 HTTP 协议缓存机制详解https://my.oschina.net/leejun2005/blog/369148

CDN的实现原理:https://www.cnblogs.com/rayray/p/3553696.html



0 人点赞