httpclient 请求开始较晚以角度 5 加载答案

【问题标题】：httpclient request start late to load with angular 5httpclient 请求开始较晚以角度 5 加载
【发布时间】：2018-05-14 06:05:38
【问题描述】：

我已经构建了一个 angular 5 的应用程序，除了从 rest api 加载数据（使用 httpclient ）外，它工作正常。当我加载应用程序时，加载模块需要大约 3 秒的时间。我已经编码以从初始化程序中的其余 API 获取数据，如下所示在服务中

load(): Promise<any> {
         this._appLoadData = null;
         return this.http
            .get<Response>(this.apiUrl+'appload-new')
            .map((res: Response) => res)
            .toPromise()
            .then((data: any) => this._appLoadData = data.response.data)
            .catch((err: any) => Promise.resolve());
   }

并在 app.module 文件中调用了这个 load() 函数

export function initilizerServiceFactory(initilizerService: InitilizerService): Function {
  return () => initilizerService.load();
}

当我使用 httpclient ( angular 5 ) 时，它首先发送 OPTIONS 请求，该请求在 appload 10 秒后命中，然后有 300 毫秒的等待时间，这会导致获取输出 api 的总体延迟。由于我的应用程序结构依赖于此 api 数据，因此在页面上显示 html 大约需要 20 秒。

我检查了其他解决方案，但没有得到问题的确切解决方案

【问题讨论】：

标签： angular rest httpclient angular5

【解决方案1】：

您可以向托管 Angular 应用程序的服务器发出 api 请求，然后将所有 /api 请求反向代理到您的 api 服务器。这样可以避免options 请求。

【讨论】：

API 托管在同一台服务器上，但在另一个端口 (8080) 上，因为它们是使用 golang 构建的，不知道如何制作。你有什么建议吗？
即使不同的端口，它仍然会被视为 CORS，因此您需要从您用于服务 Angular 应用程序的任何服务器内部代理它们。对于 nginx，请检查：stackoverflow.com/questions/29558204/…
您使用什么服务器来提供 Angular 应用程序？
它使用 cli 构建并托管在 aws ec2 实例上
因此请查看使用 aws 的反向代理。服务器必须是 nginx IMO。

【解决方案2】：

您可以使用 App Shell（预渲染入口点）或完整的 Angular Universal SSR 和/或 Service Worker 来更快地获得第一个有意义的绘制。

搜索 App Shell 和 Angular SW，使用 NG CLI 很容易设置所有这些。

【讨论】：

问题似乎不在于启动时间。它的选项请求是矫枉过正
如果你有 Universal，你可以在没有选项请求的情况下在服务器上发出初始请求。
你建议他改变他的架构。他可能想要现有架构的解决方案。但我同意，这很有帮助
JSONP 可能也值得一试，如果服务器支持的话，作为一个快速简单的修复方法