React调用REST API遇CORS错误，配置django-cors-headers仍未解决

你的错误提示明确指出：当请求的凭证模式为include时，响应头Access-Control-Allow-Credentials的值必须为true，但当前返回为空。这是因为你没有在Django的CORS配置中开启允许凭证的选项，同时需要补全相关配置。

解决步骤： #

1. 添加允许凭证的核心配置
   在settings.py中新增以下配置项：

   CORS_ALLOW_CREDENTIALS = True
   

   这个配置会让django-cors-headers自动在响应中添加Access-Control-Allow-Credentials: true头，匹配请求的凭证要求。

2. 修正ALLOWED_HOSTS配置
   你的请求目标是http://127.0.0.1:8000，当前ALLOWED_HOSTS = []存在潜在风险，建议修改为：

   ALLOWED_HOSTS = ['127.0.0.1', 'localhost']
   

   确保Django允许接收来自该地址的请求。

3. 确认React端的请求配置
   确保你的React请求确实启用了凭证模式：

   • 使用fetch时：

     fetch('http://127.0.0.1:8000/api/login', {
       method: 'POST',
       credentials: 'include', // 关键配置
       // 其他请求参数（如headers、body）
     })
     

   • 使用axios时：

     axios.post('http://127.0.0.1:8000/api/login', requestData, {
       withCredentials: true // 关键配置
     })
     

4. 重启Django开发服务器
   修改配置后必须重启服务器，确保新的CORS配置生效。

完成以上步骤后，重新发起请求即可解决该CORS错误。

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