使用ajax时必须留心两类错误,他们之间的区别源于视角不同。

一、第一类错误是从XMLHttpRequest对象的角度看到的问题:某些因素阻例如止了请求发送到服务器,例如DNS无法解析主机名,连接请求被拒绝,或者url无效。

二、第二类问题是从应用程序的角度看到的问题而非XMLHttpRequest对象。它们发生于请求成功发送至服务器,服务器接受请求、进行处理并生成响应,但该响应并不指向你期望的内容时。如:如果你请求的URL不存在,这类问题就会发生。

一、处理设置错误

需要处理的第一类问题是向XMLHttpRequest对象传递了错误的数据,比如格式不正确的URL,它们极其容易发生在生成基于用户输入的URL时。这是一种会阻止请求执行的错误,而XMLHttpRequest对象会在发生这类事件时抛出一个错误。这就意味着你需要用一条try...catch语句来围住设置请求的代码,如下所示:

try{
...
httpRequest.open("GET","http://");
...
httpRequest.send();
}catch(error){
displayErrorMsg("try/catch",error.message)
}

catch子句让你有机会从错误中恢复。可以选择提示用户输入一个值,也可以回退至默认URL,或是简单地丢弃这个请求。

二、处理请求错误

第二类错误发生在请求已生成,但其他方面出错时。注册一个error事件监听器,浏览器就会向你的监听函数发送一个Event对象。httpRequest.onerror=handleError;

function handleError(e){
displayErrorMsg("Error event",httpRequest.status+httpRequest.statusText)
}

当这类错误发生时,你能从XMLHttpRequest对象获得何种程度的信息取决于浏览器,遗憾的时,大多数情况下你会得到值为0的status和空白的statusText值。

第二个问题是URL和生成请求的脚本具有不同的来源,在默认情况下这是不允许。你通常只能向载入脚本的同源URL发送Ajax请求。浏览器报告这个问题时可能会bu'jin抛出Error或者触发error事件,不同浏览器处理方式不尽相同。不同浏览器还会在不同的时点检查来源,这就意味着你不一定总是能看到浏览器对同一问题突出显示。你可以使用跨站资源(CORS Cross-Origin Resource Sharing)来绕过同源限制。

三、处理应用程序错误

最后一类错误发生于请求完成(从XMLHttpRequest对象的角度看),但没有返回你想要的数据时。这一过程本身没有错误(因为请求已成功完成),你需要根据status属性来确定发生了什么。当你请求某个不存在的文档时,你会获得404这个状态码,它的意思是服务器无法找到请求的文档,你可以看到我是如何处理200(意思是ok)以外的状态码的:

if(httpRequest.status==200){
target.innerHtml=httpRequest.responseText;
}else{
document.getElementById("statusmsg").innerHtml="Status:"+httpRequest.statusText;
}

在这个例子中,我只是简单地显示了status和statusText的值。而在真正的应用程序里,你需要以一种有用且有意义的方式进行恢复(比如显示备用内容或警告用户有问题,具体看哪种更适合应用程序)

ajax处理错误(六)的更多相关文章

  1. 框架基础:ajax设计方案(六)--- 全局配置、请求格式拓展和优化、请求二进制类型、浏览器错误搜集以及npm打包发布

    距离上一次博客大概好多好多时间了,感觉再不搞点东西出来,感觉就废了的感觉.这段时间回老家学习驾照,修养,然后7月底来上海求职(面了4家,拿了3家office),然后入职同程旅游,项目赶进度等等一系列的 ...

  2. 前端通信:ajax设计方案(六)--- 全局配置、请求格式拓展和优化、请求二进制类型、浏览器错误搜集以及npm打包发布

    距离上一次博客大概好多好多时间了,感觉再不搞点东西出来,感觉就废了的感觉.这段时间回老家学习驾照,修养,然后7月底来上海求职(面了4家,拿了3家office),然后入职同程旅游,项目赶进度等等一系列的 ...

  3. jQuery ajax请求错误返回status 0和错误error的问题

    上周发现一个jQuery ajax请求错误返回status 0和错误error的问题,responseText是"error",状态码是0而不是200: $.ajax({ type ...

  4. 全局配置一个ajax的错误监控

    全局配置一个ajax的错误监控,比如$(document).ajaxError(function(evt, req, settings){    if(req && (req.stat ...

  5. JQuery.Ajax之错误调试帮助信息

    下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求 ...

  6. 转:JQuery.Ajax之错误调试帮助信息

    今天发现一篇讲Ajax比较好的文章,汇总下,作为自己的知识储备. 下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. typ ...

  7. asp.net ajax 调用错误解决

    ajax调用aspx页面出现如下错误 前台源代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

  8. [转]JQuery.Ajax之错误调试帮助信息

    下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求 ...

  9. JQuery.Ajax之错误调试帮助信息介绍

    下面是Jquery中AJAX参数详细列表: timeout Number 设置请求超时时间(毫秒).此设置将覆盖全局设置. async Boolean (默认: true) 默认设置下,所有请求均为异 ...

随机推荐

  1. 你的Android应用完全不需要那么多的权限

    Android系统的权限从用户的角度来看有时候的确有点让人摸不着头脑.有时候可能你只需要做一些简单的事情(对联系人的信息进行编辑),却申请了远超你应用所需的权限(比如访问所有联系人信息的权限). 这很 ...

  2. 【Android进阶篇】Fragment的两种载入方式

    一.概述 Fragment(碎片,片段)是在Android 3.0后才引入的,基本的目的是为了实如今大屏幕设备上的更加动态更加灵活的UI设计. 这是由于平板电脑的屏幕比手机大得多,所以屏幕上能够放很多 ...

  3. 【数据压缩】JPEG标准与原理解析

    转载请注明出处:http://blog.csdn.net/luoshixian099/article/details/50392230 CSDN-勿在浮沙筑高台 为了满足不同应用的需求,JPEG标准包 ...

  4. jni java与c++交互返回三维数组jobjectArray

    1.在java里创建一个类,在类里添加静态方法调用c++的类库dll,在java里创建要返回数组的函数.在java的main方法里创建返回后的测试方法. package cn.gov.cma.cnn. ...

  5. Pocket英语语法---三、英语动词的特点是什么

    Pocket英语语法---三.英语动词的特点是什么 一.总结 一句话总结:即表示时间(时态),又表示人数(单复数) 1.第十七讲,不定量表达法? 1.a few为肯定含义几个,few为否定含义没几个, ...

  6. thinkphp命名空间

    thinkphp命名空间 总结 1.只对函数,类,及const定义的常量有效,对define定义的常量无效 2.如果函数不是为了使用,那有什么意义呢 3.ThinkPHP将命名空间转化为了路径,比如n ...

  7. input元素和display:inline-block的元素不在一行的解决办法

    每次用到了<input/> 元素 和inline-block的<span></span>(不一定是span,其他一些inline的元素也是一样)元素,他们总是会不在 ...

  8. Android-Context的一切

    Context类型 我们知道,Android应用都是使用Java语言来编写的,那么大家可以思考一下,一个Android程序和一个Java程序,他们最大的区别在哪里?划分界限又是什么呢?其实简单点分析, ...

  9. Access-Control-Allow-Origin 如何设置多个值呢

    需求就是多个网站请求同一个api服务器和这里一样https://segmentfault.com/q/10... 我不是做后端的,但是我们后端不知道怎么设置,在web.config里设置了一下 < ...

  10. tensorflow 1 - 起步

    使用图 (graph) 来表示计算任务. 在被称之为 会话 (Session) 的上下文 (context) 中执行图. 使用 tensor 表示数据. 通过 变量 (Variable) 维护状态. ...