javascript - Angular 通用 + 外部 API

Question

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

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

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

我希望你明白我在这里想要达到的目标。您是否知道如何解决这个问题，或者甚至有“官方”的方式来做到这一点？我确信我不是唯一一个尝试做类似事情的人。

score 0 · Accepted Answer

Angular Universal 有两个常量 isNode 和 IsBrowser

if(isNode){

   // it's Node Server

} else {
  //it's Browser
}

score 0 · Accepted Answer

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

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

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

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

2 回答 2