【发布时间】:2021-08-11 04:58:16
【问题描述】:
老实说,这对我的自我来说是一个灾难性的打击,我还没有想到这一点——到目前为止花了 6 个小时......
我有一个在 Django Rest Framework 后端运行的 React 应用程序。对于密码重置功能,我使用 Django 的内置视图 (auth_views.PasswordResetView)。我在 React 中有一个表单,它接受电子邮件并发送发布请求以重置用户密码。我在邮递员中发送数据的方式是:
Url: http://192.168.0.85:8000/reset_password
Body: {'email': 'blabla@bla.com'}
Headers: {'X-CSRFToken': OGH9iUEtGPqntMYifQ5kiin2ufV9tK39tbp9Wmh6tLST0DXCXSkY8mOvyq5AjjnZ}
...它就像一个魅力!直到我尝试在 React 中使用 axios 复制相同的确切调用:
axios.defaults.xsrfCookieName = 'csrftoken';
axios.defaults.xsrfHeaderName = 'X-CSRFToken';
axios.post('http://192.168.0.85:8000/reset_password',{'email': 'blabla@bla.com'},{headers}))
...这会导致来自后端的此消息出现 403 错误:
WARNING:django.security.csrf:Forbidden (CSRF cookie not set.): /reset_password
我花了 6 个小时进行谷歌搜索和试验,但终其一生都无法弄清楚为什么 Axios 请求与 Postman 请求有任何不同。这个问题特别令人恼火,因为@csrf_exempt 不适用于 django 内置视图。
以下是 Postman 中成功请求的标头:
X-CSRFToken: OGH9iUEtGPqntMYifQ5kiin2ufV9tK39tbp9Wmh6tLST0DXCXSkY8mOvyq5AjjnZ
User-Agent: PostmanRuntime/7.28.0
Accept: */*
Postman-Token: 91cbbfe7-b434-45fc-97ec-7d442c091070
Host: 192.168.0.85:8000
Accept-Encoding: gzip, deflate, br
Connection: keep-alive
Content-Type: application/x-www-form-urlencoded
Content-Length: 33
Cookie: csrftoken=gawXPEZQfN4qC4aKPhiIvK5qpjvkp4WCVFeXt6Ct2JwW9V94xjxmlOwTtuFLfDgs
...以及来自 React 使用 Axios 的失败请求:
baseURL: "http://192.168.0.85:8000"
data: "{\"email\":\"blabla@bla.com\"}"
headers:
Accept: "*/*"
Authorization: ""
Content-Type: "application/json"
X-CSRFToken: "udd4yAGCJuTxw95kCdHYwwEQmGwu1bwxqEQjZhI56v1qWY143S4IPCrUSvk9xkV8"
__proto__: Object
maxBodyLength: -1
maxContentLength: -1
method: "post"
timeout: 0
transformRequest: [ƒ]
transformResponse: [ƒ]
url: "/reset_password"
validateStatus: ƒ validateStatus(status)
xsrfCookieName: "csrftoken"
xsrfHeaderName: "X-CSRFToken"
__proto__: Object
isAxiosError: true
【问题讨论】:
标签: python reactjs django axios