HTTP缓存相关头

简介:

本文说的是HTTP中控制客户端缓存的头有哪些。网上这方面的文章很多了,这里就说下个人的理解。

 

在请求一个静态文件的时候(图片,css,js)等,这些文件的特点是文件不经常变化,将这些不经常变化的文件存储起来,对客户端来说是一个优化用户浏览体验的方法。那么这个就是客户端缓存的意义了。

windows下客户端的缓存文件存放在临时文件夹中,但是这里有个问题就是这个缓存文件存放多久呢?这个是由服务端进行设置的。

Expires/Cache-Control

HTTP头中的Expires和Cache-Control就是完成这个事情的。

当客户端第一次访问资源的时候,服务端在返回资源内容的同时也返回了Expires: Sun, 16 Oct 2016 05:43:02 GMT。

服务端告诉浏览器: 你Y的先把这个文件给我缓存起来,在这个过期时间之前,这个文件都不会变化了,你下次需要这个文件的时候,你就不要过来找我要了,你就去缓存中拿就好了,又快又好。

浏览器回答说:诺。

 

于是在第二次html页面中又要访问这个资源的时候,并且访问的日期在Sun, 16 Oct 2016 05:43:02 GMT之前,浏览器就不去服务器那边获取文件了,自己从缓存中自食其力了。

 

但是呢,浏览器毕竟是在客户端的,客户端的时间可是不准确的,用户可以随着自己的喜好修改自己机器的时间,比如我把我机器的时间调成Sun, 16 Oct 2016 05:43:03 GMT,那么呢?我的浏览器就不会再使用缓存了,而每次都去服务器获取文件。于是,服务器怒了:给你个绝对时间,你由于环境被修改没法判断过期,那么我就给你相对时间吧。于是就返回了Cache-Control: max-age:600,浏览器你给我缓存个10分钟去。于是浏览器只有乖乖的缓存10分钟了。

 

但是问题又来了,如果有的服务器同时设置了Expires和Cache-Control怎么办呢?(不是闲的没事干,而是由于Cache-Controll是HTTP1.1中才有的)那么就是根据更先进的设置Cache-Control来为标准。

 

好了,现在有个问题,我有个文件可能时不时会更新,服务端非常希望客户端能时不时过来问一下这个文件是否过期,如果没有过期,服务端不返回数据给你,只告诉浏览器你的缓存还没有过期(304)。然后浏览器使用自己存储的缓存来做显示。这个就叫做条件请求。

Last-Modified/ If-Modify-since

客户端第一次访问资源的时候,服务端返回资源内容的同时返回了Last-Modifed:Wed, 07 Aug 2013 15:32:18 GMT 服务端在告诉客户端:你获取的这个文件我最后的修改时间是Wed, 07 Aug 2013 15:32:18 GMT 。浏览器在获取这个文件存到缓存中的时候,给缓存中的文件同时记录上这个最后修改时间。

 

第二次访问的时候(我们假设这里没有设置expires或者cache-control)。那么服务端访问资源的时候会带上If-Modify-since:Wed, 07 Aug 2013 15:32:18 GMT ;

 

客户端询问服务端:喂,我需要的这个资源其实我这边已经有缓存了,我的缓存文件的最后修改时间是这个是,如果你那边的资源在这个时间以后没有修改的话,你就告诉我一下就好了,不需要返回实际的资源内容。反之,要是你有修改的话,你就把文件内容返回给我吧。

服务端回应说:哦。行为是看下资源是否在这个时间后没有修改过,如果没有修改返回个304告诉客户端,我没有修改过。如果有变化了,我就返回200,并且带上资源内容。

 

这个条件请求还有另外一种方法,打标签(Tag)。

ETag/ If-None-Match。

第一次客户端访问资源的时候,服务端返回资源内容的同时返回了ETag:1234,告诉客户端:这个文件的标签是1234,我如果修改了我这边的资源的话,这个标签就会不一样了。

第二次客户端访问资源的时候,由于缓存中已经有了Etag为1234的资源,客户端要去服务端查询的是这个资源有木有过期呢?所以带上了If-None-Match: 1234。告诉服务端:如果你那边的资源还是1234标签的资源,你就返回304告诉我,不需要返回资源内容了。如果不是的话,你再返回资源内容给我就行了。服务端就比较下Etag来看是返回304还是200。

各种刷新

理解了上面的缓存标签之后就很好理解各种刷新了。

刷新有三种

浏览器中写地址,回车

F5

Ctrl+F5

 

假设对一个资源:

浏览器第一次访问,获取资源内容和cache-control: max-age:600,Last_Modify: Wed, 10 Aug 2013 15:32:18 GMT

于是浏览器把资源文件放到缓存中,并且决定下次使用的时候直接去缓存中取了。

 

浏览器url回车

浏览器发现缓存中有这个文件了,好了,就不发送任何请求了,直接去缓存中获取展现。(最快)

 

下面我按下了F5刷新

F5就是告诉浏览器,别偷懒,好歹去服务器看看这个文件是否有过期了。于是浏览器就胆胆襟襟的发送一个请求带上If-Modify-since:Wed, 10 Aug 2013 15:32:18 GMT

然后服务器发现:诶,这个文件我在这个时间后还没修改过,不需要给你任何信息了,返回304就行了。于是浏览器获取到304后就去缓存中欢欢喜喜获取资源了。

 

但是呢,下面我们按下了Ctrl+F5

这个可是要命了,告诉浏览器,你先把你缓存中的这个文件给我删了,然后再去服务器请求个完整的资源文件下来。于是客户端就完成了强行更新的操作...

 

还有说一下,那个ETag实际上很少人使用,因为它的计算是使用算法来得出的,而算法会占用服务端计算的资源,所有服务端的资源都是宝贵的,所以就很少使用etag了。

目录
相关文章
|
6月前
|
机器学习/深度学习 监控 算法
员工上网行为监控软件中基于滑动窗口的C#流量统计算法解析​
在数字化办公环境中,员工上网行为监控软件需要高效处理海量网络请求数据,同时实时识别异常行为(如高频访问非工作网站)。传统的时间序列统计方法因计算复杂度过高,难以满足低延迟需求。本文将介绍一种基于滑动窗口的C#统计算法,通过动态时间窗口管理,实现高效的行为模式分析与流量计数。
151 2
|
12月前
|
机器学习/深度学习 存储 人工智能
人工智能与未来医疗:革命性技术的潜力与挑战
【10月更文挑战第2天】 本文探讨了人工智能在医疗领域的应用及其潜在影响。通过分析当前AI技术的发展现状以及在医学诊断、治疗和患者管理中的具体应用,揭示了这一技术如何提升医疗服务质量和效率。同时,讨论了AI在医疗领域所面临的伦理、隐私和安全等挑战,呼吁建立相应的监管和标准以确保其安全有效地发展。
313 4
|
机器学习/深度学习 人工智能 自然语言处理
移动应用开发的未来趋势:跨平台框架与人工智能的融合
在数字化时代,移动应用开发领域正经历着前所未有的变革。本文将探讨移动应用开发的新动向,特别是跨平台框架的兴起和人工智能技术的整合,以及它们如何重塑开发者的工作方式和用户的互动体验。通过分析当前市场数据、技术发展趋势及案例研究,我们将揭示这些创新如何推动移动应用向更高效、更智能的方向发展。
337 0
ly~
|
供应链 搜索推荐 大数据
大数据在零售业中的应用
在零售业中,大数据通过分析顾客的购买记录、在线浏览习惯等数据,帮助零售商理解顾客行为并提供个性化服务。例如,分析网站点击路径以了解顾客兴趣,并利用历史购买数据开发智能推荐系统,提升销售和顾客满意度。此外,大数据还能优化库存管理,通过分析销售数据和市场需求,更准确地预测需求,减少库存积压和缺货现象,提高资金流动性。
ly~
1037 2
黑神话:悟空中的音效设计与音乐制作
【8月更文第26天】在《黑神话:悟空》这款游戏中,音效和背景音乐是构建沉浸式游戏体验的重要组成部分。本文将探讨游戏音效和背景音乐的创作过程,以及它们如何增强游戏氛围。
1236 0
如何用宜搭1分钟搞定消息通知
消息通知是在流程表单发起编辑等阶段操作后或者设置定时规则定时通知指定人员的功能
3297 0
如何用宜搭1分钟搞定消息通知
|
人工智能 机器人
完美替代chatGPT!Claude注册教程及浅浅的测评
最近ChatGPT的封号问题搞得大家人心惶惶,这不Claude的slack版本来了。 使用Claude的slack版本,无需翻墙,无需加入Waitlist,无需付费,无需下载任何东西,没有高峰限制,而且效果媲美ChatGPT,目前可以说是毫无对手!
569 0
|
前端开发 JavaScript API
交互设计:隐藏或显示大段文本的UI组件有哪些?
应用场景: 在手机上要给列表中的每一项添加一个大段的介绍,应该用什么UI组件 A: 这里可以用,模态对话框,弹出提示,工具提示这类组件。模态对话框的好处,就是用关闭的按钮,用户操作方便;而弹出提示和工具提示只能通过点击来切换   模态对话框: http://v2.bootcss.com/javascript.html#modals http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html Bootstrap 模态框(Modal)插件 模态框(Modal)是覆盖在父窗体上的子窗体。
1715 0
|
机器学习/深度学习 数据采集 XML
python常用第三方库总结
python常用第三方库总结
694 0