使用jQuery Ajax功能时需要注意的一个问题(内存溢出)


Posted in Javascript onMay 30, 2012

最近一哥们在做一个Ajax长连接的项目,页面需要和服务器保持长连接,而且在连接超时后需要重新请求连接,过程中他问我要用到什么,我也是想都没想就告诉他用jQuery。jQuery不是有ajaxSuccess ajaxError这些对象吗,在请求完成或者请求失败后重新请求不就好了。

但是后来他告诉我说没有用 jQuery,自己手工写的XMLhttprequest 。他告诉我说,开始是用jquery写的,而且在测试过程中也没有出现问题。但是在后来无意中发现,在页面开的时候久了之后,浏览器资源竟然占用非常高导致内存不足而崩溃了。后来抓包分析发现,每次jquery的Ajax请求都会创建一个xmlHttprequest对象,理论上讲,长连接的请求是一个无限递归,请求数量是非常大的,但是由于每次请求都会建立一个新的xmlhttprequest,而且jquery不会自动回收资源,所以导致了内存溢出。

通过查看jquery API,发现jquery还有一个 complete对象,是请求完成后回调函数 (请求成功或失败之后均调用)。 同时有两个参数XMLHttpRequest, textStatus。所以,我们只需要在请求完成后,将传回的XMLHttprequest对象手工回收即可,代码如下:

$.ajax({ 
url: "https://3water.com", 
data: { name: "xxxx" }, 
dataType: "xml", 
success: function (data, textStatus) { 
//do something... 
}, 
complete: function (XHR, TS) { XHR = null } 
});
Javascript 相关文章推荐
纯JS实现的批量图片预览加载功能
Aug 14 Javascript
jQuery图片的展开和收缩实现代码
Apr 16 Javascript
jquery动态改变onclick属性导致失效的问题解决方法
Dec 04 Javascript
JavaScript中使用typeof运算符需要注意的几个坑
Nov 08 Javascript
node.js连接mongoDB数据库 快速搭建自己的web服务
Apr 17 Javascript
JavaScript实现AOP详解(面向切面编程,装饰者模式)
Dec 19 Javascript
d3绘制基本的柱形图的实现代码
Dec 12 Javascript
Vue2.0+Vux搭建一个完整的移动webApp项目的示例
Mar 19 Javascript
vue图片加载失败时用默认图片替换的方法
Aug 29 Javascript
详解Vscode中使用Eslint终极配置大全
Nov 08 Javascript
浅谈关于vue中scss公用的解决方案
Dec 02 Javascript
Element实现表格嵌套、多个表格共用一个表头的方法
May 09 Javascript
Chosen 基于jquery的选择框插件使用方法
May 30 #Javascript
基于jquery的鼠标拖动效果代码
May 30 #Javascript
基于jquery的文本框与autocomplete结合使用(asp.net+json)
May 30 #Javascript
基于jQuery的倒计时实现代码
May 30 #Javascript
基于jquery的放大镜效果
May 30 #Javascript
幻灯片带网页设计中的20个奇妙应用示例小结
May 27 #Javascript
Javascript的常规数组和关联数组对比小结
May 24 #Javascript
You might like
PHP下几种删除目录的方法总结
2007/08/19 PHP
smarty内置函数capture用法分析
2015/01/22 PHP
PHP多文件上传实例
2015/07/09 PHP
使用PHP json_decode可能遇到的坑与解决方法
2017/08/03 PHP
实例解析php的数据类型
2018/10/24 PHP
php实现微信小程序授权登录功能(实现流程)
2019/11/13 PHP
走出JavaScript初学困境—js初学
2008/12/29 Javascript
javascript写的一个链表实现代码
2009/10/25 Javascript
jquery事件机制扩展插件 jquery鼠标右键事件。
2011/12/26 Javascript
JQuery设置和去除disabled属性的5种方法总结
2013/05/16 Javascript
解析Jquery的LigerUI如何实现文件上传
2013/07/09 Javascript
JS批量操作CSS属性详细解析
2013/12/16 Javascript
网页右下角弹出窗体实现代码
2014/06/05 Javascript
jQuery插件bxSlider实现响应式焦点图
2015/04/12 Javascript
jQuery实现文档树效果
2017/02/20 Javascript
详谈js遍历集合(Array,Map,Set)
2017/04/06 Javascript
axios实现文件上传并获取进度
2020/03/25 Javascript
浅析webpack-bundle-analyzer在vue-cli3中的使用
2019/10/23 Javascript
[08:06]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Elephant 选手采访
2021/03/11 DOTA
Python实现MySQL操作的方法小结【安装,连接,增删改查等】
2017/07/12 Python
python 生成器协程运算实例
2017/09/04 Python
Python之inspect模块实现获取加载模块路径的方法
2018/10/16 Python
Linux下安装python3.6和第三方库的教程详解
2018/11/09 Python
Python数据预处理之数据规范化(归一化)示例
2019/01/08 Python
使用Python轻松完成垃圾分类(基于图像识别)
2019/07/09 Python
Python3之乱码\xe6\x97\xa0\xe6\xb3\x95处理方式
2020/05/11 Python
Python list和str互转的实现示例
2020/11/16 Python
英国行业制服供应商:Alexandra
2019/09/14 全球购物
新加坡鲜花速递/新加坡网上花店:Ferns N Petals
2020/08/29 全球购物
卫生安全检查制度
2014/02/04 职场文书
硕士研究生就业推荐信
2014/05/18 职场文书
群众路线教育实践活动对照检查材料思想汇报(副处级领导)
2014/10/04 职场文书
2014年圣诞节寄语
2014/12/08 职场文书
主持人大赛开场白
2015/05/29 职场文书
Python进度条的使用
2021/05/17 Python
React四级菜单的实现
2022/04/08 Javascript