Fetch API for Django POST requests

Question

我正在尝试从React/Redux/Django web应用程序中删除jQuery，并将$.ajax方法替换为Fetch API。我或多或少地让我所有的 GET 请求都工作正常，我似乎能够点击我的 POST 请求，但我似乎无法以实际将我的 POST 数据放入 Djangorequest.POST对象的方式格式化我的请求。每次我点击/sign_in 视图时，request.POST对象都是空的。我的整个应用程序的后端都是围绕 Django 表单构建的(没有 Django 模板，只有 React 控制的组件)，我真的不想重写我所有的视图来使用request.body或request.data。

以下是我认为相关的所有代码，如果还有更多有用的代码，请告诉我：

这是我用来构建完整的 POST 数据并附加 CSRF 令牌的柯里函数：

const setUpCsrfToken = () => {
const csrftoken = Cookies.get('csrftoken')
return function post (url, options) {
const defaults = {
'method': 'POST',
'credentials': 'include',
'headers': {
'X-CSRFToken': csrftoken,
'Content-Type': 'application/x-www-form-urlencoded'
}
}
const merged = merge(options, defaults)
return fetch(url, merged)
}
}
export const post = setUpCsrfToken()

这是我从 React 应用程序中使用的 API 方法：

export const signIn = data => {
return post('/api/account/sign_in/', data)
}

最初打包在React 应用程序本身中的数据就像一个带有字符串值的对象一样简单：

{
email: '[e-mail]',
password: 'password
}

我看过这些问题，发现它们名义上很有帮助，但我无法为自己综合一个答案，考虑到我认为是 Django 的一些复杂性：

• 使用 Fetch API 的 POST 请求？
• 将 jquery ajax POST 请求更改为 fetch api POST
• 将 JavaScript 对象转换为 URI 编码的字符串
• 有没有更好的方法将 JSON 数据包转换为查询字符串？

谢谢！

Answer 1

您必须设置适当的X-Requested-With标头。 jQuery在后台执行此操作。

X-Requested-With: XMLHttpRequest

因此，在您的示例中，您需要以下内容：

const setUpCsrfToken = () => {
const csrftoken = Cookies.get('csrftoken')
return function post (url, options) {
const defaults = {
'method': 'POST',
'credentials': 'include',
'headers': new Headers({
'X-CSRFToken': csrftoken,
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
'X-Requested-With': 'XMLHttpRequest'
})
}
const merged = merge(options, defaults)
return fetch(url, merged)
}
}