将数据保存在 DOM

Question

我在 Firebase 应用程序中工作，我需要在 DOM 中保留一些数据，一旦用户登录，您就可以看到用户名和电子邮件，但是一旦刷新页面，用户仍处于登录状态，但该数据从 DOM.

中消失

  <div class="item">
    {{::userDisplayInfo.name}}
  </div>
  <div class="item">
    {{::userDisplayInfo.email}}
  </div>

这里是 JS

  $scope.signIn = function (user) {
      auth.$authWithPassword({
        email: user.email,
        password: user.pwdForLogin
      }).then(function (authData) {
        ref.child("users").child(authData.uid).once('value', function (snapshot) {
          var val = snapshot.val();
          $scope.$apply(function () {
            $rootScope.name = val;
            $scope.userDisplayInfo.name = $rootScope.name.displayName;
            $scope.userDisplayInfo.email = $rootScope.name.email;
          });
          console.log(user);
        });
      }).catch(function (error) {
        console.log(error);
      });
    };

那么，我应该怎么做才能在 DOM 中保留用户和电子邮件？

Answer 1

大多数现代浏览器都支持 HTML5 本地存储。首先，检查浏览器是否支持它：

if(typeof(Storage) !== "undefined") {
    // localStorage is OK to use
} else {
    // no localStorage support
}

然后要设置您的数据，只需执行以下操作：

// Set
localStorage.setItem("user", userId);

// Get
var userId= localStorage.getItem("user");

记得在退出时清除该值，因为即使在浏览器关闭并重新打开后，localStorage 仍然存在。

Answer 2

暂时保持简单，使用 $cookies:

// $cookies injected somewhere above
$cookies.put('userEmail', $scope.userDisplayInfo.email');

然后验证用户是否登录：

// $cookies injected somewhere above
if ($cookies.get('userEmail')) {
    // user is logged in
}

将数据保存在 DOM

Persisting data in the DOM

javascript

dom

angularjs

firebase