localStorage 未定义 - 使用角度通用，我有一个使用 localStorage 的函数

Question

我有一个在我的应用程序中使用的函数，该函数的参数之一是一个对象：

const checkValues = {
  promoId: ...,
  ...
  unsaved: !JSON.parse(localStorage.getItem('unsaved')) ? [] : JSON.parse(localStorage.getItem('unsaved'))
}

但是，当我提供项目时收到的唯一错误是：

ReferenceError：对象中未定义 localStorage。(/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:4145:23) 在webpack_require (/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:21:30)在对象。(/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:4119:67) 在webpack_require (/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:21:30)在对象。(/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:1728:69) 在webpack_require (/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:21:30)在对象。(/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:1803:70) 在webpack_require (/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:21:30)在对象。(/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:1509:79) 在webpack_require (/home/meow/Development/dmc/cli_universal/dist/server.bundle.js:21:30)

如何检查 localStorage 是否存在？

Answer 1

localstorage 是一个浏览器组件，您尝试在服务器端使用它，您必须确保仅在浏览器端时调用 localstorage。

为此，您可以使用 Angular isPlatformBrowser 模块。

例子

import { isPlatformBrowser } from '@angular/common';  
constructor(@Inject(PLATFORM_ID) private platformId: any) {}
ngOnInit() {
  if (isPlatformBrowser(this.platformId)) {
    this.id = localStorage.getItem('id');
  } 
}