Question

我正在尝试将经过身份验证的用户保存到服务本地的变量，但在第二次访问时无法看到相同的值。这是代码，

app.factory('Auth', ['$http', '$state',
function ($http, $state) {
    var currentUser = null;
    var authenticated = false;

    var setCurrentUser = function (user, flag) {
        currentUser = {};
        angular.extend(currentUser, user);
        authenticated = flag;
    };

    var getAuthenticated = function () {
        return authenticated;
    };

    var getCurrentUser = function () {
        return currentUser;
    };

    return {
        login: function (user, success, error) {
            $http.post(UserApi.login().url, user).success(function (user) {
                setCurrentUser(user, true);
                window.location.replace('/');
            }).error(error);
        },
        logout: function (success, error) {
            $http.post(UserApi.logout().url).success(function () {
                setCurrentUser(null, false);
                window.location.replace('/');
            }).error(error);
        },
        isAuthenticated: function () {
            if (getAuthenticated() && getCurrentUser() != null) return true;
            return false;
        }
    };
}]);

我希望在登录到currentUser并将状态设置为authenticated后存储用户详细信息，当我尝试检查用户登录的状态时，这两个变量持有null和false，因此我失去了用户状态。因此，如何正确存储和检索数据，以确保用户登录状态。

Answer 1

如评论中所述，Angular服务是在页面上内存中运行的JavaScript应用程序的一部分，因此只要刷新页面，该服务就会被重建。您必须选择一个持久性方案并使用其API，以便在页面加载中保留任何内容。

您有几个选择：

sessionStorage：在您关闭浏览器窗口之前保持不变，但可以在页面之间使用。但是，打开到同一URL的新选项卡将获得一个新的空会话存储对象。这是一个很好的选择，仅用于跨页面刷新传输数据。
localStorage：在同一个域中的Windows /标签之间保留，下次打开浏览器时它仍然存在。
$ cookieStore：一个基于cookie的Angular包装器，类似于sessionStorage，除了小得多，并包含在对服务器发出的任何请求中。
Many more esoteric choices并非所有浏览器都支持。该文章也是对网络存储选择的一个很好的概述。

实际上这与Angular几乎没什么关系，只是一个JavaScript持久性问题。

以下是使用localStorage帮助您入门的代码的一个小示例：

var data = angular.fromJson(localStorage['my-storage-key']) || {
    currentUser: null,
    authenticated: false
};

var save = function () {
    localStorage['my-storage-key'] = angular.toJson(data);
};

var setCurrentUser = function (user, flag) {
    data.currentUser = {};
    angular.extend(data.currentUser, user);
    data.authenticated = flag;
    save();
};

var getAuthenticated = function () {
    return data.authenticated;
};

var getCurrentUser = function () {
    return data.currentUser;
};

AngularJs服务，无法在本地存储

1 个答案: