angularjs - 当非事件状态发生更改时，Firefox 无法正确更新页面

Question

我们有一个 Angular 应用程序(SPA)，它维护客户端用户 session ( session 超时、不活动期等)。 session用于当session由于某种原因过期时强制用户重新登录。

session 的过期由专用服务控制，当 session 终止、锁定或以其他方式更改状态时，该服务会在 $rootScope 上广播事件。

我们向那些 session 状态更改事件添加监听器，这些事件会更改相关页面(登录页面、解锁页面等)的路由。我们使用 angular-ui-router 进行路由。

这工作正常，但是，特别是在 Firefox 中，如果在浏览器窗口/选项卡不活动(即最小化、在后台等)时发生 session 状态更改，则页面不会正确刷新。换句话说，您可以看到新页面的控件(例如用户名文本字段和密码字段)，但您看到的不是新页面的背景，而是旧页面。

它在 Chrome 和 IE 中完美运行，我们只在 Firefox 上看到这个问题。此外，当浏览器窗口/选项卡处于事件状态时，它在 Firefox 上也能完美运行。

有什么想法吗？

Answer 1

反其道而行之吧。不要使用 rootScope 广播，只需在服务中获取当前状态的 var，并返回具有该值的函数。

var userSession = 'Expired';

return {
   getSessionState: function () {
      return userSession;
   }
}

并在 Controller 中观看。因此，第一次摘要运行会将 View 切换到您现在需要的 View 。

$scope.$watch(function () {
    return yourServiceName.getSessionState()
}, function (val) {
   //you can check the val here and change the route
});

如果这没有帮助，请确保您使用 $timeout (使用摘要的 Angulars native 超时)并且没有任何设置超时(当浏览器窗口/选项卡不活动时，JS 超时会停止，并且当选项卡时一次全部触发)再次成为焦点，在 Angular 中最终会出现奇怪的行为)。