Authorization interceptor with Infinity-scroll in AngularJS

Question

I'm using angular-http-auth for intercepting 401 response in order to display login dialogue and when the user is authorized, to retry failed request.

Since I'm using infinity-scroll I'm increasing an offset value, with every additional upload:

var upload = function () {
                 dataResource.query($scope.model).then(function (result) {
                     angular.forEach(result.items, function (value) {                            
                         $scope.items.push(value);
                     });                        
                 });
             }

$scope.uploadMore = function () {                    
                        $scope.model.Offset = $scope.model.Offset + 10;
                        upload();                                            
                    }; 
upload();

When my page loads up it immediately sends 2 request to server upload(), invoked from this directive, and uploadMore() by infinity-scroll .

However, after user has logged in, the page does not display the first 10 entries, instead it displays 11-20 items 2 times in a row .

When I tried to debug it, I noticed that when angular-http-auth retries requests it uses increased by 10 Offset value for both queries( $scope.module argument).

Functions upload() and uploadMore() are running for 2 times before angular-http-auth , so I guess that is why interceptor uses updated argument for both queries.

Could somebody please help me with this problem?

Answer 1

So you can resolve this problem prevent execute request until previous will finish. The faster way to do that is :

var pending = false;
var upload = function () {
            if(!pending) {
             pending = true;
             dataResource.query($scope.model).then(function (result) {
                 pending = false;
                 angular.forEach(result.items, function (value) {                            
                     $scope.items.push(value);
                 });                        
             });
            }
         }