504 从服务器读取响应时超时答案

【问题标题】：504 Timeout while reading reponse from the server504 从服务器读取响应时超时
【发布时间】：2019-06-11 15:27:17
【问题描述】：

我有一个 Angular 前端和一个 .NET CORE 后端。我有一个非常繁重的特定请求，需要一段时间才能执行。当我查看浏览器控制台时，我得到一个 504：从服务器读取响应时超时。

后端完成请求，我可以在日志中看到它在一定时间后返回一些 JSON（在我超时后的某个地方）。

首先我尝试向角度请求添加超时标头，如下所示：

    const options = { headers: new HttpHeaders({ timeout: `${10000}` }) };

这不起作用。

我还尝试在我的 rxjs 管道中添加该函数。

 this.service.getData(this.id, this.codeSystem, this.code)
    .pipe(
      timeout(120000),
      map(data=> {
       this.data = data;
      }),
      takeWhile(() => this.componentActive),
      catchError(error => {
        console.log(error);
      }))
    .subscribe();

之后我尝试在 IIS 的高级设置下增加连接超时，这也没有用。

目前我不确定问题出在哪里或如何解决。有人有想法/建议吗？

【问题讨论】：

标签： angular http-status-code-504

【解决方案1】：

问题出在服务器上。您可以通过浏览器进行任何操作。如果服务器没有在时间限制内发送响应，大多数浏览器会自行断开，出于安全原因，我们无法通过 JavaScript 更改此设置。服务器必须发送部分正文内容以响应继续连接的请求。只要服务器忙，它就必须发送一些东西来保持连接。

如果您有一个需要很长时间才能完成的 API，并且您看到 disconnections 结果，那么您应该放弃期望获得 JSON 响应。

联系 API 的作者，请他们修复他们的服务器。

发出需要很长时间才能完成的请求时。最佳做法是POST 启动服务，服务器以任务 ID 响应。然后您GET 会每隔一段时间更新该任务ID 的状态，直到任务ID 的状态报告所发生的情况。然后，您可以请求服务器将任务的输出发送给客户端。

与此同时，发出请求并忽略错误。您无法通过浏览器解决此问题。

【讨论】：

谢谢，我试试这个。我不知道这是一回事！这不可能背后的安全原因到底是什么？我可以想象它可能会使浏览器崩溃，但有多种方法可以做到这一点。

【解决方案2】：

您不需要超时。您可以设置take 或takeUntil 以便您的订阅是“热的”，直到您收到回复。

callEndpoint() {
    this.service.getData.pipe(
       take(1) // wait for response
    ).subscribe( (user: User) => {
       console.log(user); // make sure you're getting a response from dataService
    });
}

另外，检查端点是否正在获取它期望的数据： this.id, this.codeSystem, this.code

【讨论】：

不采取虽然做同样的事情？这已经包含在代码中了。
是的，但我正在尝试进行最低限度的复制以进行故障排除。我不知道this.componentActive 做了什么。如果我的版本仍然给您该错误，请查看问题的后端/端点。
componentActive 是一个布尔值，当 onDestroy 生命周期钩子被调用时，它会变为 false。端点确实按预期获取数据。
我在周末为您提供的几个想法：如果您删除管道并仅订阅，您会获得数据吗？此外，我仍然对服务器/端点持怀疑态度。服务器日志是否提供任何可能识别 504 的详细信息？

【解决方案3】：

确保您的服务请求返回承诺。喜欢：

getData(): Promise<Array<string>> {
    return this.http.get("http://a-test-api.com/api/getdata").toPromise();
}

【讨论】：

getData 返回一个 Observable，返回一个 Promise 并不能解决问题。