AngularJS check result of few $http get requests

Question

I'm using Angular 1.6.3

I need to make 3 get requests and finally check if at least one gives success response. Right now I have written this code:

         var result = new Array();
         $http.get("link1",
                {
                    "params": {
                        "email": user.email,
                    }
                }).then(function (successResult) {
                result[0] = false;
            }, function (errorResult) {
                result[0] = true;
            });
            $http.get("link2",
                {
                    "params": {
                        "email": user.email,
                    }
                }).then(function (successResult) {

                result[1] = false;

            }, function (errorResult) {

                result[1] = true;

            });
            $http.get("link3",
                {
                    "params": {
                        "email": user.email,
                    }
                }).then(function (successResult) {
                result[2] = false;
            }, function (errorResult) {
                result[2] = true;
            });
            if(result[0] || result[1] || result[2]){
                error();
            }

But sometimes one of GET requests returns -1 as Http status code when it should give 200. I know that all $http request are async and I think this is the main reason. What is the proper way to solve this issue?

I haven't done AngularJS for a while now, but why are you placing json after the link in the $http.get() ? — tholo
– tholo, Commented May 3, 2017 at 19:33
@tholo That's how you can add parameters like [email protected] — Loniks
– Loniks, Commented May 3, 2017 at 19:34
Oh yes, I forgot.. Make a setTimeout() in-between of the requests and that should be workaround. — tholo
– tholo, Commented May 3, 2017 at 19:36

Kalyan · Accepted Answer · 2017-05-03 20:19:46Z

2

Right way of doing this is to use $q.all

Use the following code.

var promise1 = $http.get("link1",
        {
            "params": {
                "email": user.email,
            }
        });
var promise2 = $http.get("link2",
        {
            "params": {
                "email": user.email,
            }
        });
var promise3 = $http.get("link3",
        {
            "params": {
                "email": user.email,
            }
        });

$q.all([
         promise1,
         promise2,
         promise3
       ]).then(function(data) 
       {

          // data[0] contains the response of the promise1 call
          // data[1] contains the promise2 response
          //  data[2] contains the promise3 response.
           $scope.variable = data;
       },
       function(errorData){

       });

edited May 3, 2017 at 20:19

answered May 3, 2017 at 19:57

Kalyan

1,2001 gold badge11 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Bhabani Das · Accepted Answer · 2017-05-03 19:38:24Z

1

you can use like this

var result = new Array();
 $http.get("link1",
        {
            "params": {
                "email": user.email,
            }
        }).then(function (successResult) {
        result[0] = false;
    }, function (errorResult) {
        result[0] = true;
    }).then($http.get("link2",
        {
            "params": {
                "email": user.email,
            }
        }).then(function (successResult) {

        result[1] = false;

    }, function (errorResult) {

        result[1] = true;

    })).then(
    $http.get("link3",
        {
            "params": {
                "email": user.email,
            }
        }).then(function (successResult) {
        result[2] = false;
    }, function (errorResult) {
        result[2] = true;
    }));

but here is a better way is to call with promise here is the link to the official site

https://docs.angularjs.org/api/ng/service/$http

answered May 3, 2017 at 19:38

Bhabani Das

3905 silver badges14 bronze badges

2 Comments

Kalyan Over a year ago

This will prevent the parallel run of all the three Ajax calls. The right way is to use $q.all. Check my solution below

Bhabani Das Over a year ago

But sometimes one of GET requests returns -1 as Http status code when it should give 200 . i thought from this line if one of the calls fails he doesn't want to move to the next call . But yes I agree if he wants a parallel call then $q.all is better approch.

AJ Funk · Accepted Answer · 2017-05-03 19:42:21Z

0

Due to the asynchronous nature of HTTP requests, you're going to be much better off using promises correctly. I recommend Promise.all() which can check the status of the responses once they have all arrived.

Alternatively, you could use a function to check each response as they arrive (rather than waiting for all promises to resolve).

For example:

checkResponse(res) {
  // logic here
}

$http.get('xxx').then(res => checkResponse(res))
$http.get('yyy').then(res => checkResponse(res))
$http.get('zzz').then(res => checkResponse(res))

answered May 3, 2017 at 19:42

AJ Funk

3,2071 gold badge18 silver badges18 bronze badges

Collectives™ on Stack Overflow

AngularJS check result of few $http get requests

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related