Angular 通用 + 外部 API

Question

我知道 Angular Universal 仍在开发中。所以我考虑过将 Angular Universal 用于 Web 应用程序，该应用程序会定期从外部 API 服务器（大约每 10 秒通过 Http 服务）提取数据。然后，此数据会显示在 Web 应用程序上。

我遇到了几个我还没有找到简单解决方案的问题：

1. Angular Universal 显然需要来自 API 服务器的数据来预渲染页面。每次请求 Web 应用程序 HTML 时，我都不想从 nodeJS 查询 API 服务器。如果 nodeJS 服务器“行为”完全像一个客户端 Web 应用程序实例，并且每 10 秒查询一次 API 服务器，以 10 秒为间隔“缓存”这些数据并使用它来呈现 HTML，就足够了。
2. 客户端 Web 应用程序将来自 API 服务器的数据存储在某个私有成员变量中。这个成员变量然后用于使用 ngFor、绑定等从它构建 HTML。但是这个成员变量在开始时是空的/未定义的。我不希望客户端 Web 应用程序在启动时擦除预渲染的 HTML，因为这会破坏 Angular Universal 的一些想法（不是 SEO，而是减少加载时间）。

我希望您了解我在这里想要实现的目标。您是否知道如何解决这个问题，或者甚至有“官方”的方式来做到这一点？我敢肯定，我不是唯一一个尝试这样做的人。

Answer 1

Angular Universal 不知道您的代码是服务器代码还是客户端代码，它只是获取您的应用程序并尝试在服务器上呈现它。但是正如您所提到的，有时您希望服务器的行为与客户端不同。例如，如果您希望 Angular Universal 跳过一个函数，请将这行代码放在函数体的顶部。

if (typeof window === "undefined") return;

或者，如果您有一个场景需要服务器执行与客户端不同的操作，请执行此操作

if (typeof window === "undefined") {
    // server code
} else {
   // client code
};

Answer 2

Angular Universal 有两个常量 isNode 和 IsBrowser

if(isNode){

   // it's Node Server

} else {
  //it's Browser
}