django-Angular 对 XMLHttpRequest 的访问已被 CORS 策略阻止

Question

当尝试向 django 服务器提交 POST 请求时，出现以下错误：

Obj:1 Access to XMLHttpRequest at 'http://localhost:8000/api/' from origin
'http://localhost:4200' has been blocked by CORS policy: Request header field
content-type is not allowed by Access-Control-Allow-Headers in preflight response.

这是我提出请求的代码：

return this.http.post(url, data, 
    {headers: new HttpHeaders({
        'Content-Type': 'application/json',
        'Accept': 'application/json',
        'Access-Control-Allow-Headers': 'Content-Type',
    })}
)

这是我的 Django 设置：

CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_HEADERS = ["access-control-allow-origin"]

对问题的任何见解以及如何改进问题将不胜感激

Answer 1

正如@jub0bs指出的那样，问题已通过以下方式解决：

从请求中删除

Access-Control-Allow-Headers

标头，并将其更改为 CORS 配置中的

CORS_ALLOW_HEADERS = ["Accept", "Content-Type"]

。

Access-Control-Allow-Origin

是CORS响应标头，在名义情况下已经由CORS中间件设置；没有充分的理由将其列为 CORS 配置中允许的请求标头名称。

推荐阅读：developer.mozilla.org/en-US/docs/Web/HTTP/CORS