Django跨域问题

简介

由于本站以及很大部分项目都是前后端分离模式，前后端所配置的域名并不相同，所以会受到浏览器的同源策略限制，导致不能正确的请求资源，以下内容先用最简单的方法实现Django后端的跨域问题解决，后续原理再慢慢补充

实现跨域（省流版）

安装core依赖

shell 复制代码

pip install django-cors-headers

声明app
在settings.py INSTALLED_APPS元组中添加 corsheaders

python 复制代码

INSTALLED_APPS = [   
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
		...
    'corsheaders',
]

引入中间件

python 复制代码

MIDDLEWARE = [  
 'corsheaders.middleware.CorsMiddleware',  
 'django.middleware.security.SecurityMiddleware',  
 ...  
]

中间件位置问题

'corsheaders.middleware.CorsMiddleware'这一行，位置尽量靠前些，这是网上比较推荐的做法，所以我个人将它摆放在第一排

添加CORS配置

python 复制代码

# 跨域配置

CORS_ALLOW_CREDENTIALS = True
# 开发环境可以用，生产环境强烈不建议
CORS_ORIGIN_ALLOW_ALL = True # 允许所有源访问，仅在开发时使用 

# 生产环境建议这样试试
CORS_ORIGIN_ALLOW_ALL = False
CORS_ALLOWED_ORIGINS = [  
    "http://example.com",  
    "https://www.example.com",  
] 

CORS_ALLOW_METHODS = (
    'DELETE',
    'GET',
    'OPTIONS',
    'PATCH',
    'POST',
    'PUT',
    'VIEW',
)

# 请求头配置
CORS_ALLOW_HEADERS = (
    'accept',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
    'token'
)

以上是DRF跨域的基本实现，和网上大部分参考资料都差不太多，以下是一些理论上的东西，如果只是为了解决项目问题那不用看，比较干巴

一些理论上的东西

什么是CORS

CORS（Cross-Origin Resource Sharing）是一种浏览器技术的规范，也被称为跨域资源共享。它允许浏览器向跨源服务器发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。CORS需要浏览器和服务器同时支持，所有现代浏览器都支持此功能，但老旧的浏览器（如IE9及以下版本）可能不支持或支持有限。

CORS的工作机制如下：

请求头中的Origin字段：当浏览器发出一个跨域请求时，它会在请求头中携带一个Origin字段，这个字段指明了请求的来源（协议 + 域名 + 端口）。

响应头中的CORS字段：服务器在接收到请求后，会检查请求的Origin字段，并根据其配置决定是否允许该跨域请求。如果允许，服务器会在响应头中添加相应的CORS字段，如Access-Control-Allow-Origin ，来指明哪些源可以访问该资源。

浏览器的处理：浏览器在接收到响应后，会检查响应头中的CORS字段，并根据其值决定是否接受响应。如果请求的源被允许，则浏览器会接受响应并继续处理；否则，浏览器会抛出一个错误，并阻止响应的进一步处理。

CORS的两种请求类型包括简单请求和非简单请求（也称为预检请求）。对于简单请求，浏览器直接发出CORS请求；对于非简单请求，浏览器会先发出一个OPTIONS请求（预检请求），询问服务器是否允许这个跨域请求。如果服务器允许，浏览器才会发出实际的跨域请求。

综上所述，CORS是一种重要的浏览器安全机制，它允许前端应用安全地访问后端API，实现跨域的数据交换和功能实现。在DRF等Web框架中，通过配置CORS策略，可以灵活地控制哪些源可以访问后端资源，从而保护应用的安全性。

个人网站链接：www.simplespace.site