Angular 5 Ngrx State在浏览器页面刷新期间丢失

Question

我是angular 5和Ngrx的新手,有些我如何设法实现登录功能,一旦登录成功我将用户带到仪表板.但是如果我刷新页面,用户状态似乎就会丢失.即使页面重新加载,如何使用户状态持久？

Answer 1

即使页面重新加载,如何使用户状态持久？

as @ user184994提到的NGRX状态仅保存在内存中.如果您希望它在页面刷新之间保持Go for LocalStorage或sessionStorage

localStorage并sessionStorage完成完全相同的事情并拥有相同的API,但sessionStorage数据仅在窗口或选项卡关闭之前保持不变,而localStorage数据会持续存在,直到用户手动清除浏览器缓存或直到您的Web应用程序清除数据为止.

我建议你去Angular的@ ngx-pwa/local-storage异步本地存储

对于Angular 5:

npm install @ngx-pwa/local-storage@5

在RootModule中注册它

import { LocalStorageModule } from '@ngx-pwa/local-storage';

@NgModule({
  imports: [
    BrowserModule,
    LocalStorageModule,
    ...
  ]

注入并使用它

import { LocalStorage } from '@ngx-pwa/local-storage';

@Injectable()
export class YourService {

  constructor(protected localStorage: LocalStorage) {}

}

用法

let user: User = { firstName: 'Henri', lastName: 'Bergson' };

this.localStorage.setItem('user', user).subscribe(() => {});