jquery 之ajax cache
最近在做一个企业通讯录的功能,功能很简单,我的本意是做数据存储并且做同步更新,时间原因以及服务端的同事更倾向于简单点的方式,呵呵,于是我们就采取了实时查询的方式。
由于get请求有点多,由于页面的生命周期就是打开页面-关闭页面,想到cache,但是由于公司是使用的原生的ajax,因此研究一下jq的ajax的缓存是如何写的。
jq的思路大概是检测到需要cache这个请求,就会在对象池中检测是不是存在该url的Last-Modified值,存储容器如下:
// Last-Modified header cache for next request
lastModified: {},
etag: {},
然后,在发送请求的时候检测是否cache后,有如下的代码:
// Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode.
if ( s.ifModified ) {
if ( jQuery.lastModified[ cacheURL ] ) {
jqXHR.setRequestHeader( "If-Modified-Since", jQuery.lastModified[ cacheURL ] );
}
if ( jQuery.etag[ cacheURL ] ) {
jqXHR.setRequestHeader( "If-None-Match", jQuery.etag[ cacheURL ] );
}
}
这里的代码意思是如果说jq根据jQuery.lastModified字典中是否包含数据来决定是否设置If-Modified-Since。那第一次请求jQuery.lastModified是没有数据的(JS是无法获取浏览器缓存的信息),因此第一次请求jqXHR是没有设置If-Modified-Since,那也就解释了第一次请求jqXHR.status为200。因为有了第一次请求,jq获取获取到第一次请求响应中的Last-ModifiedjQuery.lastModified有了数据,第二次请求jqXHR是会加上If-Modified-Since头的,因此jqXHR.status收到了浏览器直接传递过来的请求响应及内容。
然后等到请求成功了的时候,
if ( s.ifModified ) {
modified = jqXHR.getResponseHeader("Last-Modified");
if ( modified ) {
jQuery.lastModified[ cacheURL ] = modified;
}
modified = jqXHR.getResponseHeader("etag");
if ( modified ) {
Query.etag[ cacheURL ] = modified;
}
}
此时,从返回头中获取Last-Modified的值,一般是个时间,etag一般是一个hash,两种方式比较类似,然后这个值就会被缓存在jq的池子中,下次再请求就是304了。
关于lastModified 跟 etag可以参考 一下链接 http://www.51testing.com/html/28/116228-238337.html
jquery 之ajax cache的更多相关文章
- jQuery之ajax实现篇
jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...
- 对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache
虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯:2,可以对ajax操作做一些统一处理,比如追加随机数或 ...
- jquery中ajax在firefox浏览器下“object XMLDocument”返回结果的解决办法
asp.net中借助jquery的ajax处理功能,使用起来很方便.但是在firefox下获得的data报错object XMLDocument.这是因为默认的情况下把datatype用html来解析 ...
- 关于Jquery中ajax介绍
jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该函数,除非你需 ...
- 基于jQuery的ajax对WebApi和OData的封装
基于jQuery的ajax对WebApi和OData的封装 WebApi 的使用带来了一个显著的特点,对type有一定的要求.一般ajax的type无非就是两种,GET和POST.如果用JSONP来跨 ...
- jquery中ajax的简单使用
一.load() 这是最简单的一个函数,传入一个url他会异步加载该url的内容,然后将内容插入每一个选中的元素中,替换掉其中已经存在的内容. 所以最简单的用法是: $("#myDiv&qu ...
- 【ERROR】使用jquery的ajax出现error:readyState=4,status=500
使用jquery的ajax出现error:readyState=4,status=500,ajax代码如下: $.ajax({ url : "../toBeFinMisManage/show ...
- 触碰jQuery:AJAX异步详解
触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...
- jQuery调用AJAX异步详解[转]
AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1) 使用CSS和X ...
随机推荐
- Django session存储到redis数据库
把session存储到redis数据库,需要在setting中配置 django-redis 中文文档 http://django-redis-chs.readthedocs.io/zh_CN/lat ...
- 如何用Github删除repository
第一步,登陆github,一定要点开要删除的repository,再选择相应的setting: 第二步,下拉选择,delete this repository 第三步,输入删除的仓库名,删除repos ...
- .NET平台常用的开发组件(csdn)
.NET平台常用的开发组件 原创 2017年02月24日 09:20:04 工欲善其事,必先利其器.学习.NET也10年有余,其优雅的编程风格,高效率的开发速度,极度简单的可扩展性,足够强大开发类库, ...
- vs2013突然打不开项目,项目全部不兼容
转载:https://forum.cocos.com/t/vs2013/40931 转载:https://jingyan.baidu.com/article/cdddd41c7c6b5353cb00e ...
- Python模块1
序列化模块: 将原本的字典.列表等内容转换成一个字符串的过程就叫做序列化. 序列化的目的 1.以某种存储形式使自定义对象持久化: 2.将对象从一个地方传递到另一个地方. 3.使程序更具维护性. jso ...
- 关于PHP5.6连接SqlServer
在做一个PHP报名系统的时候需要使用mssql来和winform结合起来使用, 但是发现我的php环境没有sqlsrv模块,于是乎,我就开始百度了 找到了微软官方下载地址,对照php版本,下载对应的模 ...
- javascript 之 面向对象【理解对象】
第五版本 6.1.1 属性类型 1/数据属性 :包含有数据值的问题.有内部有特性和属性,是为了实现javaScript引擎用的,在javaScript中不能直接访问 [[Configur ...
- 前端学习之CSS
CSS介绍 CSS(Cascading Style Sheet, 层叠样式表)定义如何显示HTML元素, 给HTML设置样式, 让它更加美观. 当浏览器读到一个样式表, 它就会按照这个样式表来对文档进 ...
- C++ 获取Unix时间戳
什么是Unix时间戳? Unix时间戳(Unix timestamp),或称Unix时间(Unix time).POSIX时间(POSIX time),是一种时间表示方式,定义为从格林威治时间1970 ...
- C# 在类中使用Timer定时器以及延时处理的方法
我们平时在C#中要用到定时功能时,有自带定时器,一般在定时器里面写函数就行了,现在需要在类里面写了一个定时器,不和界面绑定,一开始的时候感觉没什么思路,然后看了一下界面的设计代码,有了思路,还是很简单 ...