在Angular中阻止多个$ http请求有没有更好的办法?

【字号: 日期:2024-04-12浏览:18作者:雯心
(adsbygoogle = window.adsbygoogle || []).push({}); 如何解决在Angular中阻止多个$ http请求有没有更好的办法??

首先,我认为没有必要将其包装HttpPromise到另一个承诺中。在不赞成使用success/error方法的情况下,您应该仅依靠该方法,并将当作常规承诺。then()``HttpPromise

为了确保只发送一次请求,您实际上可以跟踪HttpPromise创建的第一个请求,并在随后的函数调用中返回相同的promise。

这是一项服务,它将接受API端点作为参数,并确保仅向该API发送一个请求。

app.factory(’$httpOnce’, [ ’$http’, ’$cacheFactory’, function ($http, $cacheFactory) { var cache = $cacheFactory(’$httpOnce’); return function $httpOnce(url, options) { return cache.get(url) || cache.put(url, $http.get(url, options).then(function (response) { return response.data;})); }; }]);

function log(data) { console.log(data);}// issues an HTTP request$httpOnce(’https://api.github.com/’).then(log);// does not issue an HTTP request, returns the same promise as above$httpOnce(’https://api.github.com/’).then(log);// ...// HTTP request completes somewhere, both promises above are resolved// ...setTimeout(function () { // immediately resolved $httpOnce(’https://api.github.com/’).then(log);}, 5000);

这是一个演示。您可以在开发工具中看到仅发出一个请求。

解决方法

我已经构建了一种通过$ http返回资源的复杂方法。

该方法返回一个Promise,然后检查资源是否存在我的本地缓存。如果这样做,它将返回缓存的资源,否则,将发出$http请求。在资源被缓存后,这种方法效果很好,但是在整个应用程序中,我有多种功能正在按此方法加载,并且每个函数都会发出http请求,因为资源尚未返回和缓存。

我想出了一个简单的检查方法来解决此问题,但我觉得应该有一个更好的方法。我添加了一个布尔值,如果该方法处于获取资源的中间,则将其设置为true;如果是,则使用半秒超时来解析该方法,以给请求时间来解决。代码如下。

那么,有没有更好的方法?

var schools = []; var loadingSchools = false; function getAllSchools(forceUpdate) {return $q(function (resolve,reject) { if(loadingSchools) resolve($timeout(getAllSchools,500)); else{loadingSchools = true;if (schools.length && !forceUpdate) { loadingSchools = false; resolve(schools); return;}console.log(’$http: Getting All Schools - schoolService.js’);$http.get(API_PATH + ’schools_GetAll’,{cache:true}).success(function(result) { schools = result; loadingSchools = false; resolve(schools);}).error(function(error) { schools = []; loadingSchools = false; reject(error);}); }}); }

相关文章: