如何爲XMLHttpRequest設置超時和ontimeout？

目前我正在使用下面可見的類似代碼在創建XMLHttpRequest的實例時爲timeout設置特定值。我還爲ontimeout設置了一個函數，當事件被觸發時它將被執行。如何爲XMLHttpRequest設置超時和ontimeout？

我想知道是否有可能在調用ontimeout時全局設置timeout值和全局函數。

我知道我可以使用一個工廠XMLHttpRequest它可以設置timeout和ontimeout自動創建的每個實例，但我想知道是否有不同的方法存在。

注：我正在尋找基於香草JavaScript（沒有jQuery或其他庫）的解決方案，我只針對Chrome和FireFox最新版本。

任何想法是歡迎感謝。

var xhr = new XMLHttpRequest(); 
xhr.open('GET', '/server', true); 
xhr.timeout = 2000; 
xhr.onload = function() {}; 
xhr.ontimeout = function (e) { 
    // do smt here 
}; 
xhr.send(null);

來源

2016-06-27 GibboK

你的代碼被封裝在'common'函數中嗎？如果是的話，你可以使用'||'，'xhr.timeout = PassedArgument || 2000;' – Rayon

你至少有三種選擇：

封裝你的XMLHttpRequest使用自己的函數。這可以讓你在這個函數中應用這些類型的東西。你的代碼使用函數的事實使得它完全清楚發生了什麼。例如：
```
function createXHR() { 
    var xhr = new XMLHttpRequest(); 
    xhr.timeout = 2000; 
    xhr.addEventListener("timeout", function(e) { 
     // ... 
    }); 
    return xhr; 
} 
```

覆蓋XMLHttpRequest用自己的版本。 我不建議這樣做，但有時如果您需要直接與使用XMLHttpRequest的代碼集成，您可能會覺得您需要這樣做。例如：

(function() { 
    var realXMLHttpRequest = XMLHttpRequest; 
    XMLHttpRequest = function fakeXMLHttpRequest() { 
     realXMLHttpRequest.apply(this, arguments); 
     this.timeout = 2000; 
     this.addEventListener("timeout", function(e) { 
      // ... 
     }); 
    }; 
    XMLHttpRequest.prototype = realXMLHttpRequest.prototype; 
})();

同樣，我不推薦它，但它是可能的。

你在下面說過，上面的那個不適合你。如果不這樣做，那是因爲你使用的XMLHttpRequest實現讓生活變得困難。此變通辦法將工作：

(function() { 
    var realXMLHttpRequest = XMLHttpRequest; 
    XMLHttpRequest = function fakeXMLHttpRequest(arg) { 
     var xhr; 
     if (typeof arg !== "undefined") { 
      // Some implementations allow for a non-standard argument, support them 
      xhr = new realXMLHttpRequest(arg); 
     } else { 
      // Normal case 
      xhr = new realXMLHttpRequest(); 
     } 
     xhr.timeout = 2000; 
     xhr.addEventListener("timeout", function(e) { 
      // ... 
     }); 
     return xhr; 
    }; 
    XMLHttpRequest.prototype = realXMLHttpRequest.prototype; 
})();

即使你new XMLHttpRequest調用它，因爲new操作者的工作方式是，它創建對象並調用該對象的this功能，再new結果這一工程是那個對象，除非函數返回一個不同的非對象，如上面那樣。

我提到我不推薦這個？ ;-)

使用已經爲您做過＃1的庫。

來源

2016-06-27 09:20:38

感謝您的時間，使用選項2我得到以下錯誤：dojo.js：1287 Uncaught TypeError：無法構造'XMLHttpRequest'：請使用'new'運算符，此DOM對象構造函數不能作爲功能。示例https://jsfiddle.net/qa0ewa49/ – GibboK

您認爲以下猴子補丁是否正確？感謝您的時間。 https://jsfiddle.net/9417y5py/ – GibboK

@GibboK：如果你得到這個錯誤，那個特殊的'XMLHttpRequest'實現就很痛苦。我上面編輯過。是的，那個'send'版本看起來不錯，雖然我不主張'onxyz'處理程序。 –

我能夠使用下面的代碼猴路徑XMLHttpRequest。

(function (xhr) { 
     var send = xhr.send; 
     xhr.send = function (data) { 
      this.timeout = 5000; 
      var hasTimeOut = 'ontimeout' in this; 
      if (hasTimeOut) { 
       this.ontimeout = function() { 
        throw ('Error XMLHttpRequest timeout.'); 
       }; 
      } 
      return send.apply(this, arguments); 
     }; 
    })(XMLHttpRequest.prototype);

來源

2016-06-27 10:10:53 GibboK

如何爲XMLHttpRequest設置超時和ontimeout？

回答

相關問題