Javascript 将jquery ajax POST请求更改为fetch api POST

我有一些json数据，我一直在使用$.ajax发布到API，但我想将其更新为使用fetch API。然而，我似乎有它的设置获取API请求最终返回403，所以我一定是错过了一些东西，但我无法解决它

Ajax请求：

$.ajax({
        type: 'POST',
        url: url,
        data: {
            'title': data.title,
            'body': data.body,
            'csrfmiddlewaretoken': csrf_token,
            'request_json': true
        },
        success: function (data) {
            console.log(data)
        }
    });

获取尝试（多个尝试之一）：

我尝试过使用各种不同的标题、内容编码和将数据作为表单数据发送，方法如下：

let form_data = new FormData();
form_data.append( "json", JSON.stringify( payload ) );

let request = new Request(url, {
    method: 'post',
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded'
    },
    body:  form_data
});
...

任何帮助都将是伟大的，如果你需要任何更多的信息让我知道

---

谢谢

，以移植现有的<代码> jQuery .Ajax < /Cord>请求取回，您需要考虑jQuery始终为您提供Cookie，但是<代码> FETCH/<代码>没有。

（我的重点）：

请注意，fetch规范与jQuery.ajax（）主要有两种不同之处，请记住：
-从fetch（）返回的承诺不会在HTTP错误状态[…]下拒绝
-默认情况下，fetch不会从服务器发送或接收任何Cookie，如果站点依赖于维护用户会话（要发送Cookie，必须发送凭据标头），则会导致未经验证的请求。

---

编辑：此后等级库已更改，因此这不再是问题：

自2017年8月25日起规范将默认凭据策略更改为同一来源。Firefox自61.0b13以来发生了变化

因此，以下内容（返回原始答案）仅适用于“较旧”的浏览器

感谢David Richmond的评论：）

---

因此，您得到的是因为您的API很可能依赖cookie进行身份验证/授权（即使在您发送

csrfmiddlewaretoken

的情况下，服务器端框架可能仍然需要cookie——猜猜Django？）

要解决此问题，（*），如下所示：

let request = new Request(url, {
    method: 'post',
    credentials: 'same-origin',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(payload)
});

（*）凭证的有效选项有：

• 省略

  ：永远不要发送cookie。这是默认设置（也是您的问题）

• 同一来源

  ：仅当URL与调用脚本位于同一来源时发送cookie

• 包括

  ：始终发送cookie，即使是跨来源呼叫
你说：
及
JSON编码与WWW表单编码不同

---

你也试过了
FormData对象转换为多部分MIME
多部分MIME也不同于WWW表单编码数据
JSON嵌套在多部分MIME中，更不用说了

---

---

描述如何将对象（

payload

）转换为表单编码字符串。
为什么不使用标题：

headers:{'Content Type'：'application/json'}

？我尝试了这个方法，但似乎不起作用。我会再试一次，也许是别的什么东西把它搞砸了@sideshowbarker-工作（jQuery）代码使用www表单编码。没有任何迹象表明服务器支持JSON格式的请求。注意：规范在2017年更改，现代浏览器现在默认为

同源

。谢谢David，相应地修改了答案：）

let request = new Request(url, {
    method: 'post',
    credentials: 'same-origin',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(payload)
});

'Content-Type': 'application/x-www-form-urlencoded'

 body:  JSON.stringify( payload )

form_data.append( "json", JSON.stringify( payload ) );