Chrome中的慢速cors预检选项请求[关闭]

Posted

技术标签:

【中文标题】Chrome中的慢速cors预检选项请求[关闭]【英文标题】:Slow cors preflight OPTIONS Request in Chrome [closed] 【发布时间】:2018-06-20 18:41:07 【问题描述】:

我正在努力解决一个只在 Chrome 中出现的怪异问题。

我的 Angular SPA 与不同子域 (api.domain.com) 上的 node.js-Backend 通信。为了让它工作,我使用the cors npm package。一切正常,除了 Chrome 中 OPTIONS 预检的下载时间。

Screenshot of OPTIONS slower than PUTThe timing tab shows that most time is spent by downloading content, but there is no Content-Body in my response.

此时间仅发生在 Chrome 中。 Firefox、IE、Edge 和 Opera 不受影响。

我在 docker 容器中使用带有 express 和 cors 的 node.js。前端是一个 Angular 1 SPA。

有人知道如何解决这个问题吗?

【问题讨论】:

Super slow preflight OPTIONS in Chrome only的可能重复 【参考方案1】:

如果您使用的是 express,您可以尝试这个 hack 并使用您的所有 CORS 内容编写一个中间件函数,检查请求是否是预检并返回 200。希望这可以为您解决问题。但话又说回来,我不使用这种依赖关系,而且奇怪的是它只出现在 chrome 中。

app.use(function(req, res, next)     //CORS
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.setHeader("Access-Control-Allow-Headers", "Origin, x-access-token, X-Requested-With, Content-Type, Accept");
    if ('OPTIONS' == req.method) 
        res.send(200);
    
    else 
        next();
    
);

【讨论】:

感谢您的建议。不幸的是,它不能解决我的问题 :( 你还有其他想法吗? 这似乎是一个 chrome 错误。假设您的生产应用程序将与您的 API 在同一台服务器上运行,您可以通过您域上的小型服务器代理您的请求来摆脱 CORS。 blog.javascripting.com/2015/01/17/dont-hassle-with-cors【参考方案2】:

我一直在寻求调试它,它似乎是一个 chrome 错误,因为我们遇到了同样的问题。

作为参考,我在这里向 Chromium 提交了错误报告:CORS pre-flight and subsequent requests are very slow only on Chrome

我在此处添加此内容是为了帮助阻止更多开发人员花费半天时间对其进行调查;)随着我们从 Chromium 中获取更多信息,我们将进行更新。

错误报告概述如下:

用户代理:

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (Khtml, like Gecko) Chrome/63.0.3239.132 Safari/537.36

重现问题的步骤:

    有 app.domain.com 列表项 有api.domain.com 在 API 上启用 CORS 以启用访问权限 在 DevTools 中检查响应,查看 OPTIONS 和 GET 请求最多需要 300ms+

预期的行为是什么?

响应时间应该准确。

出了什么问题?

我们正在使用 Go 微服务,并注意到浏览器之间的时间差异很大 - chrome 是最慢的,最高可达 100 倍。

当我们从后端检查时间时,响应最多需要 10 毫秒,大多数都在 1 毫秒以下。在 devtools 下检查时间时,相同的响应在 ~100ms~1s 时出现。

以前有这个工作吗?

不适用

Chrome 版本:63.0.3239.132 频道:稳定 操作系统版本:10.0 Flash 版本:

在 Firefox(和任何其他浏览器)中,完全相同的请求会在大约 1-20 毫秒内返回,正如预期的那样。

为了进一步诊断,我们使用 Telerik 的 Fiddler 检查实际的网络响应时间,并确认 Chrome 在我们预期的时间内发送和接收它们。我们可以得出的唯一结论是 Chrome 内部的某些东西正在减慢这些请求的处理速度。

我们尝试了chrome://flags#out-of-blink-corschrome://flags#enable-site-per-process 的所有排列,我们发现这两个选项似乎有点相关。似乎没有任何帮助。

我们还发现了许多关于类似问题的 Stack Overflow 文章,其中提到它是 Chrome 错误,但我无法在此处找到报告:

Super slow preflight OPTIONS in Chrome only https://github.com/corydolphin/flask-cors/issues/147 Slow cors preflight OPTIONS Request in Chrome

我们刚刚在 MacOS 上测试了 Chrome,这似乎不是问题 - 因此可能仅限于 Windows。

铬:

边缘:

火狐:

【讨论】:

以上是关于Chrome中的慢速cors预检选项请求[关闭]的主要内容,如果未能解决你的问题,请参考以下文章

Rails 在 CORS 预检选项请求中以 404 响应

CORS 预检选项请求的 403 错误。怎么修?

CORS 选项预检悬挂

预检 CORS 请求在 Chrome 60 中不起作用

401 未经授权响应 CORS 预检选项请求

即使没有发出预检请求,也会在 POST 请求中出现 CORS 错误