как предотвратить дублирование запросов $http в приложении AngularJS?

Допустим, у вас есть $http в вашем файле controller.js.

Много запросов к серверу

$http.get('/link/to/file.php');

Всего один запрос к серверу, независимо от того, сколько раз вы будете вызывать этот метод:

$http.get('/link/to/file.php', {cache: true});

Пример:

(function() {
    'use strict';

    angular
            .module('yourModuleName')
            .controller('DashboardCtrl', DashboardCtrl);

    DashboardCtrl.$inject = ['$scope'];

    function DashboardCtrl($scope) {

       $scope.get = function () {
           $http.get('/link/to/file.php', {cache: true}).then(function(response) {
               // it will do GET request just once
               // later you will get the same response from cacheFactory
           })
       }
    }

}());

Я хотел бы дополнить ответ @VikasChauhan, однако у меня недостаточно репутации, чтобы прокомментировать его ответ.

Его код отлично работает для меня, за исключением той части, где он возвращает ноль. Это приводит к тому, что Angular постоянно выдает кучу ошибок.

Вместо null я просто отклоняю запрос:

return $q.reject(request);

Вот моя функция:

$httpProvider.interceptors.push(['$injector', '$q', function interceptors($injector, $q) {
    return {
        // preventing duplicate requests
        request: function request(config) {
            var $http = $injector.get('$http');
            var _config = angular.copy(config);
            delete _config.headers;

            function isConfigEqual(pendingRequestConfig) {
                var _pendingRequestConfig = angular.copy(pendingRequestConfig);
                delete _pendingRequestConfig.headers;

                return angular.equals(_config, _pendingRequestConfig);
            }

            if ($http.pendingRequests.some(isConfigEqual)) {
                return $q.reject(request);
            }

            return config;
        }
    };
}
]);

Надеюсь, это поможет другим людям.

Вы можете создать функцию для отмены первого http-запроса при вызове другого при нажатии кнопки. Вот ссылка, которая использует функцию $q.defer(), которая помогла мне в аналогичной проблеме: http://odetocode.com/blogs/scott/archive/2014/04/24/canceling-http-request-in-angularjs.aspx

В моем проекте я столкнулся с этой проблемой. Я нашел очень полезное рабочее решение здесь

И реализовал это внутри конфига:

function config($routeProvider, $httpProvider) {

    $httpProvider.interceptors.push(['$injector', function interceptors($injector) {
        // Manually injecting dependencies to avoid circular dependency problem
        return {
            // preventing duplicate requests
            'request': function request(config) {
                var $http = $injector.get('$http'),
                copiedConfig = angular.copy(config);

                delete copiedConfig.headers;
                function configsAreEqual(pendingRequestConfig) {
                    var copiedPendingRequestConfig = angular.copy(pendingRequestConfig);

                    delete copiedPendingRequestConfig.headers;

                    return angular.equals(copiedConfig, copiedPendingRequestConfig);
                }

                if ($http.pendingRequests.some(configsAreEqual)) {
                    debugger;
                    return null;
                }

                return config;
            }
        }
    }
    ]);
}