Django与React跨端口时RTK Query未自动携带Session ID的问题咨询

这是正常行为，浏览器的同源策略会限制跨域请求自动携带Cookie（包括存储Session ID的Cookie），所以跨端口部署时，请求默认不会带上Session ID，Django每次都会生成新的会话。

调整方法分两步：

1. 配置Django允许跨域携带凭证 #

首先安装django-cors-headers包处理跨域：

pip install django-cors-headers

然后修改Django项目的settings.py：

• 在INSTALLED_APPS中添加：

  INSTALLED_APPS = [
      # ... 其他应用
      'corsheaders',
  ]
  

• 在MIDDLEWARE中添加（需放在django.middleware.common.CommonMiddleware之前）：

  MIDDLEWARE = [
      'corsheaders.middleware.CorsMiddleware',
      # ... 其他中间件
      'django.middleware.common.CommonMiddleware',
  ]
  

• 添加跨域核心配置：

  # 允许前端所在的源
  CORS_ALLOWED_ORIGINS = [
      "http://localhost:3000",
  ]
  # 允许请求携带凭证（Cookie）
  CORS_ALLOW_CREDENTIALS = True
  

2. 配置RTK Query的fetchBaseQuery携带凭证 #

修改RTK Query的baseQuery配置，添加credentials: 'include'选项，告诉浏览器跨域请求时携带Cookie：

baseQuery: fetchBaseQuery({ 
  baseUrl: 'http://localhost:8000/api',
  credentials: 'include', // 关键配置
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json',
    'X-CSRFToken': Cookies.get('csrftoken')
  }
})

额外检查（可选） #

如果仍有问题，确认Django的Session Cookie设置：
在settings.py中添加或修改：

# 开发环境用http，无需开启Secure；生产环境用https时需设为True
SESSION_COOKIE_SECURE = False
# 跨域场景下SameSite设为Lax（localhost用http无法使用None）
SESSION_COOKIE_SAMESITE = 'Lax'

内容的提问来源于stack exchange，提问作者Leonid