Como definir um tempo limite http global em AngularJs

Eu sei que posso definir um tempo limite de cada vez:

$http.get('path/to/service', {timeout: 5000}); 

… mas quero definir um tempo limite global para manter meu código DRY.

ATUALIZADO : $ http não respeitará a configuração padrão do tempo limite definido em httpProvider (veja os comentários). Solução possível: https://gist.github.com/adnan-i/5014277

Resposta original:

 angular.module('MyApp', []) .config(['$httpProvider', function($httpProvider) { $httpProvider.defaults.timeout = 5000; }]); 

Isso é possível com o angular.js de ponta (testado com o git master 4ae46814ff).

Você pode usar o interceptor HTTP de solicitação. Como isso.

  angular.module('yourapp') .factory('timeoutHttpIntercept', function ($rootScope, $q) { return { 'request': function(config) { config.timeout = 10000; return config; } }; }); 

E então em .config injetar $ httpProvider e fazer isso:

 $httpProvider.interceptors.push('timeoutHttpIntercept'); 

Obrigado pelo post e atualização !!

Ao pesquisar essa questão especificamente para $resource , pensei em elaborar o que encontrei:

  • Este problema foi registrado no rastreador e em 1.1.5 angular, há suporte para passar a propriedade de tempo limite para a solicitação $http :

https://github.com/angular/angular.js/issues/2190 http://code.angularjs.org/1.1.5/docs/api/ngResource.$resource

  • Para aqueles de nós em versões anteriores, especificamente eu estou usando 1.0.6 angular, é possível editar o arquivo de origem para angular-resource.js na linha 396 você encontrará a chamada para $http onde você pode adicionar a propriedade de timeout você mesmo para todas as solicitações de resources.

  • Como não foi mencionado e tive que testar a solução de Stewie, quando ocorre um tempo limite, a maneira de informar entre um erro e um aborto / tempo limite é verificar o argumento ‘status’. Ele retornará 0 para os tempos limite, em vez de 404 :

     $http.get("/home", { timeout: 100 }) .error(function(data, status, headers, config){ console.log(status) } 
  • Como há apenas alguns casos em que preciso usar um tempo limite em vez de defini-lo globalmente, estou agrupando as solicitações em uma function $timeout , assim:

     //errorHandler gets called wether it's a timeout or resource call fails var t = $timeout(errorHandler, 5000); myResource.$get( successHandler, errorHandler ) function successHandler(data){ $timeout.cancel(t); //do something with data... } function errorHandler(data){ //custom error handle code } 

Eu tenho o mesmo requisito e estou usando o AngularJS 1.0.7. Eu criei o código abaixo, já que nenhuma das soluções acima parece viável para mim (factível no sentido em que eu quero que o tempo limite seja global em um lugar). Basicamente, eu estou mascarando os methods $ http originais e adicionando timeout para cada requisição $http e sobrescrevendo outros methods de atalho, como get , post , … para que eles usem o novo mascarado $http .

JSFiddle para código abaixo:

 /** * @name ngx$httpTimeoutModule * @description Decorates AngularJS $http service to set timeout for each * Ajax request. * * Implementation notes: replace this with correct approach, once migrated to Angular 1.1.5+ * * @author Manikanta G */ ;(function () { 'use strict'; var ngx$httpTimeoutModule = angular.module('ngx$httpTimeoutModule', []); ngx$httpTimeoutModule.provider('ngx$httpTimeout', function () { var self = this; this.config = { timeout: 1000 // default - 1 sec, in millis }; this.$get = function () { return { config: self.config }; }; }); /** * AngularJS $http service decorator to add timeout */ ngx$httpTimeoutModule.config(['$provide', function($provide) { // configure $http provider to convert 'PUT', 'DELETE' methods to 'POST' requests $provide.decorator('$http', ['$delegate', 'ngx$httpTimeout', function($http, ngx$httpTimeout) { // create function which overrides $http function var _$http = $http; $http = function (config) { config.timeout = ngx$httpTimeout.config.timeout; return _$http(config); }; $http.pendingRequests = _$http.pendingRequests; $http.defaults = _$http.defaults; // code copied from angular.js $HttpProvider function createShortMethods('get', 'delete', 'head', 'jsonp'); createShortMethodsWithData('post', 'put'); function createShortMethods(names) { angular.forEach(arguments, function(name) { $http[name] = function(url, config) { return $http(angular.extend(config || {}, { method : name, url : url })); }; }); } function createShortMethodsWithData(name) { angular.forEach(arguments, function(name) { $http[name] = function(url, data, config) { return $http(angular.extend(config || {}, { method : name, url : url, data : data })); }; }); } return $http; }]); }]); })(); 

Acrescente dependência no módulo acima e configure o timeout configurando ngx$httpTimeoutProvider , como abaixo:

 angular.module('App', ['ngx$httpTimeoutModule']).config([ 'ngx$httpTimeoutProvider', function(ngx$httpTimeoutProvider) { // config timeout for $http requests ngx$httpTimeoutProvider.config.timeout = 300000; // 5min (5 min * 60 sec * 1000 millis) } ]);