AngularJS:超时承诺调用

时间:2015-04-15 12:58:44

标签: javascript ajax angularjs timeout promise

在我的AjaxPromiseService.js工厂中,我一直在尝试将一种超时机制纳入承诺调用(通常是 $ 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()将返回有用的标志,这样我就可以让AJAX调用正常失败。 timeoutPromise()getDummyData()最终都会按顺序解析,但是,如果首先重新解析timeoutPromise(),我希望取消 getDummyData()。我想知道怎么做?

3 个答案:

答案 0 :(得分:2)

$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

答案 1 :(得分:1)

如果您使用的是$ http,则有一个更简单的选项。使用$ http配置对象的超时属性和$ timeout service:

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

当请求在超时期限内成功时,$ timeout将自动中止。

答案 2 :(得分:1)

根据 $http documentation $ http配置timeout属性接受承诺,以毫秒为单位的数字

  

timeout - {number|Promise} - 超时(以毫秒为单位),或承诺在解决时应中止请求。

因此解决方案很简单:

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