Django 解决CORS跨域问题的方法

产生跨域问题的原因

Cross-Origin Resource Sharing（CORS） 跨域问题，在前后端后离项目，selenium ， playweight 自动化测试代码中经常遇到。而使用 python request, curl, postman 等非浏览器代码发送请求时则不存在这个问题。
这是因为浏览器的同源策略，为了隔离潜在的恶意文件，为了防御来自歪门邪道的攻击，浏览器限制了从同一个源加载的文档或脚本与来自另一个源的资源进行交互。
使用Ajax, Axios 发送request 时，除非当前主机域名，端口号与服务程序的域名端口号都相同，否则就会出现CORS跨域错误，无法收到response. 即使在javascript 脚本是在本机浏览器运行，而django服务也是跑在http://localhost:8000 上，仍然会出现CORS错误。

在django服务器侧，有两种方法解决CORS问题

解决方法1：通过自定义中间件修改request头部

在myproject/app/ 目录下，新建1个 cors.py 文件

class CorsMiddleware(object):
    def process_response(self, req, resp):
        response["Access-Control-Allow-Origin"] = "*"
        return response

这个类用于为每个django request添加1个Access-Control-Allow-Origin:* 参数，但需要先添加到 settings.py 的 middleware classes:的列表中，

MIDDLEWARE_CLASSES = (
    #...
    'app.CorsMiddleware' 
)

你也可以通过这个自定义中间件类添加更多的头部参数。

解决方法2：通过 django-cors-headers 库来实现

通过第3方库django-cors-headers 库来实现，其步骤如下

1）安装

pip install django-cors-headers

2）修改 settings.py 配置文件

添加到应用列表

INSTALLED_APPS = (
    ##...
    'corsheaders'
)

添加中间件列表 corsheaders.middleware.CorsMiddleware

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'corsheaders.middleware.CorsMiddleware',
    ......

然后，添加下面配置允许所有 domain 访问

CORS_ORIGIN_ALLOW_ALL = True

或者，允许某些域访问

CORS_ORIGIN_ALLOW_ALL = False
# 允许域名加入白名单
CORS_ORIGIN_WHITELIST = (
    'http//:localhost:8000',
)

说明

在测试环境中，可以允许所有domain来访问，以避免 CORS问题，前后端分离项目在生产环境下，通常应该部署在同域下，
如果确实需要跨域，则将前端域名添加到白名单 CORS_ORIGIN_WHITELIST配置项中，禁止其它域访问。