Heroku部署后Cookie在开发者工具不可见的问题求助

1. 修正Cookie的HttpOnly属性（核心问题） #

你当前设置refreshToken的代码未显式指定HttpOnly参数，而Django的set_cookie默认值为True——这会导致Cookie被标记为仅HTTP可访问，浏览器DevTools的Application面板不会显示，JS也无法读取（包括js-cookie库）。

修改代码，显式关闭HttpOnly：

response = HttpResponse()
response.set_cookie(
    key='refreshToken',
    value=refreshToken,
    max_age=12 * 60 * 60,
    samesite="None",
    secure=True,
    httponly=False  # 必须设为False，让前端JS可读取
)

针对CSRF Token，同样需要在Djangosettings.py中关闭其HttpOnly属性：

CSRF_COOKIE_HTTPONLY = False

2. 完善Django跨域与Cookie全局配置 #

在settings.py中补充以下配置，适配Heroku的跨域与SSL环境：

# CSRF相关配置
CSRF_COOKIE_SECURE = True
CSRF_COOKIE_SAMESITE = 'None'
CSRF_TRUSTED_ORIGINS = ['https://你的前端Heroku完整域名']  # 例：https://my-react-app.herokuapp.com

# 会话Cookie（若用到）
SESSION_COOKIE_SECURE = True
SESSION_COOKIE_SAMESITE = 'None'

# 识别Heroku反向代理的SSL请求
SECURE_PROXY_SSL_HEADER = ('HTTP_X_FORWARDED_PROTO', 'https')

# 跨域凭证允许
CORS_ALLOW_CREDENTIALS = True
CORS_ALLOWED_ORIGINS = ['https://你的前端Heroku完整域名']

注意：CSRF_TRUSTED_ORIGINS和CORS_ALLOWED_ORIGINS必须填前端的完整HTTPS域名，不能用通配符。

3. 验证Heroku环境的SSL与路由 #

• 确保前后端均使用HTTPS协议发起请求，无混合内容（前端页面或资源不能用HTTP加载），否则浏览器会阻止Cookie正常存储。
• 若使用自定义域名，确认域名的SSL证书已生效，无证书信任问题。

4. 浏览器端验证与缓存清理 #

• 清除浏览器所有缓存与Cookie，避免旧配置干扰测试。
• 在DevTools的Application面板中，切换到对应后端域名的Cookie列表查看（Cookie绑定到设置它的域名，而非前端域名）。
• 直接在控制台执行document.cookie测试，若能读取到refreshToken，再排查js-cookie库的使用逻辑；若仍无法读取，回到后端配置检查HttpOnly与跨域设置。

5. 单仓部署的配置检查 #

因为是单仓部署两个容器，需确认：

• 后端ALLOWED_HOSTS包含自身的Heroku域名。
• 部署脚本未覆盖或修改Cookie相关的配置项。

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