博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
浏览器端缓存的一个小问题及解决方案
阅读量:5326 次
发布时间:2019-06-14

本文共 889 字,大约阅读时间需要 2 分钟。

浏览器的缓存行为可以提高网页的加载速度,但有时也会带来一些困扰。当用jQuery的get方法异步调用服务端资源的时候,浏览器会把调用结果进行缓存,拿不到实时的数据影响代码的逻辑实现,这种情况最简单的解决方法是在请求的链接后加一个随机数参数,或者用jQuery的ajax方法并设置cache为false。

但上面两种总感觉不太完美,项目中大量的使用了ajax,每一个都加一个随机参数,想想都蛋疼;使用$.ajax并设置cache为false的方式,多少有些繁琐,而且难免有开发人员忽略这个问题使用了$.get引起bug。

于是决定使用jQuery.ajaxSetup()方法,全局禁用浏览器端缓存。在一个全局的js脚本中增加以下代码:

$.ajaxSetup({ cache: false });

新问题随之而来,这种方式不仅禁用了一般请求的缓存,也禁用js脚本文件的缓存,项目中的js文件比较多,再加上使用了大量的第三方的前端组件,每次刷新页面,这些js都要重新加载一遍,页面响应直接由原来的流畅变为龟速了。

有没有办法禁用ajax的缓存,保留脚本文件的缓存呢?

在jQuery官方文档上找到了这个方法 ,可以对不同请求类型分别进行配置,于是可以全局禁用缓存,然后针对script开启缓存,最终代码如下:

$.ajaxSetup({ cache: false });$.ajaxPrefilter('script', function (options) { options.cache = true; });

对于脚本的缓存,还有一个问题需要注意,如果浏览器缓存了该脚本,而服务端有修改了这个脚本,可能会引起一些错误。对脚本文件的url加一个版本号可以解决这个问题,每次修改了脚本后只需要递增这个版本号即可。如果使用mvc的Bundle来管理js文件的话就不用考虑这个了,把web.config的开关设置为release之后,Bundle框架会自动处理js文件的版本问题。

转载于:https://www.cnblogs.com/FuzhePan/p/3976983.html

你可能感兴趣的文章
微软职位内部推荐-Sr. SE - Office incubation
查看>>
微软职位内部推荐-SOFTWARE ENGINEER II
查看>>
centos系统python2.7更新到3.5
查看>>
C#类与结构体究竟谁快——各种函数调用模式速度评测
查看>>
我到底要选择一种什么样的生活方式,度过这一辈子呢:人生自由与职业发展方向(下)...
查看>>
poj 题目分类
查看>>
windows 安装yaml支持和pytest支持等
查看>>
读书笔记:季羡林关于如何做研究学问的心得
查看>>
面向对象的优点
查看>>
套接口和I/O通信
查看>>
阿里巴巴面试之利用两个int值实现读写锁
查看>>
浅谈性能测试
查看>>
Winform 菜单和工具栏控件
查看>>
CDH版本大数据集群下搭建的Hue详细启动步骤(图文详解)
查看>>
巧用Win+R
查看>>
浅析原生js模仿addclass和removeclass
查看>>
Python中的greenlet包实现并发编程的入门教程
查看>>
java中遍历属性字段及值(常见方法)
查看>>
深入理解jQuery框架-框架结构
查看>>
YUI3自动加载树实现
查看>>