js文件缓存之版本管理详解


Posted in Javascript onJuly 05, 2013

近几个月来的工作是一个交易系统持续改进项目,迭代发布周期大约为2~3周。最近一次迭代是V16版,在礼拜三完成发布。不幸的是,第二天上午就被老大逮过去。原来老大从生产中揪出了一个bug,大致的问题如下:

系统中有一个常用的自定义控件,目的是协助选择客户,而V16版的持续改进需求是给控件增加两个筛选选项,支持不同的默认值配置。很简单的一个需求,代码修改也简单,其中一个修改是给一个js文件里边的一个函数增加了一个传入参数,用来传递配置值。经过RC、RTW测试,一切都显得很正常,不过上了生产才被发现bug了。加载出来的客户明显不正常、数目不对,也与预期的查询配置不相符。

检查控件内部跳转链接,发现问题,传递的参数明显与预期不符,而这个链接则是由上面修改过的JS函数生成。因此判定问题是由于客户端缓存了原版JS文件,新函数的调用由旧函数所替换引发的。经过清除缓存,重新加载页面后,这个自定义控件能够正常工作。很不幸的是,我们是不能通过打电话告诉每一位用户,你需要清除缓存,然后才能正常使用这个功能。

到此时,我才意识到需要一种方法来控件JS的缓存问题,否则,后续任何涉及JS文件内容的修改,都会因为缓存无法获取最新JS文件,而导致生产事故。

原则上,我们是需要在有JS更新的时候,才会去重新加载JS文件,而不是每次都重新加载,因此第一种做法给JS应用地址后添加随机参数是不可取的,因为它意味着,几乎每次加载页面都会是重新加载JS,而不会合理的利用缓存JS。但是,我们还有第二种更合理的做法,如果关注过一些国外网站代码,会发现,他们通常是在js链接后添加一个版本号参数,而不是随机数,当js代码发生修改时,只需要将版本号加1,就可以很巧妙的解决通知客户端更新js文件。不知道,谁是第一个想到这种方法的人,不过毫无疑问,他是值得我们钦佩的,真是一个不错的idea的!

附赠些许代码:
<script src="../JavaScript/SelectOpenWindow.js?v=1" type="text/javascript"></script>

Javascript 相关文章推荐
避免 showModalDialog 弹出新窗体的原因分析
May 31 Javascript
jQuery Jcrop插件实现图片选取功能
Nov 23 Javascript
使用GruntJS链接与压缩多个JavaScript文件过程详解
Aug 02 Javascript
解释&amp;&amp;和||在javascript中的另类用法
Jul 28 Javascript
jQuery Ajax 上传文件处理方式介绍(推荐)
Jun 30 Javascript
基于jquery实现的银行卡号每隔4位自动插入空格的实现代码
Nov 22 Javascript
bootstrap daterangepicker双日历时间段选择控件详解
Jun 15 Javascript
详解Angular5路由传值方式及其相关问题
Apr 28 Javascript
[原创]微信小程序获取网络类型的方法示例
Mar 01 Javascript
inquirer.js一个用户与命令行交互的工具详解
May 18 Javascript
Vue实现数据表格合并列rowspan效果
Nov 30 Javascript
React+EggJs实现断点续传的示例代码
Jul 07 Javascript
单击复制文字兼容各浏览器的完美解决方案
Jul 04 #Javascript
把input初始值不写value的具体实现方法
Jul 04 #Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
Jul 04 #Javascript
简单实用jquery版三级联动select示例
Jul 04 #Javascript
原生javascript和jquery判断浏览器版本等信息
Jul 04 #Javascript
js将控件隐藏的方法及display属性介绍
Jul 04 #Javascript
Jquery多选框互相内容交换的实例代码
Jul 04 #Javascript
You might like
PHP zip扩展Linux下安装过程分享
2014/05/05 PHP
php取出数组单个值的方法
2018/03/12 PHP
js和jquery批量绑定事件传参数一(新猪猪原创)
2010/06/23 Javascript
js解析与序列化json数据(一)json.stringify()的基本用法
2013/02/01 Javascript
js 实现 input type=&quot;file&quot; 文件上传示例代码
2013/08/07 Javascript
js判断游览器类型及版本号的代码
2014/05/11 Javascript
使用命令对象代替switch语句的写法示例
2015/02/28 Javascript
深入理解JavaScript系列(17):面向对象编程之概论详细介绍
2015/03/04 Javascript
第一次接触JS require.js模块化工具
2016/04/17 Javascript
jQuery插件datatables使用教程
2016/04/21 Javascript
详细谈谈javascript的对象
2016/07/31 Javascript
Angularjs CURD 详解及实例代码
2016/09/14 Javascript
js实现倒计时效果(小于10补零)
2017/03/08 Javascript
个人小程序接入支付解决方案
2019/05/23 Javascript
vue项目创建步骤及路由router
2020/01/14 Javascript
使用React-Router实现前端路由鉴权的示例代码
2020/07/26 Javascript
把MySQL表结构映射为Python中的对象的教程
2015/04/07 Python
python实现简单tftp(基于udp协议)
2018/07/30 Python
django之静态文件 django 2.0 在网页中显示图片的例子
2019/07/28 Python
python 多进程队列数据处理详解
2019/12/23 Python
Python中join()函数多种操作代码实例
2020/01/13 Python
夏洛特和乔治婴儿和儿童时装精品店:Charlotte and George
2018/06/06 全球购物
印尼综合在线预订网站:Tiket.com(机票、酒店、火车、租车和娱乐)
2018/10/11 全球购物
碧欧泉Biotherm加拿大官方网站:法国高端护肤品牌
2019/10/18 全球购物
俄罗斯电动工具和设备购物网站:Vseinstrumenti.ru
2020/11/12 全球购物
公司薪酬管理制度
2014/01/31 职场文书
房屋转让协议书范本
2014/04/11 职场文书
2014乡镇党委副书记对照检查材料思想汇报
2014/10/09 职场文书
2014年学校总务处工作总结
2014/12/08 职场文书
2014年为民办实事工作总结
2014/12/20 职场文书
早会开场白台词大全
2015/06/01 职场文书
八月一日观后感
2015/06/10 职场文书
2016年党风廉政建设承诺书
2016/03/25 职场文书
pycharm debug 断点调试心得分享
2021/04/16 Python
古见同学有交流障碍症 第二季宣传CM公开播出
2022/04/11 日漫
Django框架中视图的用法
2022/06/10 Python