AngularJS - $rootScope.currentUser not being transferred from profile page to settings page

Question

I have a site with Angular/Express/Node/Passport that I am trying to put together. I am setting up angular to watch the $rootScope.currentUser variable, here is some code:

app.run(function ($rootScope, $location, Auth) {

    //watching the value of the currentUser variable.
    $rootScope.$watch('currentUser', function(currentUser) {
      // if no currentUser and on a page that requires authorization then try to update it
      // will trigger 401s if user does not have a valid session
      if (!currentUser && (['/', '/login', '/logout', '/signup'].indexOf($location.path()) == -1 )) {
        Auth.currentUser();
      }
    });

    // On catching 401 errors, redirect to the login page.
    $rootScope.$on('event:auth-loginRequired', function() {
      //console.log(currentUser);
      $location.path('/login');
      return false;
    });
  });

Using console messages, I have established that the $rootScope.currentUser is not available when I go from the profile page (after login) to the settings page (where you can change your password) - because when the currentUser is watched (above) - it does the Auth.currentUser() function - and gets rejected because $rootScope.currentUser is null.

Here is some more, possibly relevant, code:

Auth.js (where Auth.currentUser() is)

'use strict';

angular.module('groundup')
  .factory('Auth', function Auth($location, $rootScope, Session, User, $cookieStore) {
    $rootScope.currentUser = $cookieStore.get('user') || null;
    $cookieStore.remove('user');
    $rootScope.currentUserSignedIn;

    return {

      login: function(provider, user, callback) {
        var cb = callback || angular.noop;
        //console.log(user);
        Session.save({
          //provider: provider,
          username: user.username,
          password: user.password,
          //rememberMe: user.rememberMe
        }, function(user) {
          console.log(user);
          $rootScope.currentUser = user;
          $rootScope.currentUserSignedIn = true;
          console.log($rootScope.currentUser);
          $location.path('/profile');
          return cb();
        }, function(err) {
          console.log(err);
          return cb(err.data);
        });
      },

      logout: function(callback) {
        var cb = callback || angular.noop;
        Session.delete(function(res) {
            $rootScope.currentUser = null;
            $rootScope.currentUserSignedIn = false;
            console.log($rootScope.currentUser);
            return cb();
          },
          function(err) {
            return cb(err.data);
          });
      },

      createUser: function(userinfo, callback) {
        var cb = callback || angular.noop;
        console.log(userinfo);
        User.save(userinfo,
          function(user) {
            $rootScope.currentUser = user;
            $rootScope.currentUserSignedIn = true;
            console.log($rootScope.currentUser);
            $location.path('/profile');
            return cb();
          }
        );
      },

      currentUser: function() {
        Session.get(function(user) {
          console.log(user);
          $rootScope.currentUser = user;
        });
      },

      changePassword: function(oldPassword, newPassword, callback) {
        var cb = callback || angular.noop;

        return User.update({
          oldPassword: oldPassword,
          newPassword: newPassword
        }, function(user) {
          return cb(user);
          $location.path('/');
        }, function(err) {
          return cb(err);
        }).$promise;
      },

      removeUser: function(email, password, callback) {
        var cb = callback || angular.noop;
        User.delete({
          email: email,
          password: password
        }, function(user) {
            console.log(user + 'removed');
            return cb();
        }, function(err) {
            return cb(err.data);
        });
      }
    };
  })

After Auth.currentUser() it does a get request, which executes this function from the express side:

exports.session = function (req, res) {
  console.log(req.user.user_info + " in session function");
  res.json(req.user.user_info);
};

The problem is on the redirect to the /settings page - because $rootScope.currentUser is being watched, it auto redirects to /login because the Auth.currentUser() fails somewhere. Any help would be greatly appreciated - thanks (look at how $cookieStore is being used in Auth.js - I am not exactly sure how that is working).

Answer 1

There is something strange with your Auth.currentUser(), try to change it into something like this to use the User service

currentUser: function () {
    return User.get();
}

Your problem might also comes from a cookie storage problem, Passport tries to save the current user in it but fails somewhere (cause of trying access an undefined var or something) and stores in the cookie a corrupted / empty user. So the first page is loaded correctly, but when your app tries to access the cookie, it breaks.

I also advice you to look into the middleware.js file in the lib directory to see if there is no problem with the cookie saving, like if you want to get all the user object into it instead of just userInfo. In this case you will have to modify a little your session function to output the entire user.