• 鲜琦:感恩父亲节,永远难忘父亲这首歌(3) 2019-07-13
  • 摄艳|花开红树乱莺啼 白鹭相亲相爱嬉戏忙 2019-07-13
  • 规范二手交易平台须多方给力 2019-07-10
  • 2018世界杯完全赛程及转播表 2019-07-08
  • 赵克志任中央政法委副书记(图简历) 2019-07-04
  • 回家! 民工南美受重伤 医生跨越3大洲五万公里将其接回治疗 2019-07-03
  • 这个望远镜可探测到50光年外行星信号 2019-07-03
  • 回复@“老笑头”,为什么老夫不能提“逻辑”?不是小看你,你有本人1%的逻辑思维能力就可以沾沾自喜了,就不会象那个“真理论者”似的在论坛上天天挨批了。哈哈哈哈! 2019-06-25
  • 深圳2018年将开行3趟援疆旅游扶贫专列 2019-06-24
  • 2018首届中国书画春节联欢晚会在京举行  2019-06-20
  • 铜陵市:推进基层参与式治理 创新城市社区居民自治路径 2019-06-17
  • 北京法院诉讼档案实现互联网查阅 2019-06-17
  • 马家驹:Bose很乐意与新势力造车品牌合作高端音响 2019-06-13
  • 探寻深圳的创新基因(壮阔东方潮 奋进新时代·庆祝改革开放40年) 2019-06-12
  • 日照市统计局响应号召 积极开展大调研活动 2019-06-09
  • 网页本地缓存害死人,网站调试经验总结
    搜收录网整理 发布日期:2018/1/30 13:30:18
    今天发现公司的网站的一个网页出了点问题,于是在服务器上修改了一下代码,然后本地刷新了一下网页问题依旧,无论怎么修改问题已然解决不了,最后居然把网页删了,刷新本地网页居然还能正常浏览,而且已然是上面的那个错误,最后意识到可能是本地缓存的问题,最后修改了代码之后,清楚了浏览器缓存,刷新之后,网页果然正常了,由于没有意识到本地网页缓存结果浪费了大量时间,这真是一个教训!
     
    浏览器端的缓存规则
    对于浏览器端的缓存来讲,这些规则是在HTTP协议头和HTML页面的Meta标签中定义的。他们分别从新鲜度和校验值两个维度来规定浏览器是否可以直接使用缓存中的副本,还是需要去源服务器获取更新的版本。
     
    新鲜度(过期机制):也就是缓存副本有效期。一个缓存副本必须满足以下条件,浏览器会认为它是有效的,足够新的:
    含有完整的过期时间控制头信息(HTTP协议报头),并且仍在有效期内;
    浏览器已经使用过这个缓存副本,并且在一个会话中已经检查过新鲜度;
    满足以上两个情况的一种,浏览器会直接从缓存中获取副本并渲染。
    校验值(验证机制):服务器返回资源的时候有时在控制头信息带上这个资源的实体标签Etag(Entity Tag),它可以用来作为浏览器再次请求过程的校验标识。如过发现校验标识不匹配,说明资源已经被修改或过期,浏览器需求重新获取资源内容。
    浏览器缓存的控制
    使用HTML Meta 标签
    Web开发者可以在HTML页面的<head>节点中加入<meta>标签,代码如下:
    1
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
    上述代码的作用是告诉浏览器当前页面不被缓存,每次访问都需要去服务器拉取。使用上很简单,但只有部分浏览器可以支持,而且所有缓存代理服务器都不支持,因为代理不解析HTML内容本身。
    可以通过这个页面测试你的浏览器是否支持:Pragma No-Cache Test 。
    使用缓存有关的HTTP消息报头
    一个URI的完整HTTP协议交互过程是由HTTP请求和HTTP响应组成的。有关HTTP详细内容可参考《Hypertext Transfer Protocol — HTTP/1.1》、《HTTP协议详解》等。
    在HTTP请求和响应的消息报头中,常见的与缓存有关的消息报头有:
    HTTP缓存相关报头
     
    Cache-Control与Expires
    Cache-Control与Expires的作用一致,都是指明当前资源的有效期,控制浏览器是否直接从浏览器缓存取数据还是重新发请求到服务器取数据。只不过Cache-Control的选择更多,设置更细致,如果同时设置的话,其优先级高于Expires。
    Last-Modified/ETag与Cache-Control/Expires
    配置Last-Modified/ETag的情况下,浏览器再次访问统一URI的资源,还是会发送请求到服务器询问文件是否已经修改,如果没有,服务器会只发送一个304回给浏览器,告诉浏览器直接从自己本地的缓存取数据;如果修改过那就整个数据重新发给浏览器;
    Cache-Control/Expires则不同,如果检测到本地的缓存还是有效的时间范围内,浏览器直接使用本地副本,不会发送任何请求。两者一起使用时,Cache-Control/Expires的优先级要高于Last-Modified/ETag。即当本地副本根据Cache-Control/Expires发现还在有效期内时,则不会再次发送请求去服务器询问修改时间(Last-Modified)或实体标识(Etag)了。
    一般情况下,使用Cache-Control/Expires会配合Last-Modified/ETag一起使用,因为即使服务器设置缓存时间, 当用户点击“刷新”按钮时,浏览器会忽略缓存继续向服务器发送请求,这时Last-Modified/ETag将能够很好利用304,从而减少响应开销。
    Last-Modified与ETag
    你可能会觉得使用Last-Modified已经足以让浏览器知道本地的缓存副本是否足够新,为什么还需要Etag(实体标识)呢?HTTP1.1中Etag的出现主要是为了解决几个Last-Modified比较难解决的问题:
    Last-Modified标注的最后修改只能精确到秒级,如果某些文件在1秒钟以内,被修改多次的话,它将不能准确标注文件的新鲜度
    如果某些文件会被定期生成,当有时内容并没有任何变化,但Last-Modified却改变了,导致文件没法使用缓存
    有可能存在服务器没有准确获取文件修改时间,或者与代理服务器时间不一致等情形
    Etag是服务器自动生成或者由开发者生成的对应资源在服务器端的唯一标识符,能够更加准确的控制缓存。Last-Modified与ETag是可以一起使用的,服务器会优先验证ETag,一致的情况下,才会继续比对Last-Modified,最后才决定是否返回304。Etag的服务器生成规则和强弱Etag的相关内容可以参考,《互动百科-Etag》和《HTTP Header definition》,这里不再深入。
    用户操作行为与缓存
    用户在使用浏览器的时候,会有各种操作,比如输入地址后回车,按F5刷新等,这些行为会对缓存有什么影响呢?
    用户操作与缓存
    通过上表我们可以看到,当用户在按F5进行刷新的时候,会忽略Expires/Cache-Control的设置,会再次发送请求去服务器请求,而Last-Modified/Etag还是有效的,服务器会根据情况判断返回304还是200;而当用户使用Ctrl+F5进行强制刷新的时候,只是所有的缓存机制都将失效,重新从服务器拉去资源。
    相关有趣的分享:
    《浏览器缓存机制》:不同浏览器对用户操作行为处理比较
    《HTTP 304客户端缓存优化的神奇作用和用法》:强行在代码层面比对文件的Last-Modified时间,保证用户使用Ctrl+F5进行刷新的时候也能正常返回304
     
    哪些请求不能被缓存?
    无法被浏览器缓存的请求:
    HTTP信息头中包含Cache-Control:no-cache,pragma:no-cache,或Cache-Control:max-age=0等告诉浏览器不用缓存的请求
    需要根据Cookie,认证信息等决定输入内容的动态请求是不能被缓存的
    经过HTTPS安全加密的请求(有人也经过测试发现,ie其实在头部加入Cache-Control:max-age信息,firefox在头部加入Cache-Control:Public之后,能够对HTTPS的资源进行缓存,参考《HTTPS的七个误解》)
    POST请求无法被缓存
    HTTP响应头中不包含Last-Modified/Etag,也不包含Cache-Control/Expires的请求无法被缓存

    信息网址://www.ybmql.tw/ziyuan/view16757.htm
    相关信息
  • 鲜琦:感恩父亲节,永远难忘父亲这首歌(3) 2019-07-13
  • 摄艳|花开红树乱莺啼 白鹭相亲相爱嬉戏忙 2019-07-13
  • 规范二手交易平台须多方给力 2019-07-10
  • 2018世界杯完全赛程及转播表 2019-07-08
  • 赵克志任中央政法委副书记(图简历) 2019-07-04
  • 回家! 民工南美受重伤 医生跨越3大洲五万公里将其接回治疗 2019-07-03
  • 这个望远镜可探测到50光年外行星信号 2019-07-03
  • 回复@“老笑头”,为什么老夫不能提“逻辑”?不是小看你,你有本人1%的逻辑思维能力就可以沾沾自喜了,就不会象那个“真理论者”似的在论坛上天天挨批了。哈哈哈哈! 2019-06-25
  • 深圳2018年将开行3趟援疆旅游扶贫专列 2019-06-24
  • 2018首届中国书画春节联欢晚会在京举行  2019-06-20
  • 铜陵市:推进基层参与式治理 创新城市社区居民自治路径 2019-06-17
  • 北京法院诉讼档案实现互联网查阅 2019-06-17
  • 马家驹:Bose很乐意与新势力造车品牌合作高端音响 2019-06-13
  • 探寻深圳的创新基因(壮阔东方潮 奋进新时代·庆祝改革开放40年) 2019-06-12
  • 日照市统计局响应号召 积极开展大调研活动 2019-06-09
  • 凯蒂卡巴拉登陆 天天捕鱼电玩城送分 切沃vsac米兰 丛林心脏电子 薛城中大奖 拳皇伊格尼斯 22选5走势图黑龙江省 小丑扑克闯关 极速十一选五是谁开的 三分赛车开奖结果