javascript - jQuery ajax 与 ES6 Promise

Question

我正在尝试使用 ES6 Promise 通过 jQuery 发出发布请求:

我有一个功能:

getPostPromise(something, anotherthing) {
  return new Promise(function(resolve, reject) {
    $.ajax({
      url: someURL,
      type: 'post',
      contentType: 'application/json; charset=utf-8',
      data: JSON.stringify(
        something: something,
        anotherthing: anotherthing
      }),
      dataType: 'json',
      success: resolve,
      error: reject
    });
  });
}

我这样调用它:

getPostPromise(
  'someFooStuff',
  'someBarStuff'
).then(
  function(returnedData) {
    console.log("Good: ", returnedData);
  },
  function(responseObject) {
    console.log("Bad: ", responseObject);
  }
).catch(
  function(errorThrown) {
    console.log("Exception: ", errorThrown);
  }
);

我的服务器正在按预期返回响应，请求正文采用 JSON 格式，但我的控制台输出是:

Good: undefined

为什么我没有得到返回的数据？

感谢任何人/所有人的帮助。

--- 更新编辑 ---

我已经将我的js减少到只有:

import $ from 'jquery';
$.get('http://localhost:8008/api/user')
  .done(function(data) {
    console.log(data);
  });

我的输出仍然是未定义的。如果我在网络选项卡中打开请求，我可以看到带有正确数据的响应对象。发出请求，我的服务器很高兴并响应，结果显示在我的浏览器中，但完成的数据参数未定义。我被难住了。

--- 更新 2 - 找到解决方案 ---

我发现问题出在使用:https://github.com/jpillora/xdomain绕过 CORS。看起来该库以某种方式搞砸了传回值。我已经删除了它，并将正确实现 CORS，让不支持它的浏览器见鬼去吧。

Answer 1

jQuery Ajax 方法返回 Promise 本身，您根本不需要包装它们。

但是为了与 ES6 Promise API 保持一致，您当然可以这样做。

更新 jQuery 3.0+ 实现 the Promise/A+ API ，所以没有理由再用现代 jQuery 包装任何东西。阅读the peculiarities of jQuery's promise implementation prior to version 3.0 .

对于 3.0 之前的 jQuery 版本，我会比你更多地解耦它:

function ajax(options) {
  return new Promise(function (resolve, reject) {
    $.ajax(options).done(resolve).fail(reject);
  });
}

和

ajax({
  url: someURL,
  type: 'post',
  contentType: 'application/json; charset=utf-8',
  data: JSON.stringify({
    something: something,
    anotherthing: anotherthing
  })
}).then(
  function fulfillHandler(data) {
    // ...
  },
  function rejectHandler(jqXHR, textStatus, errorThrown) {
    // ...
  }
).catch(function errorHandler(error) {
  // ...
});