Cách đặt thời gian chờ http toàn cầu trong AngularJs

Question 1

Tôi biết tôi có thể đặt thời gian chờ mỗi và mọi lúc:

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

... nhưng tôi muốn đặt thời gian chờ toàn cầu để giữ cho mã của mình KHÔ.

Question 2

CẬP NHẬT : $ http sẽ không tôn trọng cài đặt mặc định cho thời gian chờ đặt nó trong httpProvider (xem nhận xét). Giải pháp khả thi: https://gist.github.com/adnan-i/5014277

Câu trả lời ban đầu:

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

Question 3

Điều này có thể thực hiện được với angle.js đang chảy máu (được thử nghiệm với git master 4ae46814ff).

Bạn có thể sử dụng trình chặn yêu cầu http. Như thế này.

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

Và sau đó trong .config tiêm $ httpProvider và thực hiện việc này:

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

Question 4

Cảm ơn cho bài đăng và cập nhật !!

Khi nghiên cứu vấn đề này một cách cụ thể $resource, tôi nghĩ rằng tôi đã giải thích kỹ càng những gì tôi đã tìm thấy:

Sự cố này đã được đăng nhập trong trình theo dõi và trong góc 1.1.5, có hỗ trợ chuyển thuộc tính thời gian chờ đến $httpyêu cầu:

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

Đối với những người trong chúng ta trên các phiên bản trước đó, cụ thể là tôi đang sử dụng angle 1.0.6, có thể chỉnh sửa tệp nguồn cho angle-resource.js trên dòng 396, bạn sẽ tìm thấy lệnh gọi đến $httpnơi bạn có thể tự thêm thuộc tính thời gian chờ cho tất cả yêu cầu tài nguyên.
Vì nó không được đề cập và tôi phải thử nghiệm giải pháp của Stewie, khi thời gian chờ xảy ra, cách để phân biệt giữa lỗi và hủy bỏ / thời gian chờ là kiểm tra đối số 'trạng thái'. Nó sẽ trả về 0cho thời gian chờ thay vì nói 404:
```
$http.get("/home", { timeout: 100 })
.error(function(data, status, headers, config){
        console.log(status)
    }
```

Vì chỉ có một số trường hợp tôi cần sử dụng thời gian chờ thay vì đặt nó trên toàn cầu, tôi đang gói các yêu cầu trong một $timeouthàm, như sau:

//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
}

Question 5

Tôi có cùng yêu cầu và tôi đang sử dụng AngularJS 1.0.7. Tôi đã nghĩ ra đoạn mã dưới đây vì không có giải pháp nào ở trên có vẻ khả thi đối với tôi (khả thi theo nghĩa tôi muốn thời gian chờ diễn ra trên toàn cầu tại một nơi). Về cơ bản, tôi đang che $ http phương pháp ban đầu và bổ sung timeoutcho mỗi $httpyêu cầu và trọng phương pháp tắt khác, như get, post, ... để họ sẽ sử dụng mới đeo mặt nạ $http.

JSFiddle cho mã bên dưới:

/**
 * @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;
        }]);

    }]);

})();

Thêm phụ thuộc vào mô-đun trên và định cấu hình thời gian chờ bằng cách định cấu hình ngx$httpTimeoutProvider, như bên dưới:

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)

} ]);