我有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参数的位置是错误的。
不确定我做错了什么?
任何建议都会很棒