Django跨域请求无法传递Cookie

在Django和Vue前后端分离项目中遇到跨域请求时,Cookie无法正常传递。解决方法包括在Django settings.py文件中配置CORS以允许跨域,并在axios请求设置中允许浏览器处理Cookie。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

问题
在使用 Django + Vue 进行前后端分离开发时,发现在跨域访问情况下,后台 HttpResponse 在使用 set_cookie 方法后,浏览器无法获取 Cookie。

解决方法

  1. Django 端使用 django-cors-headers 解决跨域问题,修改 settings.py 文件。具体方案:
    Flask和Django中解决跨域请求问题
  2. 对 axios 进行设置,允许浏览器设置或获取Cookie。
axios.defaults.withCredentials = true;

Django 之 Cookie 操作

from django.http import HttpResponse

# 设置 Cookie
response 
### Django 中配置 CORS 请求头 为了使 Django 应用程序能够处理来自不同源的请求,可以通过安装 `django-cors-headers` 来简化 CORS 的配置过程。该库提供了方便的方法来管理资源共享 (CORS) 设置。 #### 安装 django-cors-headers 首先,在项目环境中安装 `django-cors-headers`: ```bash pip install django-cors-headers ``` 接着更新项目的 `settings.py` 文件以包含此中间件并应用必要的配置选项[^1]。 #### 配置 settings.py 在 `INSTALLED_APPS` 列表中加入 `'corsheaders'`: ```python INSTALLED_APPS = [ ... 'corsheaders', ... ] ``` 同样地,在 `MIDDLEWARE` 或者旧版本中的 `MIDDLEWARE_CLASSES` 添加如下条目: ```python MIDDLEWARE = [ ... 'corsheaders.middleware.CorsMiddleware', # 放在此处非常重要, 越靠前越好 'django.middleware.common.CommonMiddleware', ... ] ``` 注意:`CorsMiddleware` 必须放置于其他所有中间件之前,以便它可以尽早处理传入的 HTTP 请求。 #### 全局允许所有名访问 如果希望无条件接受任何来源的请求,则可以简单地将 `CORS_ORIGIN_ALLOW_ALL` 设定为 `True` : ```python CORS_ORIGIN_ALLOW_ALL = True ``` 这会使得服务器返回带有通配符 (`*`) 的 `Access-Control-Allow-Origin` 响应头部,表示允许所有的外部站点发起 AJAX 请求到当前 API 接口。 #### 白名单特定名 对于更严格的控制,可以选择只让某些可信网站通过设置白名单来进行通信。此时应该关闭全局权限并将信任的 URL 加入列表: ```python CORS_ORIGIN_ALLOW_ALL = False CORS_ORIGIN_WHITELIST = ( "http://example.com", "https://anotherdomain.org" ) # 使用正则表达式的白名单形式也可以考虑使用: # CORS_ORIGIN_REGEX_WHITELIST = ('^(https?://)?(\w+\.)?example\.com$', ) ``` 上述代码片段展示了如何定义一组被授权进行操作的具体网址集合。 #### 自定义响应头和其他参数 除了基本的支持外,还可以进一步定制哪些 HTTP 方法以及自定义请求头能参与预检请求(Preflight Request)。例如: ```python 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_EXPOSE_HEADERS = [] # 如果有额外想要暴露给前端使用的HTTP Header可在这里声明 CORS_ALLOW_CREDENTIALS = True # 是否允许发送Cookie凭证信息,默认False ``` 以上这些设定可以帮助更好地调整应用程序的行为以满足实际需求。 ### 控制器级别的解决方案 另一种解决办法是在视图函数或类上直接添加装饰器 `@cross_origin()` ,这种方式适用于只需要针对单个接口开放 CORS 访问的情况。比如: ```python from django.views.decorators.csrf import csrf_exempt from corsheaders.decorators import cross_origin @csrf_exempt @cross_origin() # 这里可以根据需要传递参数如 origins=['http://example.com'] def my_view(request): ... ``` 这种方法更加灵活,但不如全局配置那样高效和易于维护[^3]。
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值