Question

我已经使用angular 5构建了一个应用程序，除了从rest api加载数据（使用httpclient）之外，它工作正常。当我加载应用程序时，加载模块需要花费大约3秒的时间。我已编码从初始化程序中的rest 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（角度5）时，它首先发送OPTIONS请求，在appload 10秒后命中，然后有300ms的等待时间，这导致整体延迟得到输出api。由于我的应用程序结构依赖于此api数据，因此在页面上显示html大约需要20秒。

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

Answer 1

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

Answer 2

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

搜索App Shell和Angular SW，使用NG CLI设置所有内容非常容易。

httpclient请求开始延迟加载角度5

2 个答案: