页面重新加载后,在Angular 4 SPA中初始化用户数据的最佳做法

时间:2017-08-29 18:02:32

标签: angular

我有一个Angular 4 SPA应用程序,并且在我的单例DataService中使用userInit方法来检索/管理用户登录时的全局状态数据。除了在登录时初始化用户数据(工作正常),我想知道在浏览器重新加载时初始化用户数据的最佳做法是什么(即经过身份验证的用户重新加载受AuthGuard保护的mysite.com/user/preferences之类的深层链接。

目前,我的解决方案是在AuthGuard的canActivate方法中调用DataService.userInit方法。这种调用在某种程度上有助于确保在页面重新加载后确保所有全局用户状态都可用,但没有及时为重新加载的第一页初始化数据,因此它不是理想。 (即重新加载mysite.com/user/preferences不会在第一次加载时显示用户数据,因为首选项页面在dataService再次从后端检索数据之前呈现,但是从首选项页面导航并返回到它揭示了当canActivate运行时重新加载用户数据)。

我的问题:

  1. canActivate挂钩是放置我的用户初始化代码的最佳位置(即需要为用户已经过身份验证运行的代码重新加载的代码),或者是他们的其他挂钩我应该考虑?

  2. 我应该如何处理首次重装的问题?请考虑我需要首先对用户进行身份验证,然后才允许运行userInit代码,如果所有这些代码都可以呈现请求的页面。我不打算为一个特定的页面解决这个问题,但是对于任何可能依赖于全局数据的页面,因此我试图找出一个好的设计模式。

  3. 想知道其他人如何处理页面重新加载,例如你是否只是在重新加载时将用户重新路由回主页?或者将它们路由到中间页面然后返回目标页面。

  4. 任何建议表示赞赏。谢谢,

    • S上。 Arora的

1 个答案:

答案 0 :(得分:0)

您应该观察知名网站(Twitter,Facebook等)如何管理其身份验证状态;但基本上,对于经过身份验证的状态,有一个身份验证令牌可以保留在LocalStorage中,该令牌应该在一段时间后过期,并且刷新令牌机制允许用户在重新加载时保持身份验证(也用于记住我选项)。

有一篇好文章需要知道:https://auth0.com/blog/refresh-tokens-what-are-they-and-when-to-use-them/

  1. 你有另一个选择,我相信这个更好,因为它让你的警卫变得简单,这应该是警卫的目标:在路由模块级别使用解析器。

  2. 这取决于我之前写的内容以及您的应用程序架构是如何制作的。在此之后,所有关于结算,服务单身等等......

  3. 基本上是令牌管理的整个介绍等......