当 html 页面在保存时重新加载时，Nestjs/Angular Universal 在节点控制台中输出错误答案

【问题标题】：Nestjs/Angular Universal outputs error in the node console when the html page reloads on save当 html 页面在保存时重新加载时，Nestjs/Angular Universal 在节点控制台中输出错误
【发布时间】：2020-06-16 07:47:16
【问题描述】：

ERROR [NetworkError] 是什么意思？

我使用 ng-universal 来拥有 Nestjs 后端和 Angular 前端。我正在使用“npm run dev:ssr”运行全栈应用程序。每当我在浏览器中刷新前端页面时，服务器终端都会以红色显示“ERROR [NetworkError]”的新行输出。当我发出任何网络请求时，它不会出现该错误，只是当我向为应用程序提供服务的 localhost 端口发出请求时。

【问题讨论】：

你们中的一些 API 调用可能会失败？您是否为这些调用使用了绝对 url？
不，这不是因为任何 API 调用，除了交付应用程序的一个静态 API。当我从 Postman 进行任何测试 API 调用或从前端应用程序进行调用时，不会出现新的“ERROR [NetworkError]”错误，但是当我刷新页面时会出现一个新错误。不进行绝对 URL 调用。它们都是相对于进行调用和提供应用程序的位置进行的，即 localhost:4200。
在使用角度通用时，通常所有 API 调用都应该是绝对的。 4200默认不是ssr的端口（我认为是4000）。
它是 Angular 应用程序的端口，甚至当您使用 Angular Universal 添加 Nestjs 时也是如此。

标签： nestjs angular-universal angular-fullstack

【解决方案1】：

如果重新加载时向服务器OnInit发出api请求，使用ng-universal示例时首先检查isPlatformBrowser。

import { Component, OnInit, PLATFORM_ID, Inject } from '@angular/core';
import { isPlatformBrowser } from '@angular/common';
import { HttpClient, HttpHeaders } from '@angular/common/http';

public testBrowser: boolean;
export class HomeComponent implements OnInit {

  public testBrowser  : boolean;
  public data         : any;
  
  constructor(private http: HttpClient, @Inject(PLATFORM_ID) platformId: string) {
    this.testBrowser = isPlatformBrowser(platformId);
  }

  ngOnInit() {
    if (this.testBrowser) {
      //avoid server NETWORK error
      this.data = this.http.get('/api');
    }
  }
}

在检查isPlatformBrowser === true 首先检查OnInit 之前尝试从客户端进行服务器调用时遇到了同样的错误，这解决了我的问题。希望这可以帮助解决这个错误。

作为参考，这个答案帮助我解决了这个长期存在的错误。 https://stackoverflow.com/a/46893433/4684183

【讨论】：

我这样做了，然后它开始给我不同的错误。感谢@Ian Poston Framer。但我只是用不同的代码重新编写了应用程序，它在新代码中运行良好。我认为这与 NestJS 代码有关，但我不知道。