如何管理 AngularJS http 请求调用答案

【问题标题】：How to manage AngularJS http requests calls如何管理 AngularJS http 请求调用
【发布时间】：2017-07-14 09:01:46
【问题描述】：

我有一段代码发送一个双重 HTTP 请求。我想首先发出一个身份验证请求，如果为真，则执行下一条语句（它只返回一个 $http 承诺）。我怎样才能在 angularJS 中做到这一点。截至目前，它正在返回未定义。

dmdb._login_request = function(credentials, conf) {
    var p = {
        '_method': 'POST',
        'data[User][username]': credentials.login,
        'data[User][password]': credentials.password
    };
    conf.headers = {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
    };
    var userData = {
        'username': 'mbah',
        'password': 'abc@123',
        'applicationid': '1'
    };
    $http.post('myapp.com/authenticate/', userData, con).success(function(data) {
        if (data.success) {
            return $http.post(this.url + 'users/login', $.param(p), conf);
        }
        return $q.when('failed');
    })
};

【问题讨论】：

请复制并粘贴您的代码，而不是提供图片
@Houseman 刚刚做到了。请任何建议或提示将不胜感激。

标签： javascript jquery angularjs reactjs https

【解决方案1】：

使用承诺链依次调用请求。

function firstReq(userData, conf) {
    return $http({
        method: 'POST',
        url: 'myapp.com/authenticate/',
        headers: conf.headers,
        data: userData
    })
}

function secondReq(p, conf) {
    return $http({
        method: 'POST',
        url: this.url + 'users/login',
        headers: conf.headers,
        data: $.param(p)
    })
}
$scope.processform = function() {
    var userData = {
        'username': 'mbah',
        'password': 'abc@123',
        'applicationid': '1'
    };
    var p = {
        '_method': 'POST',
        'data[User][username]': credentials.login,
        'data[User][password]': credentials.password
    };
    conf.headers = {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
    };
    firstReq(userData, conf)
        .then(function(response) {
            console.log(response.data);
            return secondReq(p, conf);
        })
        .then(function(response) {
            console.log(response.data);
        })
}

【讨论】：

【解决方案2】：

我真的不明白你的问题是什么，但是，看起来你正试图从一个承诺的函数中返回一些东西。

我建议你编写以下代码：

   var userData={
        'username':'mbah',
        'password':'abc@123',
        'applicationid':'1'
    };

    var deferred = $q.defer();

    $http.post('myapp.com/authenticate/',userData,con).success(function(data){
            if(data.success){
                   $http.post(this.url+'users/login',$.param(p),conf).success(function(data2){
                        deferred.resolve(data2);
                   })
            }
            // I dont understand what this is for
            //turn $q.when('failed');
    })

  return deferred.promise;
};

这样你的函数会返回一个你可以使用的promise 你的目的。

如果对您没有帮助，请详细说明

【讨论】：

感谢您的帮助。但是，我想返回 $http.post(this.url+'users/login',$.param(p),conf) 而不是 data 。我有另一个通用方法可以做到这一点

【解决方案3】：

my_obj._login_request = function (credentials,conf) {


  var url_=this.url;

        var p = {
        '_method': 'POST',
        'data[User][username]': credentials.login,
        'data[User][password]': credentials.password
    };
    conf.headers = {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'};


    var userData={
    'username':'mbah',
    'password':'abc@123',
    'applicationid':'1'
};

var deferred = $q.defer();

$http.post('auth/path/UserLogin/Login',userData).success(function(data){
       console.log(data);
        if(!angular.isDefined(data.status)){

                    deferred.resolve($http.post(url_+'/users/login',$.param(p),conf));
        }
        else{
             deferred.reject();
        }
})

 return deferred.promise;

};

这是我的最终代码，它按预期工作。感谢大家的帮助

【讨论】：