fetch API 不返回相同的 XMLHttpRequest 返回

Question

我想将 XMLHttpRequest 函数转换为获取 API。但结果不一样。

有些事情我必须做错，但我不知道是什么：/

我对 XMLHttpRequest 的承诺：

  return new Promise(function (resolve, reject) {

    let formData = new FormData($searchForm);

    if (searchTerm.length) {
      formData.append("search", searchTerm);
    }

    let request = new XMLHttpRequest();

    request.onreadystatechange = function () {
      if (request.readyState === XMLHttpRequest.DONE && request.status === 200) {
        console.log(request);
        resolve(request.responseText);
      }
    };

    request.open($searchForm.method, $searchForm.action, true);
    request.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    request.send(formData);

  });

返回（我想要的）：

XMLHttpRequest { onreadystatechange: reload/http://localhost:3000/app_dev.php/r...", 状态: 200, statusText: "OK", responseType: "", response: "{"countMessage":"No product find" }

还有我的 fetch API 函数：

function searchReload() {

  const formData = new FormData($searchForm);
  const url = $searchForm.action;
  const method = $searchForm.method;

  if (searchTerm.length) {
    formData.append('search', searchTerm);
  }

  const header = new Headers();
  header.append('X-Requested-With', 'XMLHttpRequest');

  return fetch(url, {
    method: method,
    header,
    body: formData
  }).then(function (response) {
    return response;
  });

}

searchReload()
  .then(response => {
    return console.log(response);
  });

这个函数返回：

响应{类型：“基本”，网址：“http://localhost:3000/app_dev.php/r...”， 重定向：false，状态：200，ok：true，statusText：“OK”，标题： 标头，bodyUsed: false }

有人可以帮助我吗？我不知道是什么问题，以及为什么我无法对我的回复做出 response: "{"countMessage":"No product find" } :(

感谢社区！

Answer 1

您需要拨打response.json()阅读正文：

return fetch(url, {
  method: method,
  header,
  body: formData
}).then(function (response) {
  // perhaps check the status before doing this!
  return response.json();
});

以下示例说明当您阅读正文时bodyUsed 会发生什么

fetch('https://jsonplaceholder.typicode.com/posts/1').then(function(response) {
    console.log(response.bodyUsed);
    var res = response.json();
    console.log(response.bodyUsed);
    return res;
}).then(function(json) {
    console.log(json)
});