javascript之处理Ajax错误

来源：互联网发布：淘宝虚拟网店不让开了编辑：程序博客网时间：2024/06/06 17:18

使用Ajax须留心两类错误。它们的区别源于视角的不同。

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

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

有三种方式可以处理这些错误，如下代码所示：

<!DOCTYPE html><html lang="zh-CN"><head>    <meta charset="UTF-8">    <title>上海远地资产管理有限公司</title>    <meta name="author" content="jason"/>    <meta name="description" content="上海远地资产管理有限公司（简称：远地资产），是一家专业的互联网金融服务平台."/>    <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/></head><body>    <div>        <button>Apples</button>        <button>Cherries</button>        <button>Bananas</button>        <button>Cucumber</button>        <button id="badhost">Bad Host</button>        <button id="badurl">Bad URL</button>    </div>    <div id="target">        加载内容    </div>    <div id="errormsg"></div>    <div id="statusmsg"></div>    <script>        var buttons=document.getElementsByTagName("button");        for(var i=0;i<buttons.length;i++){            buttons[i].onclick=handleButtonPress;        }        var httpRequest;        function handleButtonPress(e){            clearMessages();            httpRequest=new XMLHttpRequest();            httpRequest.onreadystatechange=handleResponse;            httpRequest.onerror=handleError;            try{                switch (e.target.id){                    //处理请求错误：请求已生成，但主机名不能被DNS解析                    case "badhost":                        httpRequest.open("GET","http://a.nodomain/doc.html");                        break;                    //处理设置错误：向XMLHttpRequest对象传递了错误的数据，比如格式不正确的URL                    case "badurl":                        httpRequest.open("GET","http://");                        break;                    //处理应用程序错误：请求已成功完成，但当你请求某个不存在的文档时，会获得404的状态码；                    default:                        httpRequest.open("GET", e.target.innerHTML+".html");                        break;                }                httpRequest.send();            }catch(error){                displayErrorMsg("try/catch",error.message);            }        }        function handleError(e){            displayErrorMsg("Error event",httpRequest.status+httpRequest.statusText);        }        function handleResponse(){            if(httpRequest.readyState==4){                var target=document.getElementById("target");                if(httpRequest.status==200){                    target.innerHTML=httpRequest.responseText;                }else{                    document.getElementById("statusmsg").innerHTML="Status:"+httpRequest.status+" >>"+httpRequest.statusText;                }            }        }        function displayErrorMsg(src,msg){            document.getElementById("errormsg").innerHTML=src+": "+msg;        }        function clearMessages(){            document.getElementById("errormsg").innerHTML="";            document.getElementById("statusmsg").innerHTML="";        }    </script></body></html>

0 0