使用AngularJS,Express.js和PassportJS时的身份验证

时间:2014-10-03 10:32:52

标签: angularjs node.js authentication express passport.js

我有AngularJS for front - Node.js(Express.js)用于服务器端Web应用程序,但无法获得身份验证。

这是登录页面网址。

http://localhost:3000/#/extra-signin

填写电子邮件和密码后,按下登录按钮。但仍然显示相同的页面。

按下登录按钮后的URL如下所示。

http://localhost:3000/?email=test%40test.com&password=test#/extra-signin

我希望Angular控制器可以通过post方法帮助将登录数据发布到服务器,但Angular控制器似乎无法正常工作。似乎让方法有效。

角度控制器:

App.controller('ExtraSigninController', function($scope, $routeParams, $http, $location, $rootScope, $alert, $window) {
    $scope.login = function() {
        $http.post('/auth/login',$scope.user)
        .success(function(data) {
            $window.localStorage.token = data.token;
            var payload = JSON.parse($window.atob(data.token.split('.')[1]));
            $rootScope.currentUser = payload.user;
            $location.path('/');
            $alert({
                title: 'Cheers!',
                content: 'You have successfully logged in.',
                animation: 'fadeZoomFadeDown',
                type: 'material',
                duration: 3
            });
        })
        .error(function() {
            delete $window.localStorage.token;
            $alert({
                title: 'Error!',
                content: 'Invalid username or password.',
                animation: 'fadeZoomFadeDown',
                type: 'material',
                duration: 3
            });
        });
    }
}

Angular config:

App.config(function($routeProvider, $locationProvider) {
    $routeProvider        
    .when('/extra-signup', {
        templateUrl: 'templates/states/extra-signup.html',
        controller: 'ExtraSignupController'
    })
    .when ....
    .when ....
    .otherwise({
        redirectTo: '/'
    });
});

HTML登录页面:

<div id="signin-page">
  <div class="page-form-wrapper"></div>
  <div class="page-form">

      <div class="header-content">
        <h1>login</h1>
      </div>
      <div class="body-content">
        <p>login:</p>
        <div class="row mbm text-center">
          <div class="col-md-4"><a href="/auth/twitter" target="_self" class="btn btn-sm btn-twitter btn-block"><i class="fa fa-twitter fa-fw"></i>Twitter</a></div>
          <div class="col-md-4"><a href="/auth/facebook" target="_self" class="btn btn-sm btn-facebook btn-block"><i class="fa fa-facebook fa-fw"></i>Facebook</a></div>
          <div class="col-md-4"><a href="/auth/google" target="_self" class="btn btn-sm btn-google-plus btn-block"><i class="fa fa-google-plus fa-fw"></i>Google +</a></div>
        </div>
        <form class="form">
        <div class="form-group">
          <div class="input-icon right"><i class="fa fa-user"></i>
            <input type="text" placeholder="Email" name="email" ng-model="user.email" class="form-control input-lg" required autofocus/>
          </div>
        </div>
        <div class="form-group">
          <div class="input-icon right"><i class="fa fa-key"></i>
            <input type="password" placeholder="password" name="password" mg-model="user.password" class="form-control input-lg" required/>
          </div>
        </div>
        <div class="form-group pull-right">
          <input type="submit" class="btn btn-success" ng-click="login()" value="login">
        </div>
        </form>
      </div>
  </div>
</div>

这是服务器端代码:

app.post('/users/session', passport.authenticate('local'));

//passport local strategy
passport.use(new LocalStrategy({
    usernameField: 'email',
    passwordField: 'password'
  },
  function(email, password, done) {
    db.User.find({ where: { email: email }}).success(function(user) {
      if (!user) {
        // done(null, false, { message: 'Unknown user' });
        res.send(401, 'User does not exist');
      } else if (!user.authenticate(password)) {
        // done(null, false, { message: 'Invalid password'});
        res.send(401, 'Invalid email and/or password');
      } else {
        logger.debug('Login (local) : { id: ' + user.id + ', username: ' + user.username + ' }');
        // done(null, user);
        var token = createJwtToken(user);
        res.send({ token: token });
      }
    }).error(function(err){
      done(err);
    });
  }
));

我不知道为什么Angular Controller的post方法不起作用。我不明白为什么返回的网址是这样的。 get参数的位置是错误的。

不确定我做错了什么?

任何建议都会很棒

0 个答案:

没有答案