浏览器缓存详解

Gu_Yan 发布于2019-08-06 13:23 / 2506人阅读

摘要：第一次请求了个文件再次访问的时候如果全部重新请求非常浪费时间也很笨拙分析因为有些文件在用户的多次请求中都是相同的如果多次请求都重复请求这个文件无疑是一种浪费那么就想到了缓存把资源缓存到本地再次请求的时候直接使用本地的缓存文件走极端把所有的文

第一次请求了 100 个文件, 再次访问的时候,如果全部重新请求, 非常浪费时间, 也很笨拙.

分析:

 因为有些文件, 在用户的多次请求中, 都是相同的, 如果多次请求都重复请求这个文件, 无疑是一种浪费.

那么就想到了缓存: 把资源缓存到本地, 再次请求的时候直接使用本地的缓存文件.

走极端:

 把所有的文件都缓存起来.

分析:

 这样也不行, 因为在请求过来的 100 个文件中, 可能有一部分是长久不变的, 有一部分是隔一段时间就变的,
 还有的文件是每次都不一样的.

那么怎么办?

 要区分这些文件, 缓存的主动方(浏览器) 说: 我要知道我要不要缓存一个文件, 我要知道下次请求的时候对于
 某个文件我到底能不能直接用缓存, 还是需要重新请求.

OK.

服务器说: 那我跟你说每个文件的你要不要缓存, 什么时候不能用缓存.
然后服务器就在响应的时候, 添加一个响应头 Expires

 类似这样:Expires: Thu, 01 Dec 1994 16:00:00 GMT （必须是GMT格式）

浏览器得到这个文件之后, 先使用这个文件.
过了一会用户重新请求了

 浏览器把 Expires 标记的时间 a, 和当前请求的时间 b 做个对比, 如果是这样
      a....b  // 说明过期了, 那么就重新请求
      b....a  // 咦还没过期, 还能吃

与 Expires 有同样功能的还有 Cache-Control, Parama 等响应头
Cache-Control 是 HTTP 1.1 提出的, Expires 是 HTTP 1.0 提出的, 前者比后者优先级高--在同时使用的时候.

...

然后, 浏览器发现不对, 这个文件过期了, 我重新拿过来的怎么还是和过期的一样, 你丫骗我.
服务器说: 那我能怎么办, 你又要过期时间, 还不能不给, 那哪能每个文件的过期时间我都能精确算出来, 那个文件明明我觉得
它经常变, 谁知道它一直都不变.

OK.

服务器给出了个解决方案:

 你看这样, 我呢, 把每个文件算出来一个值, 只要文件变化了, 这个值就会改变. 然后把这个值扔给你。
 你如果发现缓存过期了, 请求的时候把这个值也给我.
 我来看看这个值和我这边的值是不是一样的
 如果是一样的, 那么说明这个文件没有变对不对, 那我就不给你文件了,给你一个 304 你再继续使用缓存文件

这个值使用 Etag 来标记,
客户端在缓存过期重新请求的时候, 加上一个头 If-None-Match:(Etag的值)
OK.

服务器又说了, 哎这样的话我还想到另外一种方案

 我给你文件的时候标记一下这个文件最后修改的时间, 你要是发现缓存过期了, 重新请求的时候把这个时间给我
 我比较一下我这边记录的最新的文件更改时间, 如果两个相同不就说明文件没改, 对不对.

服务器给客户端的时间叫: Last-Modified
客户端返回过来的是: If-Modified-Since(Last-Modified 的值)

云服务器 GPU云服务器浏览器缓存清除浏览器缓存 cdn浏览器缓存 webrtc浏览器接收缓存

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/61867.html

[面试专题]Web缓存详解

摘要：缓存详解标签空格分隔缓存缓存之于性能优化请求更快通过将内容缓存在本地浏览器或距离最近的缓存服务器如，在不影响网站交互的前提下可以大大加快网站加载速度。强制缓存不发请求到服务器，协商缓存会发请求到服务器。参考浏览器协议缓存机制详解 Web缓存详解标签（空格分隔）：缓存缓存之于性能优化请求更快：通过将内容缓存在本地浏览器或距离最近的缓存服务器（如CDN），在不影响网站交互的前提...

bladefury 2019-08-01 17:30 评论0 收藏0
[面试专题]Web缓存详解

摘要：缓存详解标签空格分隔缓存缓存之于性能优化请求更快通过将内容缓存在本地浏览器或距离最近的缓存服务器如，在不影响网站交互的前提下可以大大加快网站加载速度。强制缓存不发请求到服务器，协商缓存会发请求到服务器。参考浏览器协议缓存机制详解 Web缓存详解标签（空格分隔）：缓存缓存之于性能优化请求更快：通过将内容缓存在本地浏览器或距离最近的缓存服务器（如CDN），在不影响网站交互的前提...

Tikitoo 2019-08-20 19:00 评论0 收藏0
详解web缓存

摘要：指示对于单个用户的整个或部分响应消息，不能被共享缓存处理。参考文章浏览器协议缓存机制详解的实现原理写给后端程序员的缓存原理介绍说说web缓存网上关于WEB缓存的文章很多，今天汇总一下。为什么要用缓存一般针对静态资源如CSS,JS,图片等使用缓存，原因如下：请求更快：通过将内容缓存在本地浏览器或距离最近的缓存服务器（如CDN），在不影响网站交互的前提下可以大大加快网站加载速度...

ACb0y 2019-08-06 13:18 评论0 收藏0
网站缓存详解

摘要：认识缓存缓存原意是指可以进行高速数据交换的存储器。命中率指请求缓存次数与缓存返回正确结果次数的比例。如果相同，缓存直接使用副本相应访问，而不用向服务器发送请求缓存内容应用情形有完整的过期时间和寿命控制头，并且没过期。 1. 认识缓存缓存：原意是指可以进行高速数据交换的存储器。当cpu处理数据时，先到cache中寻找，如果数据已经读取，就不需要去RAM中读取了在web开发中，缓存主要...

Ethan815 2019-08-06 13:32 评论0 收藏0
网站缓存详解

摘要：认识缓存缓存原意是指可以进行高速数据交换的存储器。命中率指请求缓存次数与缓存返回正确结果次数的比例。如果相同，缓存直接使用副本相应访问，而不用向服务器发送请求缓存内容应用情形有完整的过期时间和寿命控制头，并且没过期。 1. 认识缓存缓存：原意是指可以进行高速数据交换的存储器。当cpu处理数据时，先到cache中寻找，如果数据已经读取，就不需要去RAM中读取了在web开发中，缓存主要...

W_BinaryTree 2019-05-29 17:50 评论0 收藏0