使用flutter开发webApp,后台使用Django,遇到跨域访问问题,记录一下。
Django自身不直接支持CORS,因此需要使用第三方库来处理跨域请求。最常用的库有django-cors-headers。
安装django-cors-headers
首先,你需要安装django-cors-headers。可以使用pip来安装:
pip install django-cors-headers
配置django-cors-headers
添加到INSTALLED_APPS
在你的Django项目的settings.py文件中,确保'corsheaders'在INSTALLED_APPS列表中,并且位于'django.middleware.common.CommonMiddleware'之上(或者在MIDDLEWARE设置中,如果使用的是Django 2.0及以上版本):
INSTALLED_APPS = [
# 确保 corsheaders 在 django.middleware.common.CommonMiddleware 之前
'corsheaders',
...
]
对于Django 2.0及以上版本,应该在MIDDLEWARE设置中这样配置:
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware',
...
]
配置CORS_ALLOWED_ORIGINS
在settings.py中添加CORS_ALLOWED_ORIGINS来指定哪些源可以访问你的API。例如:
CORS_ALLOWED_ORIGINS = [
"https://example.com",
"https://sub.example.com",
"http://localhost:8000",
"http://127.0.0.1:9000",
]
可选配置
你可以根据需要配置其他CORS相关的设置,例如:
CORS_ALLOW_METHODS: 允许的HTTP方法列表。
CORS_ALLOW_HEADERS: 允许的HTTP头列表。
CORS_ALLOW_CREDENTIALS: 是否允许发送Cookie。默认为False。
CORS_EXPOSE_HEADERS: 指定哪些响应头可以被浏览器访问。
示例:
CORS_ALLOW_METHODS = (
'DELETE',
'GET',
'OPTIONS',
'PATCH',
'POST',
'PUT',
)
CORS_ALLOW_HEADERS = (
'accept',
'accept-encoding',
'authorization',
'content-type',
'dnt',
'origin',
'user-agent',
'x-csrftoken',
'x-requested-with',
)
CORS_ALLOW_CREDENTIALS = True
CORS_EXPOSE_HEADERS = ('content-type',)
注意事项
确保在开发环境中正确设置了DEBUG和CORS_ALLOWED_ORIGINS,以避免在生产环境中暴露敏感数据。
在生产环境中,通常只允许特定的、可信的源访问你的API。
对于某些特定的需求,你可能还需要在视图函数中手动设置响应头,比如使用django.http.JsonResponse时设置Content-Type和Access-Control-Allow-Origin等。不过,通常使用django-cors-headers已经足够。
如果你的API使用了CSRF保护(默认情况下Django的表单和某些视图需要CSRF令牌),确保你的前端发送请求时包含了正确的CSRF令牌,或者你的API视图使用了@csrf_exempt装饰器(但这通常不推荐,因为它降低了安全性)。对于AJAX请求,你可以在前端手动发送CSRF令牌或在后端为特定的视图禁用CSRF保护。例如:
from django.views.decorators.csrf import csrf_exempt
from django.http import JsonResponse
@csrf_exempt
def my_view(request):
return JsonResponse({'message': 'This is a CORS example.'})
但在大多数情况下,使用CORS headers就足够了。