我需要防止重複向API發送相同的請求,之前的請求會給出響應。我找到了一些解決方案。但是,我不想在等待響應時禁用按鈕,因爲我的應用程序中有更多的API調用。
我真的需要在我的$ provider .config()中做一些事情。我在這裏找到了一種方法(http://blog.codebrag.com/post/57412530001/preventing-duplicated-requests-in-angularjs)。
但我需要更多的澄清代碼。任何有關這方面的參考都是值得歡迎的。
我需要防止重複向API發送相同的請求,之前的請求會給出響應。我找到了一些解決方案。但是,我不想在等待響應時禁用按鈕,因爲我的應用程序中有更多的API調用。
我真的需要在我的$ provider .config()中做一些事情。我在這裏找到了一種方法(http://blog.codebrag.com/post/57412530001/preventing-duplicated-requests-in-angularjs)。
但我需要更多的澄清代碼。任何有關這方面的參考都是值得歡迎的。
假設您的controller.js
文件中有$http
。
很多請求,服務器
$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
})
}
}
}());
您錯過了OP在「先前的請求將給出響應之前」寫入的部分。您的解決方案僅在第一個響應返回後才起作用。 – AsGoodAsItGets
你可以創建一個函數來取消第一個http請求,當點擊按鈕時調用另一個。 下面是一個使用$ q.defer()函數,幫助我在一個類似問題的參考: http://odetocode.com/blogs/scott/archive/2014/04/24/canceling-http-requests-in-angularjs.aspx
但是請求仍然會發送到服務器。除非您在已經被拒絕的超時時間內調用'$ http'。 – ste2425
你是對的@ ste2425,我把我的http請求放入'timeout:canceler.promise'中,當我想要結束請求時,我只運行'canceler.resolve();'。 我不確定這是否是最好的解決方案,但它對我有用。 –
在我的項目,我正面臨着這個問題。我發現了一個非常有用的工作液here
並實現了它的配置裏面:
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;
}
}
}
]);
}
我試過這個,我的併發請求得到null的結果。我如何返回其他重複請求的回覆?意思是說,如果我有兩個對端點的調用而一個被取消,我們可以返回前一個請求的結果嗎?謝謝。 – matsientst
我想補充@VikasChauhan的答案,但我沒有足夠的聲譽對他的回答進行評論。
他的代碼對我很好,除了他返回空的部分。這導致Angular全面拋出一堆錯誤。
而不是空的,我只是拒絕請求:
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;
}
};
}
]);
希望這有助於其他人。
如果你改變的部分工作,我很驚訝,因爲'request'不是你調用'$ q.reject(request)'的代碼塊中的有效變量/對象。 – AsGoodAsItGets
要求準備好使用代碼或教程是無關緊要的。如果你有一些你不明白的代碼,那麼發佈代碼,並告訴你什麼不明白。 –
*「但我需要更多澄清代碼實施..」 - - 請引用您需要澄清的部分。正因爲如此,這個問題需要尋求異地資源,或者準備好使用在此處無關緊要的代碼。順便說一句,我發現「謝謝」後的問號很有趣。 –
需要與實施教程 – user3391137