JWT刷新角度认证

Question

So I'm following the following Egghead.io guide: https://egghead.io/lessons/angularjs-finalizing-jwt-authentication-with-angularjs

With a twist, I am trying to incorporate a MongoDB to retrieve my users. I have everything working so far, except the last part where he states that the /me route should just return req.user and it should be fine on refreshes. I don't get that. What I do get is blank user returned from my server.

My server code is setup like this:

var jwtSecret = 'fjkdlsajfoew239053/3uk';

app.use(cors());
app.use(bodyParser.json());
app.use(expressJwt({ secret: jwtSecret }).unless({ path: [ '/login' ]}));
app.use(compression());
app.use(express.static(__dirname + '/client'));
app.get('/', function(req, res){
  res.render(__dirname + '/client/bundle.js');
});

app.get('/me', function (req, res) {
  res.send(req.user);
});

... setup for user schema and other boring stuff ...

  function authenticate(req, res, next) {
    var body = req.body;
    if (!body.username || !body.password) {
      res.status(400).end('Must provide username or password');
    }

    //do salting, hashing, etc here yo
    User.findOne({ username: body.username }, function(err, user){
      if (user === null || body.password !== user.password) {
        res.status(401).end('Username or password incorrect');
      }else{
        req.user = user;
        next();
      }
    });
  }

  // ROUTES
  app.post('/login', authenticate, function (req, res, next) {
    var token = jwt.sign({
      username: req.user.username
    }, jwtSecret);
    res.send({
      token: token,
      user: req.user
    });
  });

app.listen(process.env.PORT || 5000);

And my controller (Client-side) handling the basic authentication is:

module.exports = function($scope, $state, $modal, UserFactory) {
  var vm = this;

  $scope.$state = $state;
  $scope.sign_in = false;

  $scope.open =  function () {
    var $modalInstance = $modal.open({
      templateUrl: 'suggestion-modal.html',
      controller: 'modalCtrl'
    });
  };

  // initialization
  UserFactory.getUser().then(function success(response) {
    vm.user = response.data;
  });

  function login(username, password) {
    UserFactory.login(username, password).then(function success(response) {
      vm.user = response.data.user;
    }, handleError);
  }

  function logout() {
    UserFactory.logout();
    vm.user = null;
  }

  function handleError(response) {
    alert('Error: ' + response.data);
  }

  vm.login = login;
  vm.logout = logout;
};

Can anyone catch the bug I'm not seeing here? Basically I have a JWT on the client when I'm logged in but my initialization on the client controller is not recognizing that I'm logged in (it's not setting the user object to anything). It's kinda strange.

Answer 1

So my solution ended up taking into account Kent's help and a little brainstorming. It looked like the following. Note, apparently middleware ordering in express matters a lot since after changing when Express-jwt got loaded made a huge difference in whether or not the authentication headers were checked on initial directory load on the client (which if they were angular wouldn't load and the whole app broke). Cheers!

'use strict';
var faker = require('faker');
var cors = require('cors');
var bodyParser = require('body-parser');
var jwt = require('jsonwebtoken');
var expressJwt = require('express-jwt');
var compression = require('compression');
var express = require('express');
var bcrypt = require('bcrypt');
var connectLiveReload = require('connect-livereload');
var jwt = require('jsonwebtoken');
var app = express();

var jwtSecret = 'fjkdlsajfoew239053/3uk';

app.use(cors());
app.use(bodyParser.json());
app.use(compression());
app.use(express.static(__dirname + '/client'));
// app.get('/', function(req, res){
//   res.render(__dirname + '/client/bundle.js');
// });
app.use(expressJwt({ secret: jwtSecret }).unless({ path: ['/login']}));

app.get('/me', function (req, res) {
  res.send(req.user);
});


...schema stuff...

  // UTIL FUNCTIONS

  function authenticate(req, res, next) {
    var body = req.body;
    if (!body.username || !body.password) {
      res.status(400).end('Must provide username or password');
    }

    //do salting, hashing, etc here yo
    User.findOne({ username: body.username }, function(err, user){
      if (user === null || body.password !== user.password) {
        res.status(401).end('Username or password incorrect');
      }else{
        req.user = user;
        next();
      }
    });
  }

  // ROUTES
  app.post('/login', authenticate, function (req, res, next) {
    var token = jwt.sign({
      username: req.body.username
    }, jwtSecret);
    res.send({
      token: token,
      user: req.user
    });
  });

// app.use(connectLiveReload()); figure out whats wrong with this later and get livereload working

app.listen(process.env.PORT || 5000);