Angular 7 Universal（服务器端渲染）[错误参考错误：未定义文档]答案

【问题标题】：Angular 7 Universal (Server Side Rendering) [ERROR ReferenceError: document is not defined]Angular 7 Universal（服务器端渲染）[错误参考错误：未定义文档]
【发布时间】：2019-03-19 21:34:14
【问题描述】：

我已经为我的项目实施了 SSR 并将其部署到 heroku。现在，当我在heroku logs --tail 中启动应用程序时，我会运行很多东西，并且会显着降低性能。大多数事情都是错误的：

ERROR ReferenceError: 文档未定义

即使我使用这样的结构：

    if (isPlatformBrowser(this.platformId)) {
      const overflow = this.isMenuOpened ? 'hidden' : 'auto;';
      this.renderer.setStyle(this.document.body, 'overflow', overflow);
    }

每次我重新加载页面时，这个东西都会再次开始运行。

在我的package.json 文件中，我需要运行以下命令：

"scripts": {
    "ng": "ng",
    "start": "node dist/server.js",
    "build": "npm run build:server:prod && npm run build:browser:prod",
    "build:server:prod": "ng run oilEnergy:server && webpack --config webpack.server.config.js --progress --colors",
    "build:browser:prod": "ng build --prod"
  }

所以在部署 Heroku 时，它会构建服务器和浏览器文件夹并编译 server.js 文件，然后由该文件负责运行我的应用程序。

一段时间后，我的应用程序崩溃，heroku 显示 Application error 而不是我的应用程序。

我不知道，为什么会这样。也许以前有人遇到过这个问题？

【问题讨论】：

你注入document正确了吗？
@HarunYılmaz 是的，我有这些导入构造函数（私有渲染器：Renderer2，@Inject(DOCUMENT) 私有文档：文档）{}

标签： node.js angular heroku server-side-rendering

【解决方案1】：

尝试使用document 而不是this.document

以下代码对我有用

import { PLATFORM_ID, Inject } from '@angular/core';
import { isPlatformBrowser } from '@angular/common';


constructor(
    @Inject(PLATFORM_ID) private platformId: Object) {
    if (isPlatformBrowser(this.platformId)) {
      this.bodyTag = document.getElementsByTagName('body')[0];
      this.htmlTag = document.getElementsByTagName('html')[0];
    }
  }

【讨论】：