配置 django-cors-headers 不起作用

配置 django-cors-headers 不起作用

问题描述

在前后端分离开发过程中，因跨域问题导致前端请求失败，使用django-cors-headers做跨域资源共享后，前端依然因跨域请求失败。
前端使用Vue框架，报错内容大致如下：
Access to XMLHttpRequest at ‘http://192.168.1.169:8000/school/stu’ from origin ‘http://localhost:8080’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

可能的错误原因

1. 检查app配置，是否加入了 corsheaders

INSTALLED_APPS = [
    ...,
    "corsheaders",
    ...,
]

2. 检查中间件顺序，至少应当放在CommonMiddleware之前（中间件按照先后顺序判定，可以尽可能往高放）

MIDDLEWARE = [
    ...,
    "corsheaders.middleware.CorsMiddleware",
    "django.middleware.common.CommonMiddleware",
    ...,
]

3. 版本错误（最可能的情况）

做如下操作

1.在settings.py中，找到CORS_ORIGIN_ALLOW_ALL = True
2.将CORS_ORIGIN_ALLOW_ALL 改为 CORS_ALLOW_ALL_ORIGINS

原因

本人使用django-cors-headers 3.11.0 版本
以下为pycharm界面，pip list 也可以看。

由django-cors-headers库官方文档可知

之前的这个设置叫做 CORS_ORIGIN_ALLOW_ALL，现另作他用，新名称优先。
如果按照旧版本进行配置，将导致配置不成功，也不会出现报错，难以排查。

一劳永逸？

大部分时候，我们不希望所有的请求源都能够访问后台数据。
更好的做法是：配置白名单！
将CORS_ALLOW_ALL_ORIGINS = bool 配置项，改为如下代码

CORS_ALLOWED_ORIGINS = [
    "https://example.com",
    "https://sub.example.com",
    "http://localhost:8080",
    "http://127.0.0.1:9000",
]

同样的它也改了名字。以前叫CORS_ORIGIN_WHITELIST。

如果存在大量的请求源需要配置，你不会喜欢将他们一条一条打出来的。

当然，此配置支持正则匹配。此前称为CORS_ORIGIN_REGEX_WHITELIST。

现在要这样写

CORS_ALLOWED_ORIGIN_REGEXES = [
    r"^https://\w+\.example\.com$",
]

一点废话

以上是本人的第一篇博客，若有谬误，望各位同学不吝赐教。