中止/取消/放弃angular js中的http请求并重试

Posted

技术标签:

【中文标题】中止/取消/放弃angular js中的http请求并重试【英文标题】:Abort/cancel/abandon a http request in angular js and retry it again 【发布时间】:2017-05-24 12:57:06 【问题描述】:

我正在开发一个应用程序,如果 过了一定时间,我必须停止收听请求,例如,如果在 60 秒内没有来自请求的响应,那么我必须 中止该请求,并且一次有多个请求正在进行。我不知道如何使用中止时间(60 秒) 来跟踪每个请求。我的意思是我怎么知道要中止哪个请求。

我想在我的 AngularJS 拦截器中实现这个功能。我尝试了许多声称可以实现此功能的博客和帖子,但没有任何帮助

这是我的拦截器代码

    $httpProvider.interceptors.push(['$cookies', '$rootScope', '$q', '$localStorage', '$sessionStorage','$timeout', function ($cookies, $rootScope, $q, $localStorage, $sessionStorage, $timeout) 
        return 
            'request': function (config) 
                config.headers = config.headers || ;
                if (typeof config.data !== 'object') 
                    config.headers['Content-Type'] = 'application/x-www-form-urlencoded';
                
                config.headers.Accept = 'application/json;odata=verbose';
                config.headers['X-Requested-With'] = 'XMLHttpRequest';
                var token = $localStorage.authToken || $sessionStorage.authToken;                    
                if (token) 
                    config.headers.Authorization = 'Bearer ' + token;
                

                return config;
            ,
            'responseError': function (response) 
                var status = response.status;
                var error = '';
                if(response.data.error) 
                    error = response.data.error;
                
                if(status === 401) 
                    $rootScope.unauthorizedLogout();
                 else if(status === 400 && (error === 'token_invalid' || error === 'token_not_provided')) 
                    $rootScope.unauthorizedLogout();
                 
                return $q.reject(response);
            
        ;
    ]); 

我确实尝试了$q.defer,它是取消请求的解决方法,但它并没有帮助我在应用程序中实现我想要的功能。

和平相处V

【问题讨论】:

这个答案对你有帮助吗? ***.com/a/17328336/3337164 是的,我试过了。 【参考方案1】:

您可以尝试为所有请求设置全局超时 $httpProvider.defaults.timeout ;

angular.module('test', [])
  .config(['$httpProvider', function($httpProvider) 
    $httpProvider.defaults.timeout = 60000;
]);

【讨论】:

谢谢,但我将如何再次重新发送该请求,但它也无法正常工作。尽管我确实尝试设置 config.timeout = 1000 并且它有效。似乎角度忽略了默认超时 您可以在拦截器的“responseError”函数中重新发送超时请求。 $timeout(function() /*重新发送请求*/, 1000); 好的,但是如何知道要再次发送哪个请求,因为在给定时间发生了多个请求。 好吧,我想我必须试试这个......希望它对我有用【参考方案2】:

This answer helped me a lot

为请求设置递增的超时值

    config.timeout = incrementalTimeout;

处理响应错误的拦截器应该如下所示

   'responseError': function (response) 
    var status = response.status;
    var error = '';
    //functionality to for request aborting and resending
    if (status === -1 || status >= 500) 
        if (attempts <= 3) 
            attempts += 1;
            return retryRequest(response.config);
        
     else 
        // set incrementalTiemout and attempts to default value   
        incrementalTimeout = 4000;
        attempts = 1;
    
    if(response.data.error) 
        error = response.data.error;
    
    if(status === 401) 
        $rootScope.unauthorizedLogout();
     else if(status === 400 && (error === 'token_invalid' || error === 'token_not_provided')) 
        $rootScope.unauthorizedLogout();
    
    return $q.reject(response);

在拦截器中重新发送请求的代码

        // default request timeout is of 4 seconds and attempt is 1
        var incrementalTimeout = 4000;
        var attempts = 1;
        function retryRequest (httpConfig) 
            var thisTimeout = incrementalTimeout;
            incrementalTimeout += 1000;
            return $timeout(function() 
                var $http = $injector.get('$http');
                return $http(httpConfig);
            , thisTimeout);
        

【讨论】:

以上是关于中止/取消/放弃angular js中的http请求并重试的主要内容,如果未能解决你的问题,请参考以下文章

如何放弃或取消 std::thread

Angular JS:IE 错误:达到 10 次 $digest() 迭代。中止

我们是不是需要取消订阅 Angular 中的 http 调用? [复制]

使用 Express/Node.js 和 Angular 处理取消的请求

React - 实现fetch取消、中止请求

如果已经使用相同的请求运行,则取消订阅/取消 Angular 4 中的现有 HTTP/XHR 调用