• jquery 之ajax cache


       最近在做一个企业通讯录的功能,功能很简单,我的本意是做数据存储并且做同步更新,时间原因以及服务端的同事更倾向于简单点的方式,呵呵,于是我们就采取了实时查询的方式。

       由于get请求有点多,由于页面的生命周期就是打开页面-关闭页面,想到cache,但是由于公司是使用的原生的ajax,因此研究一下jq的ajax的缓存是如何写的。

            jq的思路大概是检测到需要cache这个请求,就会在对象池中检测是不是存在该url的Last-Modified值,存储容器如下:

         

    1 // Last-Modified header cache for next request
    2 lastModified: {},
    3 etag: {},

    然后,在发送请求的时候检测是否cache后,有如下的代码:

    1 // Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode.
    2 if ( s.ifModified ) {
    3     if ( jQuery.lastModified[ cacheURL ] ) {
    4         jqXHR.setRequestHeader( "If-Modified-Since", jQuery.lastModified[ cacheURL ] );
    5     }
    6     if ( jQuery.etag[ cacheURL ] ) {
    7         jqXHR.setRequestHeader( "If-None-Match", jQuery.etag[ cacheURL ] );
    8     }
    9 }

    这里的代码意思是如果说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收到了浏览器直接传递过来的请求响应及内容。

      然后等到请求成功了的时候,

     1 if ( s.ifModified ) {
     2     modified = jqXHR.getResponseHeader("Last-Modified");
     3     if ( modified ) {
     4         jQuery.lastModified[ cacheURL ] = modified;
     5     }
     6     modified = jqXHR.getResponseHeader("etag");
     7     if ( modified ) {
     8         Query.etag[ cacheURL ] = modified;
     9     }
    10 }

    此时,从返回头中获取Last-Modified的值,一般是个时间,etag一般是一个hash,两种方式比较类似,然后这个值就会被缓存在jq的池子中,下次再请求就是304了。

      关于lastModified 跟 etag可以参考 一下链接 http://www.51testing.com/html/28/116228-238337.html

      

    
    
  • 相关阅读:
    操作系统读书笔记01
    k-mean鸢尾花分类
    利用numpy完成波士顿房价预测任务
    软件过程管理读书笔记01
    软件测试读书笔记01
    数据分析与数据挖掘
    oracle 导出导入操作
    oracle降低高水位操作
    dubbo工程刚初始化报错明明找得到jar包还是报错
    get请求参数中带有url
  • 原文地址:https://www.cnblogs.com/onedayof2010/p/5073851.html
Copyright © 2020-2023  润新知