Cancel a GET request to the server using Restangular

Question

I created a UserService as follows:

angular.module('nrApp').factory('userService', ['Restangular', 'UserModel', 'DSCacheFactory', function (Restangular, UserModel, DSCacheFactory) { // Create a new cache called "profileCache" var userCache = DSCacheFactory('userCache', { maxAge: 3600000, deleteOnExpire: 'aggressive', storageMode: 'localStorage', // This cache will sync itself with `localStorage`. onExpire: function (key, value) { Restangular.oneUrl('users', key).get().then(function(data) { userCache.put(key, data); }); } }); Restangular.extendModel('users', function(obj) { return UserModel.mixInto(obj); }); Restangular.addRequestInterceptor(function(element, operation, what, url) { if(operation === 'get') { debugger; //Check the cache to see if the resource is already cached var data = userCache.get(url); //If cache object does exist, return it if(data !== undefined) { angular.extend(element, data); } return element; } }); Restangular.addResponseInterceptor(function(data, operation, what, url, response) { //Cache the response from a get method if(operation === 'get') { debugger; userCache.put(url, data); } //Unvalidate the cache when a 'put', 'post' and 'delete' is performed to update the cached version. if (operation === 'put' || operation === 'post' || operation === 'delete') { userCache.destroy(); } return response; }); return Restangular.service('users'); }]); 

From the comments, it’s clear that what I'm trying to achieve is whenever the Get request is executed through this service using Restangular, the local cache is checked, and if the cache returns an object, it expands into a restatular element. The thread that needs to be reached is to cancel a segment request when a cache object is found for this request.

However, without luck, the addResponseInterceptor method is still executing, although the object was found in the cache.

Are there any possible solutions for canceling a server request during a get request?

Thanks!:)

Answer 1

One way to do this is to cancel it through httpConfig. Restangular provides the httpConfig object as a parameter in the addFullRequestInterceptor method. You can use this as in the following:

 RestangularProvider.addFullRequestInterceptor(function(element, operation, what, url, headers, params, httpConfig ) { ... if found in cache { var defer = $q.defer(); httpConfig.timeOut = defer.promise; defer.resolve(); } ... } 

Hope this helps.

Answer 2

I solved the specific problem of returning cached data if it is accessible through an instance of angular -cache CacheFactory by simply changing the httpConfig settings in RequestInterceptor. An example shown below:

 angular.module('App') .factory('Countries', function (Restangular, CacheFactory, $q) { var countryCache; var countryService; // Check to make sure the cache doesn't already exist if (!CacheFactory.get('countryCache')) { countryCache = CacheFactory('countryCache', { maxAge: 60 * 60 * 1000 }); } if (!countryService) { countryService = Restangular.service('countries'); Restangular.addFullRequestInterceptor(function(element, operation, what, url, headers, params, httpConfig) { if (what === 'countries') { switch (operation) { case 'getList': httpConfig.cache = countryCache; break; default: break; } } return { element: element, headers: headers, params: params, httpConfig: httpConfig }; }); } return countryService; }); 

Answer 3

You can decorate $ http to prevent multiple requests to the same URL. Regular use of $ http, no need to add fullRequestIntercepter to cancel the request, because it prevents the request before sending.

  $provide.decorator('$http', function ($delegate, $cacheFactory, $rootScope) { var $http = $delegate; var customCache = $cacheFactory('customCache'); var wrapper = function () { var key = arguments[0].url; var requestPromise = customCache.get(key); if (!requestPromise){ $rootScope.requestCount++; requestPromise = $http.apply($http, arguments); requestPromise.then(function(){ customCache.remove(key); }); customCache.put(key, requestPromise) } return requestPromise; }; Object.keys($http).filter(function (key) { return (typeof $http[key] === 'function'); }).forEach(function (key) { wrapper[key] = function () { return $http[key].apply($http, arguments); }; }); return wrapper; }); 

Example here