访问 XMLHttpRequest 的问题已被 CORS 策略（Python/Angular）阻止

Posted 2023-03-03

【中文标题】访问 XMLHttpRequest 的问题已被 CORS 策略（Python/Angular）阻止

【英文标题】：Issue with Access to XMLHttpRequest has been blocked by CORS Policy (Python/Angular)

【发布时间】：2020-11-23 04:38:54

【问题描述】：

我在 Angular 应用程序上遇到以下问题，该应用程序目前在网络上运行。 用户因此无法登录。而且，已经登录的用户无法正常使用网站。

错误：CORS 策略已阻止从源“后端（域）”访问“前端（域）”处的 XMLHttpRequest。请求的资源上不存在“Access-Control-Allow-Origin”标头。

我已经看过很多与同一问题相关的帖子。已经实现了应用程序的大部分解决方案。让我详细解释一下。

申请详情： 前端： Angular 7，已安装 SSL。 后端： Python 3.7，Django Rest 框架，已安装“CorsHeader”插件，CORS_ORIGIN_ALLOW_ALL 为 True，“corsheaders.middleware.CorsMiddleware”位于中间件列表的顶部。 服务器上的 Apache： 'rewrite'、'wsgi' 和 'headers' 已启用。

最重要的是：实施解决方案后，错误会消失一段时间。但是，几天/几周后，同样的错误再次发生。重新启动服务器将解决此问题。但是，几天/几周后，同样的情况会再次出现。

此问题的正确解决方法是什么？还是我做错了什么？

注意：我不是通过本地/邮递员进行测试。一切都在本地和 Postman 上完美运行。

添加两个请求的屏幕截图。此请求会自动执行两次。第一个请求没有响应。而且，第二个请求有一个 503 响应。

【问题讨论】：

当您收到 CORS 错误时，响应的 HTTP 代码是什么？您可以使用浏览器开发工具中的网络窗格进行检查。如果 Chrome 没有向您显示，请使用 Firefox devtools 中的网络窗格。是 4xx 还是 5xx 错误而不是 200 OK 成功响应？

@sideshowbarker 已经检查过了。响应是一个错误。

如果响应是错误的，那是正常的，预计它不会有 Access-Control-Allow-Origin。特别是 Apache Web Server 需要它。默认情况下，标头只会包含在 2xx 成功响应中，而不包含在错误响应中。所以问题中描述的并不是 CORS 问题的迹象。相反，似乎需要修复的是导致服务器以错误开始响应的任何原因。但需要明确的是，CORS 配置不会导致该错误；相反，它是相反的。

@sideshowbarker 有什么想法吗？我没有想法。

该 Apache/Python/Django 服务器的服务器端日志显示什么？如果您收到错误响应，似乎必须将某些消息记录到服务器日志中以指示正在发生的问题，最终导致服务器发送错误响应。它可能是任何东西——可能服务器进程有内存泄漏并最终耗尽内存，或者可能发生了其他一些问题，导致它最终以某种方式被卡住。不管是什么，我认为服务器日志都是接下来寻找线索的地方。

【参考方案1】：

我找到了根本问题，请看你的截图，有Access-Control-Request-Method: GET，它不应该在那里。

在您的角度代码中删除以下代码。

request.headers
        .set('Access-Control-Allow-Methods', 'GET')
        .set('Access-Control-Allow-Origin', '*');

希望它能解决您的问题。