使用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. 题解 洛谷 P3376 【【模板】网络最大流】

    本人很弱,只会Dinic.EK与Ford-Fulkerson...(正在学习ISAP...) 这里讲Dinic... Dinic:与Ford-Fulkerson和的思路相似(话说好像最大流求解都差不多 ...

  2. 关于buffer和cache的区别

    1. Cache:缓存区,是高速缓存,是位于CPU和主内存之间的容量较小但速度很快的存储器,因为CPU的速度远远高于主内存的速度,CPU从内存中读取数据需等待很长的时间,而  Cache保存着CPU刚 ...

  3. MySql5.7免安装版配置过程(ubuntu16.04)

    MySql5.7免安装版配置过程(ubuntu16.04) 原创 2017年02月07日 16:58:24 标签: 1001 编辑 删除 一.安装环境: 操作系统:ubuntu16.04 数据库:my ...

  4. 阿里云CentOS系统配置iptables防火墙

    虽说阿里云推出了云盾服务,但是自己再加一层防火墙总归是更安全些,下面是我在阿里云vps上配置防火墙的过程,目前只配置INPUT.OUTPUT和FORWORD都是ACCEPT的规则 一.检查iptabl ...

  5. Postman(API & HTTP请求调试插件)

    简述 Postman是一个Chrome扩展,提供功能强大的Web API & HTTP请求调试.它能够发送任何类型的HTTP 请求(GET.HEAD.POST.PUT..),附带任何数量的参数 ...

  6. libevent的使用(socket)

    这篇文章介绍下libevent在socket异步编程中的应用.在一些对性能要求较高的网络应用程序中,为了防止程序堵塞在socket I/O操作上造成程序性能的下降,须要使用异步编程,即程序准备好读写的 ...

  7. Leetcode:Singel Number

    问题描写叙述: Given an array of integers, every element appears twice except for one. Find that single one ...

  8. 芒果TV真实视频地址解析

    本文旨在互相学习,请勿滥用 若有幸被您引用请附加地址来源http://blog.csdn.net/feige2008/article/details/37579051 文章主要解析芒果TV的视频真实地 ...

  9. cocos2dx下的A星算法

    这是我依据这篇博文http://hi.baidu.com/wsapyoemdfacmqr/item/bdfb5c0a74c904d01ef0466d.来在cocos2dx上编写.这是终于的效果图: 红 ...

  10. 一步一步跟我学习lucene(19)---lucene增量更新和NRT(near-real-time)Query近实时查询

    这两天加班,不能兼顾博客的更新.请大家见谅. 有时候我们创建完索引之后,数据源可能有更新的内容.而我们又想像数据库那样能直接体如今查询中.这里就是我们所说的增量索引.对于这种需求我们怎么来实现呢?lu ...