django中的“请求的资源上不存在'Access-Control-Allow-Origin'标头”

Posted 2023-03-03

【中文标题】django中的“请求的资源上不存在\'Access-Control-Allow-Origin\'标头”

【英文标题】："No 'Access-Control-Allow-Origin' header is present on the requested resource" in djangodjango中的“请求的资源上不存在'Access-Control-Allow-Origin'标头”

【发布时间】：2014-04-23 22:50:00

【问题描述】：

我是 django 的新手，并将其用作创建用户的应用程序的后端。在前端发布用户名的代码是：

var xobj = new XMLHttpRequest();
              xobj.overrideMimeType("application/json");
              xobj.open('POST', "http://www.local:8000/create_user/", true);
                xobj.setRequestHeader("Access-Control-Allow-Origin", "*");
              xobj.onreadystatechange = function () 
                  if (xobj.readyState == 4 && xobj.status == "200") 
                      console.log(xobj.responseText);
                  
            
              xobj.send(json);    

在后端，与 url 关联的函数处理 json，但我收到错误 “请求的资源上不存在'Access-Control-Allow-Origin'标头。因此不允许访问源'http://www.local:54521'”。 这个问题的解决方案是什么？ 我也按照“https://gist.github.com/strogonoff/1369619”的步骤操作，但问题仍然存在。

【参考方案1】：

这是我在从 Restangular 发送 API 请求时从 Django Rest Framework 收到相同错误时所做的。 这样做是将 CORS（跨源资源共享）标头添加到来自 Django Rest Framework 的响应中。没有 CORS 标头是导致错误的原因。

在 Django 项目根文件夹（manage.py 文件所在的位置）中，执行：

pip install django-cors-headers

我使用 virtualenv 进行了尝试，但无法让它工作，所以我安装了它而不切换到 virtualenv 并安装了它。

安装后，你必须对你的 django settings.py 进行一些编辑

INSTALLED_APPS = (
    ...
    'corsheaders',
    ...
)

MIDDLEWARE_CLASSES = (
    ...
    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.common.CommonMiddleware',
    ...
)

CORS_ORIGIN_ALLOW_ALL = True   

将上述设置为 true 允许接受所有来源。

参考：https://github.com/ottoyiu/django-cors-headers

【讨论】：

非常感谢！还需要使用“withCredentials: true”发送请求（对于 AngularJS 那是：$http(url, withCredentials:true).get()）

太棒了！但考虑阅读 git 教程，您可能需要指定一些具体的来源而不是“ALLOW_ALL”。

注意：git README 文件指出（不正确），Django

我不适用于 django 2.1.4 和 django-cors-headers 2.4.0，它们都是撰写本文时的最新版本。

【参考方案2】：

就我而言，我只是忘记在 REST API URL 的末尾添加一个斜杠。 IE， 我有这个：

http://127.0.0.1:8000/rest-auth/login

而不是这个：

http://127.0.0.1:8000/rest-auth/login/

【讨论】：

非常感谢。

这也解决了我的问题...不敢相信我做到了。

什么！！我花了将近 2 天的时间试图弄清楚这一点！谁能解释为什么会这样？非常感谢！！

这也解决了我的问题，真是太疯狂了。确实没有指向该方向的错误消息

【参考方案3】：

您的前端和后端位于不同的端口上，这意味着您的 ajax 请求受到跨域安全性的约束。

您需要设置后端以接受来自不同来源（或只是不同端口号）的请求。

尝试阅读CORS，更具体地查看django cors headers

【参考方案4】：

如果使用 django 作为后端，你需要做以下 6 件事：

确保你在 virtualenv 中，然后 'pip install django-cors-headers'

在 settings.py 的 INSTALLED-APPS 部分添加以下内容： 'corsheaders'，

在 settings.py 的 MIDDLEWARE 部分添加以下内容： 'corsheaders.middleware.CorsMiddleware', 'django.middleware.common.CommonMiddleware',

在 settings.py 底部添加以下任一内容：CORS_ORIGIN_ALLOW_ALL = True 或

CORS_ORIGIN_WHITELIST = [
'http://localhost:3000',
'http://127.0.0.1:3000'
]

使用 CORS_ORIGIN_WHITELIST 时，请使用 GET 或 POST 请求来自的前端应用的 URL。

另一个问题是确保指向 django 的 URL 以斜杠结尾。

【讨论】：

非常感谢，最后一点真的很有帮助

【参考方案5】：

如果django-cors-headers 没有解决问题，请尝试手动添加Access-Control-Allow-Origin，如下所示：

@api_view(['GET'])
def swanger(request):
  resutl = 'a': 1
  resp = JsonResponse(resutl)
  resp['Access-Control-Allow-Origin'] = '*'
  return resp  

【参考方案6】：

我遇到了同样的问题。

user3785412 的回答会起作用。但是，由于浏览器缓存，第一次它可能无法直接工作。在失去希望之前尝试其他浏览器或清除缓存。

我在 Heroku 上托管了 Django 2 中的 API 服务器，在 Firebase 上托管了 Angular 7 客户端。 我根据 user3785412 对 settings.py 进行了所有更改，但仍然无法正常工作，浪费了将近 3 个小时。然后在帖子中发现缓存可能是问题。在 chrome 中打开，瞧！

希望这会有所帮助！ （我的第一个答案，请放轻松）

【参考方案7】：

我在 3 种情况下观察到此错误：

当 URL 不以 / 结尾时。 当 URL 包含斜杠时，例如 // 或 ///。 当我的服务器不工作时。但是开机后就正常了。

【讨论】：

天哪，第 1 点是主要问题，我花了几个小时解决这个问题，为什么一切都不适合我

【参考方案8】：

在我的情况下，它是 localhost:8000 而 127.0.0.1 是预期的......在我的浏览器中将 localhost 更改为 127.0.0.1 就可以了

【参考方案9】：

在中间件类中添加以下行

'corsheaders.middleware.CorsPostCsrfMiddleware'

所以总体实现将是：

INSTALLED_APPS = (
    ...
    'corsheaders',
    ...
)

MIDDLEWARE_CLASSES = (
    ...
    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.common.CommonMiddleware',
    'corsheaders.middleware.CorsPostCsrfMiddleware'

    ...
)

CORS_ORIGIN_ALLOW_ALL = True   

查看下方documentaion 了解更多信息

【讨论】：

以上答案重复？

【参考方案10】：

老问题，但我在任何地方都没有看到这个对我有用的解决方案。所以希望这对某人有帮助。

只有在合作伙伴站点的服务器通过其响应标头允许的情况下，此上下文中的跨域请求才可能发生。

通过在响应中设置以下标头，我可以在 Django 没有任何 CORS 中间件的情况下使用它：

response["Access-Control-Allow-Origin"] = "requesting_site.com"
response["Access-Control-Allow-Methods"] = "GET"
response["Access-Control-Allow-Headers"] = "requesting_site.com"

*** 上的大多数答案似乎都提到了第一个，但没有提到后两个。我刚刚确认它们都是必需的。您需要根据框架或请求方法（GET、POST、OPTION）的需要进行修改。

附言您可以尝试"*" 而不是"requesting_site.com" 进行初始开发以使其正常工作，但允许每个站点访问将是一个安全漏洞。工作后，您可以将其限制为您的请求站点，以确保您没有任何格式错误。

【参考方案11】：

我使用的是 python 2.7，由于某些原因，我无法更改 python 版本 到第 3 版，我花了 3 个小时才找到解决方案：

response =  HttpResponse(json.dumps(result), content_type="application/json")
response["Access-Control-Allow-Origin"] = '*'
response["Access-Control-Allow-Methods"] = 'GET,PUT, OPTIONS'
response["Access-Control-Max-Age"] = '1000'
response["Access-Control-Allow-Headers"] = 'X-Requested-With, Content-Type'
return response

【参考方案12】：

将redirect: 'follow' 添加到客户端的标头中

var requestOptions = 
  method: 'POST',
  headers: myHeaders,
  body: raw,
  redirect: 'follow'
;

fetch("http://www.example.com/auth/token/login/", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));