AngularJS: 超时承诺调用

Question

在我的 AjaxPromiseService.js 工厂中，我一直在尝试将超时机制合并到 promise 调用中（通常是 $http.get/post 对远程服务的调用).我目前正在做的是在 $timeout 事件和实际的承诺调用之间创建一个竞赛。示例代码如下（代码来自我在 AngularJS 中的 AjaxPromiseService.js 工厂）： also available in this plnkr

var timeoutObj = {"isTimeout": true};

function timeoutPromise(deferredObj) {
      $timeout(function() {
        console.log("promise timeout");
        deferredObj.resolve(timeoutObj);
        }, timeoutLimit); // timeoutLimit is in milisecond
    }

//promise calls (e.g. $http.get())
function getDummyData(milisec) {
      var data = {"data" : "dummy data from ajax!"};
      var deferred = $q.defer();

      timeoutPromise(deferred); //start the race to see who resolves first

      //use $timeout to mimick an AJAX call
      $timeout(function() {
        deferred.resolve(data);
        $timeout.cancel(timeoutPromise(deferred)); //not working, how to cancel the race here?
      }, milisec); //

      return deferred.promise;

    } //getDummyData

这似乎有效，如果 getDummyData() 在指定的持续时间内没有解决，timeoutPromise() 将 return 有用的标志，这样我就可以让 AJAX 调用失败优雅地。 timeoutPromise() 和 getDummyData() 最终都会按顺序解决，但是，如果 getDummyData() 被解决，我想取消 timeoutPromise()第一的。我想知道如何做到这一点？

Answer 1

$http 有一个 timeout 参数，当一个承诺被解决时它会超时请求 - 所以，你可以给它一个 $timeout 承诺：

getData: function(input, timeout){
  var timeoutPromise = timeout ? $timeout(function(){}, timeout) : null;

  return $http({url: "/some/url",
                timeout: timeoutPromise,
                method: "GET"
               }).then(function(response){
                  var data = response.data;
                  // do something with data, if needed
                  return data;
               });
}

DEMO

Answer 2

如果您使用 $http，则有一个更简单的选项。使用 $http 配置对象的超时属性，以及 $timeout 服务：

var requestTimeout = $timeout(function() {}, 4000);
$http({ method:'GET', url:'...', timeout: requestTimeout});
requestTimeout.then(function() {
   console.log ('request aborted - timed out!');
});

在超时时间内请求成功，$timeout会自动中止。

Answer 3

根据$http documentation，$http配置的timeout属性接受要么是一个承诺，要么是 一个以毫秒为单位的数字:

timeout – {number|Promise} – timeout in milliseconds, or promise that should abort the request when resolved.

因此解决方案很简单：

function getData () {
    return $http.get(someUrl, {timeout: 3000});  // adjust the value to what you need
}

AngularJS: 超时承诺调用

AngularJS: timeout promise calls

javascript

ajax

timeout

promise

angularjs