取消HTTP请求并解决角度中的错误函数

时间:2015-08-27 07:06:11

标签: javascript angularjs http promise angular-promise

嗨我想在2s后取消我的http请求。如果没有收到数据,它应解析为错误函数并返回一个空对象。

我知道我不得不使用timeout属性。我在哪里准确使用$ timeout?如果我理解正确,我不太确定。

app
  .service('testService',['$http','$q','$timeout',
    function($http,$q,$timeout){

      var canceler=$q.defer();

      this.options = function (long,lat) {


        return $http({
          method: 'POST',
          url: '/coordinates',
          headers: {
            'Content-Type' : 'application/json; charset=utf-8',
            'Data-Type': 'json'
          },
          data: {
            "long":long,
            "lat": lat
          },
          timeout:canceler.promise

        }).then(function (response) {
          return response.data;
        },function(error){
          return {};
        });
      };
    }]);

2 个答案:

答案 0 :(得分:1)

在$ timeout中使用reject作为

$timeout(function(){
    return canceler.reject(reason);
},2000);

因此,您$http请求如下:

var timeoutCase = function(){
    $timeout(function(){
        return canceler.reject(reason);
    },2000);
}

var apiCall = function(){

   // call timeout function
   timeoutCase();

   // http call
   return $http({
      method: 'POST',
      url: '/coordinates',
      headers: {
        'Content-Type' : 'application/json; charset=utf-8',
        'Data-Type': 'json'
      },
      data: {
        "long":long,
        "lat": lat
      },
      timeout:canceler.promise

    }).then(function (response) {
$timeout.cancel(timeoutCase);
      return response.data;
    },function(error){
      return {};
    });
}

// call Http function.
api().then(function(response){
    console.log(response);
})

答案 1 :(得分:1)

您可以将配置对象传递给您正在使用的方法(在您的方案POST中):

post(url, data, [config]);

在config对象中,您可以指定超时属性:

  

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

因此,POST方法调用的示例将是:

$http.post('www.host.com/api/resource', {payload}, {timeout:2000})
          .then(function(){ //success });
          .catch(function(){ return {};});

return {};只是为了模拟你提到的空对象。

在角度文档网站上有一些使用$http服务

的好例子

另一方面,$timeoutwindow.setTimeout的Angular包装器,这里是documentation的链接。

因此,您可以使用$ timeout来触发解决您的取消承诺,或者只是让超时属性在执行请求时执行它的工作。这取决于您的要求。但我的建议是对您正在执行的请求使用timeout属性。无需通过外部计时器取消请求。