3

我需要防止在前一个请求给出响应之前重复向 API 发送相同的请求。我找到了一些解决方案。但是，我不想在等待响应时禁用该按钮，因为我的应用中有更多 API 调用。

我真的需要在我的 $provider .config() 中做点什么。我在这里找到了一种方法（http://blog.codebrag.com/post/57412530001/preventing-duplicated-requests-in-angularjs）。

但我需要更多澄清代码。欢迎任何关于此的参考。

4

4 回答 4

2

假设您$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
           })
       }
    }

}());
于 2015-12-17T08:58:58.490 回答
1

我想补充@VikasChauhan 的回答，但是我没有足够的声誉来评论他的回答。

他的代码对我很有用，除了他返回 null 的部分。这会导致 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;
        }
    };
}
]);

希望这对其他人有所帮助。

于 2017-10-10T15:18:52.800 回答
0

您可以创建一个函数来取消第一个 http 请求，在单击按钮时调用另一个请求。这是一个使用 $q.defer() 函数的参考，它帮助我解决了类似的问题： http: //odetocode.com/blogs/scott/archive/2014/04/24/canceling-http-requests-in-angularjs .aspx

于 2015-12-17T09:05:37.900 回答
0

在我的项目中，我遇到了这个问题。我在这里找到了一个非常有用的工作解决方案

并在配置中实现它：

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;
            }
        }
    }
    ]);
}
于 2017-04-17T10:39:07.440 回答