web-dev-qa-db-ja.com

フェッチとAjax呼び出し

典型的なAJAXとFetch APIの違いは何ですか？

このシナリオを考慮してください：

function ajaxCall(url) {
  return new Promise(function(resolve, reject) {
    var req = new XMLHttpRequest();
    req.open('GET', url);

    req.onload = function() {
      if (req.status == 200) {
        resolve(req.response);
      } else {
        reject(Error(req.statusText));
      }
    };
    req.onerror = function() {
      reject(Error("Network Error"));
    };
    req.send();
  });
}

ajaxCall('www.testSite').then(x => {
  console.log(x)
}) // returns html of site

fetch('www.testSite').then(x => {
  console.log(x)
}) // returns object with information about call

これはfetch呼び出しが返すものです：

Response {type: "cors", url: "www.testSite", status: 200, ok: true, statusText: "OK"…}

なぜ異なるものが返されるのですか？

fetchが通常のAJAX呼び出しと同じものを返す方法はありますか？

javascriptajaxfetch-api
36
Darlyn

AjaxCallがXMLHttpRequestオブジェクトからresponseTextを返しています。フィルターで除外しています。

フェッチコードで応答テキストを読み取る必要があります。

_fetch('www.testSite').then( x => { console.log(x.text()); } )
_

x.json()またはx.blob()を使用することもできます

7
epascarello