构造可重用的Ajax对象

可重用类：

 1 function Ajax() {
 2     var oXhr = null;
 3     var msxml_progid = [
 4         'MSXML2.XMLHTTP.6.0',
 5         'MSXML3.XMLHTTP',
 6         'Microsoft.XMLHTTP',
 7         'MSXML2.XMLHTTP.3.0'
 8     ];
 9     try{
10         oXhr = new XMLHttpRequest();            //先尝试标准方法
11     }catch(e) {
12         for(var i=0, len=msxml_progid.length; i<len; i++) {
13             try{
14                 oXhr = new ActiveXObject(msxml_progid[i]);
15                 break;
16             }catch(e2) {}
17         }
18     }finally {
19         if(!oXhr) return;
20     }
21     this.oXhr = oXhr;
22 }
23 Ajax.prototype.get(url, options) {
24     if(this.oXhr) {
25         var oXhr = this.oXhr;
26         var aborted = false;        //请求是否被取消
27         //默认参数
28         var _options = {
29             method: 'GET',
30             timeout: 5,                //s为单位
31             onerror: function() {},
32             onsuccess: function() {}
33         };
34         //覆盖各个选项
35         for(var key in options) {
36             _options[key] = options[key];
37         }
38         function checkForTimeout() {
39             if(oXhr.readyState != 4) {
40                 aborted = true;
41                 oXhr.abort();
42             }
43         }
44         //超时调用函数取消请求
45         setTimeout(checkForTimeout, _options.timeout * 1000);
46         function onreadystateCallback() {
47             if(oXhr.readyState == 4) {
48                 if(!aborted && oXhr.status>=200 && oXhr.status<=300) {
49                     _options.onsuccess(oXhr);
50                 }else {
51                     _options.onerror(oXhr);
52                 }
53             }
54         }
55         oXhr.open(_options.method, url, true);
56         oXhr.onreadystatechange = onreadystateCallback;
57         oXhr.send();
58     }
59 };

为失败做准备

• 如果请求超时会发生什么事？应该等待多长时间

解决办法：等待一段时间后调用超时，并处理超时错误。

• 如果取回的数据与预期不符怎么办

应在服务器端设置应急方案，在结果里返回某种错误代码。客户端接收数据后，先有无检查错误代码。

这是处理JSON数据格式的情况：

{“error”:{“id”:1, “message”:”Your session has ,,,”}}
var UNKNOWN = 0;
function processRequestSuccess(oXhr) {
    var obj = oXhr.responseText.parseJSON();
    if(!obj) {
        processError(UNKNOWN);
    }else if(obj.error) {
        processError(obj.error.id, obj.error.message);
    }else {
        //按照正常情况继续处理请求
        //...
    }
}

• 如果发出了多个请求会发生什么事？(尤其是在响应返回的顺序和请求发生的顺序不一致的情况下！)

在web应用中，多重请求是司空见惯的。

1)  第一次请求已经发出，而后续的请求应该覆盖掉第一次请求。

2)  连续发出了多个请求，但调用返回的顺序是不定的。 (用一个令牌来跟踪每次调用)

如果打算重用这个Ajax对象，让它发送多个请求，那么必须在open调用之后声明onreadystatechange事件，否者IE5/6上只有第一次调用成功执行，其他都会失败