NestJs Angular Universal ReferenceError：未定义 sessionStorage答案

【问题标题】：NestJs Angular Universal ReferenceError: sessionStorage is not definedNestJs Angular Universal ReferenceError：未定义 sessionStorage
【发布时间】：2020-08-05 13:10:17
【问题描述】：

请协助，我有一个使用 Angular Universal（Angular 8 和 NestJs）的应用程序。我正在尝试访问 Angular 组件（onInit）内的会话存储，但 NestJs 给了我以下信息：ERROR ReferenceError: sessionStorage is not defined。在查看angular DI 之后，我尝试了以下操作：

export const BROWSER_STORAGE  = new InjectionToken<Storage>('Browser Storage', {
  providedIn: 'root',
  factory: () => window.sessionStorage
});

然后在我的组件中：

 constructor(@Inject(BROWSER_STORAGE) public storage: Storage) {}
  ngOnInit(): void {
     this.storage.setItem('store', 'store');
  }

现在收到以下错误ERROR TypeError: this.storage.setItem is not a function。如何使用 Angular Universal（Angular 8 和 NestJs）设置/获取会话存储数据。

【问题讨论】：

您使用的是sessionStorage 还是您的 3r 方库之一？
@David 更新了问题，使用了 sessionStorage 内置的 DOM 方法。
你不能使用nativesessionStorage服务器端（通用）。如果代码正在服务器端执行（例如使用 isPlatformBrowser），您需要提供模拟或不调用您的服务

标签： angular nestjs angular-universal

【解决方案1】：

感谢大卫。为了让 NestJs 不执行 this.storage.setItem('store', 'store'); 必须注入 PLATFORM_ID 并使用 isPlatformBrowser 如下：

  constructor(
    @Inject(BROWSER_STORAGE) public storage: Storage,
    @Inject(PLATFORM_ID) public platformId: object
  ) {}

然后在 ngInit 内部：

  ngOnInit(): void {
    if (isPlatformBrowser(this.platformId)) {
      sessionStorage.setItem('store', 'store');
      this.storage.setItem('storeDI', 'storeDI');
    }
  }

isPlatformBrowser(this.platformId) 将在服务器端返回false，在浏览器端返回true。

【讨论】：