摘要:缓存的作用减少延迟页面打开的速度。降低服务器负载先取缓存,无缓存在请求服务器,有效降低服务器的负担。下图是自己画的,有点丑,请原谅待会讲解浏览器与服务器进行通讯包含两部分请求头包含各种缓存信息。至此结束,请多多指正
缓存的作用:
1.减少延迟(页面打开的速度)。
2.降低服务器负载(先取缓存,无缓存在请求服务器,有效降低服务器的负担)。
3.保证稳定性(有个笑话是手机抢购时为了保证服务器的稳定性,在前端写个随机数限制百分之二十的人发送数据到后台,这也侧面说明了缓存对于稳定性的作用)。
下图是自己画的,有点丑,请原谅!待会讲解!
浏览器与服务器进行通讯包含两部分:
1.请求头header(包含各种缓存信息)。
2.请求体bdoy(数据发送的主要内容)
页面缓存是由header决定的,包含四个参数:
一、Expires:
http1.0推出的,指服务器返回的文件有效期,但其实这是有缺陷的,如果把本地的时间改为2118年,那Expires的时间怎么都会过期。
二、Last-Modified:
http1.0推出的,指服务器文件的最后修改时间,浏览器会带上If-Modified-Since向服务器发送请求,与服务器文件修改时间Last-Modified做对比,如果时间不同,则获取数据返回200,否则返回304后调用浏览器本地硬盘的缓存。
这种方式也有问题,如果服务端文件频繁修改保存,那么Last-Modified就会频繁更改,每次都从服务端获取,这也就有了http1.1的修改。
从网上拿了个angular.js地址试了一下,第一次返回200,第二次刷新页面返回304。
时间:本地缓存获取>服务器获取
三、Cache-Control:
http1.1推出,指文件缓存的有效期。
1.max-age:单位是s,设置文件最大缓存时间,用得最多。
2.public:缓存可以被多用户共享,例如360浏览器可以登录不同账号,电脑系统可以切换不同账号。
3.private:仅单用户私有,不被多用户共享。
4.no-cache:不会被缓存。
5.no-store:不允许被存储。
四、ETag
http1.1推出,该版本号是由服务端随机生成的,浏览器会带上If-None-Match向服务器发送请求,与服务器文件修改版本ETag做对比,如果版本号不同,则获取数据返回200,否则返回304后调用浏览器本地硬盘的缓存,这种方式比Last-Modified靠谱。
思考?
Cache-Control+Last-Modified+ETag 的优先级会如何?
还记得刚开始的图吗?
因为http1.1>http1.0,
所以Cache-Control>Expires,ETag>Last-Modified。
依照就近原则,先找本地缓存,没有再向服务器发请求,
所以Expires>Last-Modified,Cache-Control>ETag,
如果浏览器只支持http1.0,那么浏览器只会携带Last-Modified发送给后台,
如果服务器只支持http1.0,那么服务器会以Last-Modified为标准。
如果浏览器支持http1.1,那么浏览器会携带Cache-Control+Last-Modified+ETag发送给后台,
如果服务器支持http1.1,那么服务器会以Cache-Control+ETag为标准。
至此结束,请多多指正!!!
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/52021.html
摘要:缓存的作用减少延迟页面打开的速度。降低服务器负载先取缓存,无缓存在请求服务器,有效降低服务器的负担。下图是自己画的,有点丑,请原谅待会讲解浏览器与服务器进行通讯包含两部分请求头包含各种缓存信息。至此结束,请多多指正 showImg(https://segmentfault.com/img/bV6iiG?w=480&h=260); 缓存的作用:1.减少延迟(页面打开的速度)。2.降低服务...
摘要:对于浏览器缓存,相信很多开发者对它真的是又爱又恨。那么浏览器缓存究竟是个什么样的神奇玩意呢什么是浏览器缓存简单来说,浏览器缓存就是把一个已经请求过的资源如页面,图片,,数据等拷贝一份副本储存在浏览器中。 对于浏览器缓存,相信很多开发者对它真的是又爱又恨。一方面极大地提升了用户体验,而另一方面有时会因为读取了缓存而展示了错误的东西,而在开发过程中千方百计地想把缓存禁掉。那么浏览器缓存究竟...
摘要:对于浏览器缓存,相信很多开发者对它真的是又爱又恨。那么浏览器缓存究竟是个什么样的神奇玩意呢什么是浏览器缓存简单来说,浏览器缓存就是把一个已经请求过的资源如页面,图片,,数据等拷贝一份副本储存在浏览器中。 对于浏览器缓存,相信很多开发者对它真的是又爱又恨。一方面极大地提升了用户体验,而另一方面有时会因为读取了缓存而展示了错误的东西,而在开发过程中千方百计地想把缓存禁掉。那么浏览器缓存究竟...
摘要:上篇文章掌握缓存从请求到响应过程的一切上我们讨论了关于利用头来解决缓存问题,这篇文章我们将介绍缓存和之间的关系。文件将会被缓存起来,这时如果你想让你的新文件起作用,那么用最新的版本号命名它就可以。缓存不同供应商清除缓存的方式不一样。 作者:Ulrich Kautz 编译:胡子大哈 翻译原文:http://huziketang.com/blog/posts/detail?postId=...
阅读 1385·2019-08-30 12:54
阅读 1870·2019-08-30 11:16
阅读 1612·2019-08-30 10:50
阅读 2447·2019-08-29 16:17
阅读 1266·2019-08-26 12:17
阅读 1377·2019-08-26 10:15
阅读 2387·2019-08-23 18:38
阅读 784·2019-08-23 17:50