$rootScope.currentUser 在刷新时为空

Posted 2023-02-22

【中文标题】$rootScope.currentUser 在刷新时为空

【英文标题】：$rootScope.currentUser is null on refresh

【发布时间】：2014-08-03 07:54:57

【问题描述】：

我能够让 firebaseSimpleLogin 工作并将当前用户存储在 rootScope 中。当我转到另一个页面并返回提要页面时，所有内容都会加载，但是当我刷新 $rootScope.currentUser 时为空。有其他人遇到过这个问题吗？

我的 app.run 函数中有这段代码：

$rootScope.$on('$firebaseSimpleLogin:login',function(e, auth)
   $rootScope.currentUser = User.find(auth.id);
);

这是我正在尝试加载用户帖子的 FeedCtrl

app.controller('FeedCtrl',['$scope', '$rootScope','User','Auth','Post',function($scope,     $rootScope,User,Auth,Post)
 populateFeed();
 console.log($rootScope.currentUser);

$scope.logout = function()
   Auth.logout();
;


$scope.savePost = function()
  Post.create($scope.post).then(function(post)
    $scope.post.text = "";
  );
;

function populateFeed()
   $scope.posts = ;
   angular.forEach($rootScope.currentUser.posts,function(id)
    $scope.posts[id] = Post.find(id);
   );


]);

我的主应用模块

var app = angular.module('myapp',['ui.router','firebase']);

app.config(function($stateProvider, $urlRouterProvider)
  $stateProvider
.state('/',
  url: '/',
  controller: 'MainCtrl',
  templateUrl: 'views/index.html'
)
.state('feed',
  url: '/feed',
  controller: 'FeedCtrl',
  templateUrl: 'views/feed.html',
  authenticate: true
)
.state('login',
  url: '/login',
  controller: 'LoginCtrl',
  templateUrl: 'views/login.html'
)
.state('signup',
  url: '/signup',
  controller: 'LoginCtrl',
  templateUrl: 'views/signup.html'
)
.state('settings',
  url: '/settings',
  controller: 'SettingsCtrl',
  templateUrl:"views/settings.html"
)
.state('profile',
  url: '/:slug',
  controller: 'ProfileCtrl',
  templateUrl: 'views/profile.html'
)
.state('profile-about',
  url: '/:slug/about',
  controller: 'ProfileCtrl',
  templateUrl: 'views/profile.html'
);

$urlRouterProvider.otherwise('/');
)
.constant('FIREBASE_URL','https://FIREBASE.firebaseio.com/')
.run(function($rootScope, $state,FIREBASE_URL, $firebaseSimpleLogin, User, Auth)
$rootScope.$on('$stateChangeStart',function(event, next)
  if(next.authenticate && !User.getCurrentUser())
     $state.go('login');
  
 );

 $rootScope.$on('$firebaseSimpleLogin:login',function(e, auth)
   $rootScope.currentUser = User.find(auth.id);
  );

 $rootScope.$on('$firebaseSimpleLogin:logout',function()
  delete $rootScope.currentUser;
  $state.go('login');
 );

 $rootScope.logout = function()
  Auth.logout();
;

);

【问题讨论】：

$rootScope.$on('$firebaseSimpleLogin:login' 是否在 console.log($rootScope.currentUser) 被调用之前运行？

是的，它在附加到我的主应用程序模块的运行函数中运行。

正确，但是在您尝试记录其内容之前是否调用了回调（分配 currentUser 的部分）？可能不会。

我已经添加了我的应用程序主模块

这里的主模块可能是多余的。 $rootScope.$on 调用的回调是异步调用。它不会立即被调用。您的控制器可能在该回调执行之前被实例化。通过在该回调中放置一个 console.log 来测试这一点，并在您尝试记录 $rootScope.currentUser

的内容后看到它被调用

【参考方案1】：

如果您所说的“刷新”意味着您在浏览器中按 F5，这将从内存中擦除您的 $rootscope，并且您将在体验时返回 null（基本上您的整个应用程序将被“重新启动”）。

为了保存值，您需要将它们存储在 cookie 中或使用 localStorage/sessionStorage。例如，不要使用 $rootscope.currentUser，而是使用 $window.sessionStorage.currentUser。

【讨论】：

知道如何在 html 中调用 $window.sessionStorage.currentUser 吗？

【参考方案2】：

要将其存储在 localStorage 中： $window.localStorage.setItem("currentUser", currentUser);

或以 json 格式存储： $window.localStorage.setItem("currentUser", angular.toJson(currentUser));

要在那里获得它： var currentUser = $window.localStorage.getItem("currentUser");

或者如果您使用第二种方式保存它： var currentUser = JSON.parse($window.localStorage.getItem("currentUser"));