浏览器请求缓存机制以及流程

本文详细阐述了浏览器的缓存机制,包括请求数据的过程、缓存分类、缓存标识(expires与cache-control)以及缓存的存放区域(内存缓存与磁盘缓存)。浏览器在请求时首先检查本地缓存,若缓存未过期则直接使用;过期后通过协商缓存与服务器确认。缓存控制字段如expires和cache-control用于设定缓存规则。内存缓存速度快但易丢失,磁盘缓存持久但读取速度较慢。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

浏览器缓存机制

浏览器请求数据过程

​ 浏览器在多次访问同一个网页的时候,有时候并不会每次访问都去请求值,而是会对一些固定的数据进行缓存,如图片、js文件、css文件等。这些很大程度上都是不会改变的,所以需要有缓存机制。

1.浏览器请求数据的流程
  1. 首先查看本地是否有缓存,如果有缓存,则进行读取缓存,否则跳到3
  2. 读取缓存的时候进行判断是否过期,如果没有过期的话,直接进行读取,流程结束。如果过期的话,则会进行协商缓存,也就是带个特定的请求头表示进行协商缓存。
  3. 请求,如果状态码是304的话,协商成功,直接读取本地缓存,否则就是常规请求。
  4. 将返回来的数据进行保存。
2.浏览器缓存的分类

浏览器的读取缓存分成两种:强制缓存和协商缓存。

  • 强制缓存就是在缓存没有过期的时候,直接读取浏览器内的缓存
  • 协商缓存就是在强制缓存过期后,需要和后台协商说过期的文件是否有效,如果有效的话,则不会下载内容,返回304状态码

缓存机制标识

​ 在网页进行请求并且返回结果的时候,服务端会返回一个字段,这个字段表示数据/文件的缓存限制,有expirescache-control两种,前者是在http1.0时代,而后者是在http1.1时代。

1.expires

expires的值是一个绝对值,也就是缓存的截至时间,如果客户端超过这个缓存的截至时间的话,则会使缓存失效。

expires会存在一个问题,就是当客户端和服务端的时间不一致的时候,则有时候会产生缓存还没开始生效就过期的问题,所以http1.1放弃了这个字段,采用了cache-control字段来进行表示。

2.cache-control

cache-control是在请求返回头进行填写的字段,主要的字段如下:

  • public允许浏览器和代理服务器同时进行缓存
  • private只允许浏览器进行缓存
  • no-cache浏览器缓存,但是是否使用缓存则需要进行协商解决,也就是先存着,是否使用它的时候需要先去问一下服务器。
  • no-store不允许缓存
  • max-age:缓存存活时间(相对值),所以基准就是浏览器的当前时间,就不会考虑到浏览器和服务器的时间差。

cache-control的缓存请求信息如下:

  • Last-Modified / If-Modified-Since:当确定及逆行请求的时候,会返回last-modified字段,浏览器每次进行协商请求的时候发送这个时间作为If-Modified-Since字段内容,含义是上次修改的时间。
  • Etag / If-None-Match:上面两个是根据时间来进行判断是否读取缓存,下面是根据文件的唯一标识是否更改来进行判断是否使用缓存。会先进行标识判断再进行时间判断。

缓存存放区域

1.内存缓存
  • 存放区域:内存,优点说是快速读取,但是缺点就是占内存
  • 刷新浏览器的网页,还会存在,但是关闭浏览器就不存在了。所以是存放到浏览器这个进程的内存空间。
2.磁盘缓存
  • 存放区域:磁盘,优点是不占用内存,容量大,但是缺点就是读取较慢
  • 刷新浏览器的网页、重启浏览器都会存在。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值