Setting up authentication session information using AngularJS and PassportJS features
I'm trying to set up a content management system using AngularJS client side and ExpressJS server side with PassportJS for authentication.
I currently have two client side service methods, one for login, and another that requires authentication to access (over-the-counter parts skipped):
client.js (client side)
app.controller('MainCtrl', function($rootScope, $scope, authenticator, gameService){
authenticator.signIn({username: 'admin', password: 'lynda'})
.success(function(data){
$rootScope.session = data; //not sure if this is needed
console.log(data);
});
$scope.post = function(){
gameService.createNewGame({"name": "Brand new game",
"description": "new",
"image": "image.png"})
.success(function(data){
console.log(data);
});
};
});
app.factory('authenticator', function($http, $cookies){
var signIn = function(userData){
if(userData){
return $http.post("/authenticate", userData);
}
};
return {
signIn: signIn,
};
});
app.factory('gameService', function($http){
return {
createNewGame: function(newGame){
return $http.post('/games', {data: newGame});
}
});
On the server side, I tried to set up passport authentication following the guides on the passport site. (For now, the authentication credentials are hard-coded):
app.js (server side)
var express = require('express');
var app = express();
var path = require('path');
var ObjectId = require('mongodb').ObjectID;
var bodyParser = require('body-parser');
var cookieParser = require('cookie-parser');
var session = require('express-session');
var passport = require('passport');
var LocalStrategy = require('passport-local').Strategy;
var db = require('mongoskin').db('mongodb://administrator:thePassword@localhost:27017/website');
//allow parsing of body messages
app.use(bodyParser.json()); // application/json
app.use(cookieParser());
app.use(bodyParser.urlencoded({extended: true})); // application/x-www-form-urlencoded
app.use(session({secret: 'Super top secret',
resave: true,
saveUninitialized: true}
));
app.use(passport.initialize());
app.use(passport.session());
passport.serializeUser(function(user, done){
done(null, user.username);
});
passport.deserializeUser(function(name, done){
done(null, {username: name});
});
passport.use(new LocalStrategy(
function(username, password, done){
if(username === 'admin' && password === 'lynda'){
return done(null, {username: 'admin'});
}
return done(null, false);
}
));
function isLoggedIn(req, res, next) {
console.log(req.isAuthenticated());
next();
}
app.post('/authenticate', passport.authenticate('local'),
function(req,res){
res.send("Authenticated successfully");
});
app.post('/games', isLoggedIn,
function(req,res){
console.log("You made it into the post");
db.collection('games').insert({
"name": req.body.name,
"description": req.body.description,
"image": req.body.image
},function(err,result){
if(err) throw err;
res.send(result);
});
});
app.use(express.static("public"));
app.use(function(req,res,next){
res.status(404).send("Sorry, can't find that!");
});
var server = app.listen(80, function(){
var host = server.address().address;
var port = server.address().port;
console.log("App listening at http://%s:%s", host, port);
});
When I start the server and run the client code. I get a response from the authentication endpoint saying I have "Authenticated Successfully". However, when I then click a button on my page to submit a request to "/ games /", the server code runs the "isLoggedIn" function and reports that req.isAuthenticated () is false.
What am I missing? I feel like I don't understand how to read the docs, how sessions are supposed to work with angular, and that perhaps I am missing some important configuration step.
source to share
No one has answered this question yet
Check out similar questions: