浏览器如何进行静态资源缓存?—— 强缓存 协商缓存

在平时使用浏览器排查问题的过程中,我们有时会看到浏览器网络请求中出现304状态码,那么是什么情况下出现304呢?下面是关于这一现象的解释:

浏览器如何进行静态资源缓存?—— 强缓存 & 协商缓存

  • 状态码 304
  • 浏览器如何进行静态资源缓存 ?
    • 一、 强缓存(Cache-Control、Expires)
      • 1. Cache-Control:
      • 2. Expires:
    • 二、协商缓存(ETag、Last-Modified)
      • 1. Last-Modified 和 If-Modified-Since:
      • 2. ETag 和 If-None-Match:
    • 两种缓存策略的优缺点比较:

状态码 304

状态码 304 表示 "Not Modified",它是 HTTP 协议中的一个状态码,用于指示客户端的缓存副本仍然有效,并且可以继续使用缓存的资源,而不需要服务器返回实际的内容。

当客户端发送一个带有缓存验证信息的请求(例如 If-None-MatchIf-Modified-Since),服务器会检查这些验证信息与当前资源的状态是否匹配。如果验证信息与服务器上的资源匹配,表示资源没有发生变化,则服务器会返回 304 状态码,告诉客户端可以继续使用缓存的资源。

304 响应通常伴随着以下特征:

  • 响应头中没有实际的响应体,因为服务器不需要返回实际内容。
  • 响应头中通常会包含 ETagLast-Modified 字段,用于告诉客户端如何验证缓存。
  • 响应头中可能包含新的 Cache-Control 指令,用于更新缓存策略。

当客户端接收到 304 响应时,它会使用缓存的资源,从本地缓存中加载所需的文件,而无需再次下载整个资源。这样可以减少网络请求和服务器负载,提高页面加载速度和性能。

总结来说,304 状态码表示资源未修改,缓存仍有效,客户端可以继续使用缓存的资源,避免了无效的数据传输和资源浪费。

浏览器如何进行静态资源缓存 ?

强缓存(Cache-Control、Expires)和协商缓存(ETag、Last-Modified)是 HTTP 缓存机制中常见的两种方式。
在这里插入图片描述

一、 强缓存(Cache-Control、Expires)

强缓存通过在响应头中设置 Cache-Control 和 Expires 字段来控制缓存的行为。

1. Cache-Control:

Cache-Control 是 HTTP 头部中的一个字段,用于指定资源的缓存策略。通过设置 Cache-Control 的值,可以告诉浏览器如何缓存和重新验证资源。

可以设置多个指令,常见的指令有:

  • max-age:指定缓存的有效时间(以秒为单位)。
  • no-cache:表示客户端必须向服务器发送请求进行验证,不能直接使用缓存的资源。
  • no-store:表示不缓存任何响应内容。

2. Expires:

Expires 是 HTTP 头部中的一个字段,表示资源的到期时间。通过设置 Expires 的值为一个绝对过期时间,浏览器可以知道在该时间之前可以直接使用缓存的资源。然而,Expires 是一个相对较旧的缓存控制方式,现在通常使用 Cache-Control 代替。

在http1.0是Expires,在http1.1是Cache-Control,俩字段同时存在的话1.1优先级肯定大于1.0;

当客户端发起请求时,如果缓存的资源没有过期(根据 Cache-Control 或 Expires 判断),浏览器会直接从缓存中获取资源,而不发送请求到服务器。

二、协商缓存(ETag、Last-Modified)

协商缓存通过在请求头中发送 If-Modified-SinceIf-None-Match 字段,以及在响应头中设置 Last-ModifiedETag 字段来控制缓存的行为。

1. Last-Modified 和 If-Modified-Since:

服务器在响应头中返回 Last-Modified 字段,表示资源的最后修改时间。当客户端再次请求该资源时,在请求头中添加 If-Modified-Since 字段,值为上次响应中Last-Modified
如果资源在该时间后没有修改过,服务器会返回 304 Not Modified,客户端继续使用缓存的资源。

2. ETag 和 If-None-Match:

服务器在响应头中返回 ETag 字段,它是一个唯一标识符,代表资源的特定版本。当客户端再次请求该资源时,在请求头中添加 If-None-Match字段,值为上次响应中ETag 值。
如果资源的 ETag 值与客户端发送的 If-None-Match 值匹配 ,服务器会返回 304 Not Modified,客户端继续使用缓存的资源。

在http1.0是Last-Modified,在http1.1是Etag,俩字段同时存在的话1.1优先级肯定大于1.0;

协商缓存相对于强缓存提供了更细粒度的控制,可以根据资源的变化情况来判断是否使用缓存

通常情况下,浏览器会先检查强缓存,如果强缓存生效,则直接使用缓存的资源;如果强缓存失效,则发送请求到服务器进行协商缓存验证,根据服务器返回的响应来决定是否使用缓存的资源。

两种缓存策略的优缺点比较:

  • 强制缓存的缺点:就是可能在强制的这段时间里服务器文件更新了,那浏览器就读不到最新的资源了;
  • 协商缓存的缺点:就是每次都要发个请求去问服务器资源是否更新,可能造成不必要的时间和流量浪费;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/462998.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

springboot基于spring boot的在线答题微信小程序

摘 要 在线答题微信小程序是考试中重要的一环,在线答题是学生获取任务信息的主要渠道。为了方便学生能够在网站上查看任务信息、考试,于是开发了基于 springboot框架设计与实现了一款简洁、轻便的在线答题微信小程序。本微信小程序解决了在线答题事务中的…

linux源配置:ubuntu、centos

1、ubuntu源配置 1)先查电脑版本型号: lsb_release -c2)再编辑源更新,源要与上面型号对应 参考:https://midoq.github.io/2022/05/30/Ubuntu20-04%E6%9B%B4%E6%8D%A2%E5%9B%BD%E5%86%85%E9%95%9C%E5%83%8F%E6%BA%90/ /etc/apt/…

HTTPS(超文本传输安全协议)工作过程

一、简述HTTPS HTTPS超文本传输协议(全称:Hypertext Transfer Protocol Secure ),是以安全为目标的 HTTP 通道,在HTTP的基础上通过传输加密和身份认证保证了传输过程的安全性 。HTTPS 在HTTP 的基础下加入SSL&#x…

【JavaScript】JavaScript 运算符 ④ ( 逻辑运算符 | 逻辑与运算符 | 逻辑或运算符 || | 逻辑非运算符 ! )

文章目录 一、JavaScript 逻辑运算符1、逻辑运算符 概念2、逻辑与运算符 &&3、逻辑或运算符 ||4、逻辑非运算符 !5、完整代码示例 一、JavaScript 逻辑运算符 1、逻辑运算符 概念 JavaScript 中的 逻辑运算符 的作用是 对 布尔值 进行运算 , 运算完成 后 的 返回值 也是…

数据可视化-ECharts Html项目实战(1)

在之前的文章中,我们学习了如何安装Visual Studio Code并下载插件,想了解的朋友可以查看这篇文章。同时,希望我的文章能帮助到你,如果觉得我的文章写的不错,请留下你宝贵的点赞,谢谢。 安装 Visual Studio…

深度学习-解读GoogleNet深度学习网络

深度学习-解读GoogleNet深度学习网络 深度学习中,经典网络引领一波又一波的技术革命,从LetNet到当前最火的GPT所用的Transformer,它们把AI技术不断推向高潮。2012年AlexNet大放异彩,它把深度学习技术引领第一个高峰,打…

单片机FLASH深度解析和编程实践(下)

本篇文章将同大家分享单片机FLASH编程的相关寄存器和寄存器操作及库函数操作。本篇文章依然以STM32单片机为例进行解析。有关FLASH的基本原理和实现方法,大家可以参考上一篇文章:单片机FLASH深度解析和编程实践(上)-CSDN博客 目录…

T1.数据库MySQL

二.SQL分类 2.1 DDL 2.1.1数据库操作 1). 查询所有数据库 show databases ; 2). 查询当前数据库 select database(); 3)创建数据库 create database [if not exists] 数据库名 [default charset 字符集] [collate 排序规则] ; 4)删除数据库 drop database …

upload-labs通关方式

pass-1 通过弹窗可推断此关卡的语言大概率为js,因此得出两种解决办法 方法一 浏览器禁用js 关闭后就逃出了js的验证就可以正常php文件 上传成功后打开图片链接根据你写的一句话木马执行它,我这里采用phpinfo() 方法二 在控制台…

C到C++的敲门砖-1

文章目录 关键字命名空间输入和输出缺省参数函数重载 关键字 相较于C语言32个关键字: autodoubleintstructbreakelselongswitchcaseenumregistertypedefcharexternreturnunionconstfloatshortunsignedcontinueforsignedvoiddefaultgotosizeofvolatiledoifwhilesta…

实现兼容性良好的前端页面开发

🤍 前端开发工程师、技术日更博主、已过CET6 🍨 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 🕠 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 🍚 蓝桥云课签约作者、上架课程《Vue.js 和 E…

python自动化之(django)(2)

1、创建应用 python manage.py startapp apitest 这里还是从上节开始也就是命令行在所谓的autotest目录下来输入 然后可以清楚的看到 多了一个文件夹 2、创建视图 在views中加入test函数(所建应用下) from django.http import HttpResponse def tes…

Day40:安全开发-JavaEE应用SpringBoot框架JWT身份鉴权打包部署JARWAR

目录 SpringBoot-身份鉴权-JWT技术 SpringBoot-打包部署-JAR&WAR 思维导图 Java知识点 功能:数据库操作,文件操作,序列化数据,身份验证,框架开发,第三方组件使用等. 框架库:MyBatis&…

Explain 关键字

优质博文:IT-BLOG-CN explain关键字可以模拟优化器执行 SQL 查询语句,从而知道 MySQL 是如何处理 SQL 语句的。分析查询语句或表结构的性能瓶颈。执行语句:explain SQL语句。表头信息如下: 一、ID 参数 select 查询的序列号&…

项目分享--NO.1

搭建高可用的web集群.部署网站 包含数据库,ceph/nfs,haproxy,keepalived,ansible部署 1,配置ansible管理环境 创建工作目录,编写ansible配置文件,和主机清单文件,yum配置文件 将yum文件到控制机上,然后用模块上传到被管理机器上 #vim 01-upload-repo.yml --- - name: confi…

智慧城市革命,物联网技术如何改变城市治理与生活方式

随着科技的不断进步,智慧城市已经成为现代城市发展的重要方向之一。物联网技术作为智慧城市的重要支撑,正深刻改变着城市的治理模式和居民的生活方式。本文将探讨智慧城市革命,以及物联网技术如何改变城市治理与生活方式,同时介绍…

JavaWeb笔记 --- 四、HTMlCSS

四、HTMl&CSS HTML入门 基本标签 图片、音频、视频标签 尺寸单位 px:像素 百分比 超链接标签 列表标签 表格标签 布局标签 表单标签 CSS导入方式 CSS选择器

【SQL Server】实验七 数据完整性

1 实验目的 掌握实体完整性、参照完整性和用户自定义完整性约束的创建方法。掌握完整性约束的运行检查机制。掌握参照完整性的级联删除和修改方法。掌握正确设计关系模式完整性约束的方法。 2 实验内容 2.1 掌握实体完整性约束的创建和使用方法 创建表时定义由一个属性组成…

[嵌入式系统-41]:uboot的启动流程与自拷贝、重定位

目录 一、嵌入式系统启动总体流程 1.1 硬件组成 1.2 内存空间 1.3 代码块结构 1.4 嵌入式系统的启动模块与启动流程 -- 有SPL的情形 1.5 嵌入式系统的启动模块与启动流程 - 无SPL的情形 二、关键步骤1:自拷贝relocate概述 2.1 什么是自拷贝? 2.…