angularjs $ http.post带参数

时间:2015-10-26 20:58:26

标签: javascript angularjs

我是棱角分明的新人,如果我的问题有点低,请不要生我的气。

我有web服务,如果用户将通过auth,则返回sessionId和登录成功消息。例如url就是:

  

http://localhost:8181/login?username=USERNAME&password=12345

以及我的回复:

{"sessionId":"0997cec2a8b34c84ba8419ab1204e6aa","loginSucceeded":true}

这是我的登录控制器:

app.controller('loginCtrl', function($scope, loginService){
    $scope.login=function(user){
        loginService.login(user);
    }
});

这是我的服务:

app.factory('loginService', function($http){
    return{
        login: function(user){
            var $promise=$http.post('http://localhost:8181/login?', user);
            $promise.then(function(msg){
                if(msg.loginSucceeded=="true")
                    console.log("opa")
                else
                    console.log("den");
            });
        }
    }
});

我的范围内有user.username和user.password(使用文本框)。

如何在url中传递这些参数?如何解析该响应?

2 个答案:

答案 0 :(得分:5)

在您的代码中,您将在POST请求的URL中传递用户名和密码。如果这是你真正想要的(将它们作为POST数据传递更常见),那么你可以使用它:

(?!\.\.)^\/UserFiles\/[/\w,\s-]+\.[A-Za-z]{3}$

如果要将数据作为POST数据传递,可以将其作为login: function(user){ var url = 'http://localhost:8181/login?username=' + user.name + '&password=' + user.password; $http.post(url).then(function(msg){ if(msg.loginSucceeded==="true"){ console.log("opa") }else{ console.log("den"); } }); } 调用中的第二个参数传递:

$http.post()

答案 1 :(得分:1)

我从未见过有人通过查询字符串传递登录数据, 如果你使用简单的http协议......你应该考虑使用Basic Access AuthenticationoAuth ...

顺便说一句,如果你需要做上面描述的事情......这可能对你有帮助!

angular
  .module('test', [])
  .service('LoginService', function($q, $http) {
    var self = this;
  
    self.login = function(username, password) {
      var configs = { cache: false };
      var payload = {
        "username" : username,
        "password" : password
      };
      
      // The Method Post is generally used with a payload, but if you need to pass it as query string... you have to do:
      configs.params = payload;
      return $http
        .post('/api/login', null /* but normally payload */, configs)
        .then(function(result) { 
          console.log('LoginService.login:success', result); 
          return result.data;
        })
        .catch(function(error) {
          console.log('LoginService.login:error', error);
          return $q.reject(error);
        });
      ;
    };
  })
  .controller('LoginCtrl', function(LoginService, $scope) {
    var vm = $scope
    vm.username = 'hitmands';
    vm.password = 'helloWorld';
    vm.debug = 'CIAO';
  
    vm.onFormSubmit = function(event, form) {
      if(form.$invalid) {
        event.preventDefault();
        return;
      }
      
      vm.debug = null;
      
      return LoginService
      .login(vm.username, vm.password)
      .then(function(data) { vm.debug = data; })
      .catch(function(error) { vm.debug = error; })
    ;
      
    };
  })
;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<article ng-app="test">
  <div ng-controller="LoginCtrl">
    <form ng-submit="onFormSubmit($event, loginForm);" name="loginForm">
      <input type="text" placeholder="username" ng-model="username">
      <input type="password" placeholder="Password" ng-model="password">
      <div>
        <button type="submit">Send Login Data</button>
      </div>
      
      <div style="color: blue; padding: 1em .5em;" ng-bind="debug | json">
      </div>
    </form>
  </div>
</article>