我正在开发一个带有ajax处理程序的插件。我首先编写了ajax请求，以设置XHR对象。如下所示：

var data = new FormData();
data.append(\'post_title\', \'Hola como\');
data.append(\'action\', \'make_appointment\');

var xhr = new XMLHttpRequest();

xhr.addEventListener(\'readystatechange\', function() {
  if (this.readyState === 4) {
    console.log(this.responseText);
  }
});

xhr.open(\'POST\', \'http://wpapi.localdev/wp-admin/admin-ajax.php\');
xhr.setRequestHeader(\'Cache-Control\', \'no-cache\');

xhr.send(data);

您可以注意到，我将操作作为表单数据的一部分传递。这很好，但我想改用fetch API，因为为什么不呢。

因此我将其转换为：

let form = new FormData();
form.append(\'action\', \'make_appointment\');
form.append(\'post_title\', \'hola como estas\');

fetch(ajaxSettings.ajaxurl, {
  method: \'POST\',
  headers: {
    \'Content-Type\': \'multipart/form-data\',
    \'Cache-Control\': \'no-cache\'
  },
  body: form
})
  .then(response => {
    console.log(response);
    return response.text();
  })
  .then(response => {
    console.log(response);
  });

这不起作用，它只会抛出400个错误请求。我知道由于某些原因，操作参数没有正确发送。但是，如果我不将操作作为表单数据发送，而是将其作为url参数发送，则它可以工作，如下所示：

fetch(ajaxSettings.ajaxurl, {
  method: \'POST\',
  headers: {
   \'Content-Type\': \'application/x-www-form-urlencoded\',
   \'Cache-Control\': \'no-cache\'
  },
  body: \'?action=make_appointment\'
})

我做错了什么？我只想让它作为XHR请求工作，即将动作作为表单数据发送。请注意，WordPress端的ajax处理程序已经存在并且工作正常。

const form = new FormData();
form.append(\'action\', \'make_appointment\');
form.append(\'post_title\', \'hola como estas\');
const params = new URLSearchParams(form);

fetch(ajaxSettings.ajaxurl, {
      method: \'POST\',
      credentials: \'same-origin\',
      headers: {
       \'Content-Type\': \'application/x-www-form-urlencoded\',
       \'Cache-Control\': \'no-cache\',
      },
      body: params
    }).then(response => {
       return response.json();
    })
    .then(response => {
       // read data here
       console.log(response);
     }).catch(err => { 
       console.log(err);
     });