连续发出多个请求时出现 Angular CORS 问题答案

【问题标题】：Angular CORS Issue When Making Multiple Requests Consecutively连续发出多个请求时出现 Angular CORS 问题
【发布时间】：2018-09-10 18:24:28
【问题描述】：

我正在使用 Angular 6，并且我有一个节点 api 后端。

我遇到了一个 cors 问题，但它只是偶尔发生。

我每 5 秒执行一次 http 获取请求

   const url = 'https://<removed>.com/api/v1/transactions/' + transactionId;

    interval(5000)
        .pipe(
            switchMap(() => this.httpClient.get(url)),
            tap((response: any) => {
                this.summary = response;
            }),
            takeWhile((response: any) => response.data['status'] !== 'Completed'),
    ).subscribe();

}

第一个请求很好，然后我在下一个请求时收到以下错误。

加载失败 https://"".com/api/v1/transactions/f3debad2-a830-4168-9a03-475389dae7e0：请求中不存在“Access-Control-Allow-Origin”标头资源。因此不允许使用原点“http://localhost:4200” 使用权。响应的 HTTP 状态代码为 502。

跨域读取阻塞 (CORB) 阻止了跨域响应 https://"".com/api/v1/transactions/f3debad2-a830-4168-9a03-475389dae7e0 MIME 类型为 text/html。看 https://www.chromestatus.com/feature/5629709824032768 了解更多详情。

这只是有时会发生，其他时候我可以通过 200 个响应发出尽可能多的请求。

在我的节点后端中，在我的所有路由之前。

this.app.use(cors());

【问题讨论】：

嘿伙计，你已经解决了这个问题吗？我现在正在经历它，在我的后端我已经正确设置了 CORS，但是当我向不同的 url 发出多个请求时仍然收到 CORB 错误，所以我不确定我还应该添加什么。跨度>
@SherwinAblañaDapito 我还没有机会测试任何东西，如果你找到解决方案，请告诉我
好吧，我假设您在后端使用请求模块，您是否尝试添加 followRedirect: false？您的请求可能在某处弹跳。或者您可以尝试在后端使用 Method HEAD 而不是 GET（用于测试），看看会发生什么。我希望这对您有所帮助。
@SherwinAblañaDapito 你解决了你的问题吗，如果解决了怎么办？是的，我在后端使用请求模块。
我还没有解决这个问题，但我添加了一个临时修复。当我的 HTTP 请求完成时间过长或者重定向太多但没有错误时，CORB 问题出现在我的最后。所以我所做的是，我在请求模块中添加了一个超时选项，它以某种方式解决了 CORB 问题。

标签： node.js angular express

【解决方案1】：

我不确定这是否能解决您的 CORB 问题。我添加了一个超时作为我的 CORB 问题的临时修复。如果我的 http 请求完成时间过长或重定向过多，则会出现我的 CORB 问题

示例：如果我向（http://www.redbull.com、http://www.redbull.org、http://www.redbull.net 等）发出多个请求，其他扩展可能会重定向到 .com，如果花费时间过长，我会收到类似于您的 CORB 错误

所以我所做的是我添加了超时

// set request option
const requestOption = url => {
    return {
       url      : url,
       method   : 'HEAD',
       json     : true,
       timeout  : 5000,
       headers  : { 'connection': 'Keep-Alive' }
    }
}

// initialize request
const initializeRequest = (callback, option) => {
    request(option, (error, response, result) => {
      // for undefined response
      if(!response)
          return callback(null, response === undefined ? 404 : 200)

      callback(error, response.statusCode);
    }); 
}

// on your controller
module.exports.executeRequest = (req, res) => {
    //call initialize request here and create error handler.
    initializeRequest(your callback, requestOption(your URL));
}

【讨论】：