美文网首页
HTTP缓存问题

HTTP缓存问题

作者: 丽卓Joyce | 来源:发表于2017-10-16 17:43 被阅读0次

在客户端第一次请求数据时,此时缓存数据库中没有对应的缓存数据,需要请求服务器,服务器返回后,将数据存储至缓存数据库中。

http缓存分为强制缓存和对比缓存两种,强制缓存可以

http请求头字段含义

请求头部分字段详解

强制缓存关注的字段

Cache-Control字段 默认是private ,时间是365天

对比缓存需要关注的字段

Last-Modified  /  If-Modified-Since

Last-Modified:

服务器在响应请求时,告诉浏览器资源的最后修改时间。

If-Modified-Since:

再次请求服务器时,通过此字段通知服务器上次请求时,服务器返回的资源最后修改时间。

服务器收到请求后发现有头If-Modified-Since 则与被请求资源的最后修改时间进行比对。

若资源的最后修改时间大于If-Modified-Since,说明资源又被改动过,则响应整片资源内容,返回状态码200;

若资源的最后修改时间小于或等于If-Modified-Since,说明资源无新修改,则响应HTTP 304,告知浏览器继续使用所保存的cache。

Etag  /  If-None-Match(优先级高于Last-Modified  /  If-Modified-Since)

Etag:

服务器响应请求时,告诉浏览器当前资源在服务器的唯一标识(生成规则由服务器决定)。

If-None-Match:

再次请求服务器时,通过此字段通知服务器客户段缓存数据的唯一标识。

服务器收到请求后发现有头If-None-Match 则与被请求资源的唯一标识进行比对,

不同,说明资源又被改动过,则响应整片资源内容,返回状态码200;

相同,说明资源无新修改,则响应HTTP 304,告知浏览器继续使用所保存的cache。

总结

对于强制缓存,服务器通知浏览器一个缓存时间,在缓存时间内,下次请求,直接用缓存,不在时间内,执行比较缓存策略。

对于比较缓存,将缓存信息中的Etag和Last-Modified通过请求发送给服务器,由服务器校验,返回304状态码时,浏览器直接使用缓存。

参考链接:

http://www.cnblogs.com/chenqf/p/6386163.html

http缓存问题设置

使用缓存:

默认情况下,浏览器都会使用缓存数据,

在f5刷新情况下 浏览器会发送一致性验证去服务器验证是否使用缓存,而浏览器直接回车则表示直接应用缓存不需要去服务器验证;所以我们就按照f5刷新去解释实现使用缓存:

一般来说前端默认是使用缓存的,默认情况下服务器端以及前端都会使用缓存数据,或者是根据etag或者是根据max-age或者是根据expires根据服务器不同去不同实现;

实际中大部分不需要我们手动去实现,而有些我们不确定是否使用缓存的情况下我们可以手动加以干涉强制使用缓存数据:

例如某个静态文件包括html或者图片我们需要使用缓存来提高处理速度,

方法一:

在服务器进行配置其max-age或者expires使其设置一个过期值为当前一年之后。这样每次进行检验时候都会使用缓存中文件.例如在.htaccess中

Header set Cache-Control "max-age=604800"

方法二:

前端设置if-modified-since去设置一个上次修改时间大于当前日期,

方法三:

服务器端根据etag去判断是否匹配来根据实际业务来使用缓存;

后面两个方法属于弱缓存数据头,需要浪费http连接,所以建议使用第一种方式;

禁用缓存:

方法一:

可以在meta标签标明

方法二:

也可以动态去setRequestHeader,强制不用缓存设置组合如下:

cache-control='no-cache,no-store'

pragma='no-cache'

if-modified-since=0;

方法三:

请求端设置if-modified-since为已经过期的某个时间,可以是几年前或者几十年前。

方法四:

服务端设置Expires为过期某个时间,例如php中header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");

实际开发中如果需要一致性检测则尽量去配合Etag以及last-Modified去进行比较然后返回使用缓存还是新数据;这个有点偏服务器端了,不再赘述

方法五:

url后面加随机数或者时间戳url += “&random=” + Math.random()这个方法js以及php经常用,原理就是每个请求的url都不一样这样一来缓存中找不到对应数据,就自动去服务器寻找最新资源;

最后回到上篇开始提到一个问题;请求服务器时间,由于缓存导致时间返回问题:

问题回顾:由于没有设置缓存,默认浏览器是读取缓存数据的,导致我没清缓存情况下一直使用缓存数据,这样一来我就取不到真正的当前服务器时间了。

解决方式:利用上述方法二+方法四,动态在请求时候修改header以及根据随机数去请求最新数据,问题解决!!!

附:html页面中meta的作用

meta是用来在HTML文档中模拟HTTP协议的响应头报文。meta 标签用于网页的与中,meta 标签的用处很多。meta 的属性有两种:name和http-equiv。name属性主要用于描述网页,对应于content(网页内容),以便于搜索引擎机器人查找、分类(目前几乎所有的搜索引擎都使用网上机器人自动查找meta值来给网页分类)。这其中最重要的是description(站点在搜索引擎上的描述)和keywords(分类关键词),所以应该给每页加一个meta值。比较常用的有以下几个:

name 属性

1、用以说明生成工具(如Microsoft FrontPage 4.0)等;

2、向搜索引擎说明你的网页的关键词;

3、告诉搜索引擎你的站点的主要内容;

4、告诉搜索引擎你的站点的制作的作者;

5、

其中的属性说明如下:

设定为all:文件将被检索,且页面上的链接可以被查询;

设定为none:文件将不被检索,且页面上的链接不可以被查询;

设定为index:文件将被检索;

设定为follow:页面上的链接可以被查询;

设定为noindex:文件将不被检索,但页面上的链接可以被查询;

设定为nofollow:文件将不被检索,页面上的链接可以被查询。

http-equiv属性

1、

和 用以说明主页制作所使用的文字以及语言;

又如英文是ISO-8859-1字符集,还有BIG5、utf-8、shift-Jis、Euc、Koi8-2等字符集;

2、定时让网页在指定的时间n内,跳转到页面http://yourlink;

3、可以用于设定网页的到期时间,一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式;

4、是用于设定禁止浏览器从本地机的缓存中调阅页面内容,设定后一旦离开网页就无法从Cache中再调出;

5、cookie设定,如果网页过期,存盘的cookie将被删除。需要注意的也是必须使用GMT时间格式;

6、网页等级评定,在IE的internet选项中有一项内容设置,可以防止浏览一些受限制的网站,而网站的限制级别就是通过meta属性来设置的;

7、强制页面在当前窗口中以独立页面显示,可以防止自己的网页被别人当作一个frame页调用;

8、和设定进入和离开页面时的特殊效果,这个功能即FrontPage中的“格式/网页过渡”,不过所加的页面不能够是一个frame页面。

相关文章

  • HTTP缓存问题

    在客户端第一次请求数据时,此时缓存数据库中没有对应的缓存数据,需要请求服务器,服务器返回后,将数据存储至缓存数据库...

  • HTTP缓存问题

    介绍 平时我去学习Http应用层协议的时候,对于Http的结构和请求头字段的作用方面掌握了一些知识点,但是没有系统...

  • Http GET请求缓存问题

    GET 缓存导致的问题 在iOS 客户端通过AFNetworking 发起 GET 方式的HTTP请求时,导致数据...

  • HTTP缓存原理

    什么是HTTP缓存 HTTP缓存通常指浏览器缓存,基于HTTP中header字段实现HTTP缓存分为强缓存和协商缓...

  • 使用Redis构建web应用

    登录和cookie缓存 购物车 网页缓存 数据行缓存 网页分析代码格式有问题,见谅 欢迎访问本人博客:http:...

  • 前端缓存

    前端缓存 前端缓存主要是分为HTTP缓存和浏览器缓存。其中HTTP缓存是在HTTP请求传输时用到的缓存,主要在服务...

  • 移动端index.html被缓存问题

    在移动端,我们为了解决带宽限制或者网络缓慢等问题,常常会使用http协议缓存静态文件(http缓存简介),从而减少...

  • 前端缓存详解

    一、前言 前端缓存主要是分为HTTP缓存和浏览器缓存。其中HTTP缓存是在HTTP请求传输时用到的缓存,主要在服务...

  • 前端 http 缓存

    前端面试常问第二大问题是http缓存相关内容。说真的,http缓存相关的细节比较多,并且 http 常用协议版本有...

  • PWA笔记一:Web的万物基础缓存

    前言 这里讨论的缓存包括两种,一种是HTTP缓存,一种是Service Worker缓存。 HTTP缓存 HTTP...

网友评论

      本文标题:HTTP缓存问题

      本文链接:https://www.haomeiwen.com/subject/bacluxtx.html