sessionStorage data not persist in AngularJS app with ngStorage

Question

All,

I'm simply trying to store a user object in sessionStorage in an AngularJS app. If I step through this in either the Chrome or FF debugger, the sessionStorage never gets set. Here is my angular service code:

// Authentication/authorization Module
stonewall.authModule = angular.module("authModule", [
    // Module dependencies
    "ngStorage"
    ]);

// Authentication/authorization service tracks the current user
stonewall.authModule.service('authService', function ($localStorage, $sessionStorage) {

    // Initialize current user
    var currentUser = {};
    restoreSession();

    // Declare storage type-this may change if user selects
    // "Keep me signed in"
    var storageType = {};

    // Return the current user object
    this.getCurrentUser = function () {
        return currentUser;
    };
    // Returns whether there is a currently authorized user
    this.userAuth = function() {
        return currentUser.sid != "";
    };
    // Logout function, initializes the user object
    this.logout = function() {
        currentUser = {
            sid: "",
            status: 0,
            pswLastSet: 0,
            id: "",
            sigUID: "",
            sig: ""
        };
        //persistSession();
    };
    // Login
    this.login = function(user, subj) {
        if (user == null) return;
        currentUser = {
            sid: user.Principal.SId,
            status: user.Principal.ControlStatus,
            pswLastSet: new Date(user.Principal.PasswordLastSet),
            id: user.Identity.Id.DN,
            sigUID: user.Identity.Certificates[0].UID,
            sig: stonewall.hash(user.Principal.SId + subj.pswd),
        };
        persistSession();
    };
    // Persist to session storage
    function persistSession() {
        $sessionStorage.currentUser = currentUser;
    };
    // Restore session
    function restoreSession() {
        currentUser = $sessionStorage.currentUser;
        if (currentUser == null) {
            // Initialize to empty user
            currentUser = {
                sid: "",
                status: 0,
                pswLastSet: 0,
                id: "",
                sigUID: "",
                sig: ""
            };
        }
    };
});

And, here is a screencap that shows my FF debugging session. You can see that after persistSession is called that $sessionStorage has my user.

But, if I switch over to the DOM inspector, sessionStorage has no items in it...

Any help is, as always, appreciated.

Answer 1

Are you sure you are using angular's sessionStorage in the right way? Session storage is a property of the $window object in angular, so I don't know if you have made your own service wrapper or something like that? Anyway, here is a codepen that shows another approach that I use myself, using $window.sessionStorage instead: http://codepen.io/chrisenytc/pen/gyGcx