用过jquery的人都知道里面的$.ajax能设置超时处理及各种错误的抛出,确实好用。原生的js没有对应的方法,还得写各种兼容。在实际运用中,不管请求是否成功都应该做容错处理,

不然用户不知道到底发生了什么,体验非常不好。超时就是一种情况,不可能请求失败了还让用户在那傻傻等待,是谁都受不了。下面就介绍一下用setTimeout来实现请求的超时处理。

function createXMLHttpRequest() {
var request = false;
if(window.XMLHttpRequest) {
request = new XMLHttpRequest();
if(request.overrideMimeType) {
request.overrideMimeType('text/xml');
}
} else if(window.ActiveXObject) {
var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
for(var i=0; i<versions.length; i++) {
try {
request = new ActiveXObject(versions[i]);
if(request) {
return request;
}
} catch(e) {}
}
}
return request;
} function ajax(xmlhttp,_method, _url, _param, _callback) {
if (typeof xmlhttp == 'undefined') return;
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
_callback(xmlhttp);
}
}
xmlhttp.open(_method, _url, true);
if (_method == "POST") {
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlhttp.setRequestHeader("Content-Length", _param.length);
xmlhttp.send(_param);
}
else {
xmlhttp.send(null);
}
}
//使用举例

var xmlhttp = createXMLHttpRequest();
var t1; //用来作超时处理 function adduserok(request) {
alert(request.responseText);
if (t1) clearTimeout(t1);
} function connecttoFail() {
if (xmlhttp) xmlhttp.abort();
alert ('Time out');
} if (xmlhttp) {
ajax(xmlhttp,"POST", "http://10.1.2.187/adduser.cgi","act=do&user=abc",adduserok);
t1 = setTimeout(connecttoFail,30000);
}
else {
alert ("Init xmlhttprequest fail");
}

利用setTimeoutc处理javascript ajax请求超时的更多相关文章

  1. ajax请求超时判断(转载)

    ajax请求时有个参数可以借鉴一下 var ajaxTimeOut = $.ajax({ url:'', //请求的URL timeout : 1000, //超时时间设置,单位毫秒 type : ' ...

  2. ajax请求超时解决方案

    设置timeout的时间,通过检测complete时status的值判断请求是否超时,如果超时执行响应的操作. var ajaxTimeoutTest=$.ajax({ url:'',//请求地址 t ...

  3. ajax请求超时时间

    http://www.cnblogs.com/charling/p/3356216.html get post 请求 http://www.cnblogs.com/oneword/archive/20 ...

  4. javascript ajax请求

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  5. Javascript Ajax 请求

    var XMLHttpReq; function createXMLHttpRequest() { try { XMLHttpReq = new ActiveXObject("Msxml2. ...

  6. spring security:ajax请求的session超时处理

    当前端在用ajax请求时,如果没有设置session超时时间并且做跳转到登录界面的处理,那么只是靠后台是很难完成超时的一系列动作的:但是如果后台 没有封装一个ajax请求公共类,那么在ajax请求上下 ...

  7. ajax请求web容器控制超时

    1.项目用到超时控制,针对ajax请求超时,可以参照如下解决方案 tomcat容器 web.xml 中配置 <session-config> <session-timeout> ...

  8. 学习AJAX必知必会(3)~自动重启工具nodemon、缓存问题、请求超时和网络异常、取消重复请求

    1.nodemon 自动重启工具(自动重启基于nodejs开发的服务端应用) ■ nodemon 是一个工具,通过在检测到目录中的文件更改时自动重新启动node应用程序来帮助开发node.js. // ...

  9. Ajax实现的长轮询不阻塞同一时间内页面的其他Ajax请求(同域请求)

    最近要做一个来电的弹屏功能,利用OM 系统的接口,OM系统发送请求到接口程序,分析数据添加到mysql数据库中,然后把最新的数据id 跟今日来电的总的数量存储到memcache 中.弹屏程序根据读取的 ...

随机推荐

  1. 逆向学习-DLL注入

    DLL注入技术,可以实现钩取API,改进程序,修复Bug. DLL注入指的是向运行中的其他进程强制插入特定的DLL文件. DLL注入命令进程自行调用LoadLibrary()API,加载用户指定的DL ...

  2. css modules

    https://juejin.im/post/5aa727fc518825364001159b http://www.ruanyifeng.com/blog/2016/06/css_modules.h ...

  3. ionic基础知识

    ion-header-bar(头部 页眉) 在内容顶部添加一个固定header栏. 用法 <ion-header-bar align-title="left" class=& ...

  4. python2.x提示这个错误:UnicodeDecodeError: 'ascii' codec can't decode byte 0xe8 in position

    查了好久下面这个方法可用: 发现应该是因为python2.x的默认编码是ascii,而代码中可能由utf-8的字符导致,解决方法是设置utf-8. 找到出错的文件,在import后增加下面几行: #! ...

  5. zookeeper伪分布集群配置

    1.上传tar文件zookeeper-3.4.12.tar.gz 2.解压zookeeper-3.4.12.tar.gz [root@localhost zookeeper]# .tar.gz 3.重 ...

  6. linux curl post/put请求

    案列: -X: 请求方式 --header: 请求header -d: 请求的数据 最后跟上请求的地址 curl -X PUT --header 'Content-Type: application/ ...

  7. (转)CentOS分区操作详解

    CentOS分区操作详解 原文:http://blog.csdn.net/yonggeit/article/details/77924393 磁盘分区 分区格式的两种选择:MBR和GPT 分区命令: ...

  8. 当页面有多个js文件时,应如何引入?

    1. 我们知道如果一个页面有多个js文件,并且这些js文件有的还有依赖关系的时候,我们就要特别注意他们之间的引入顺序,否则就会报错. 如:一个js文件依赖jquery,我们就要先引入jquery,然后 ...

  9. MySQL多表更新

    多表更新:参照另外的表来更新本表的内容 table_reference {[inner | cross] join | {left | right} [outer] join}  内连接.左外连接.右 ...

  10. MATLAB拟合和插值

    定义 插值和拟合: 曲线拟合是指您拥有散点数据集并找到最适合数据一般形状的线(或曲线). 插值是指您有两个数据点并想知道两者之间的值是什么.中间的一半是他们的平均值,但如果你只想知道两者之间的四分之一 ...