javascript - 如何使用Promise链接两个Ajax请求

我在ajax / promises方面遇到麻烦。我总共有两个ajax请求，第二个ajax调用依赖于第一个ajax调用返回的数据。

我的第一个ajax调用查找#search值的纬度，经度和国家/地区代码。
我的第二个ajax调用找到了该城市的天气，但是API URL取决于我的第一个ajax调用返回的纬度，经度和国家/地区代码。因此，直到第一个ajax调用完成后，才能开始第二个ajax调用。

我的逻辑是为var ajax1分配了一个promise，并且var ajax2在ajax1.then（）检查ajax1的promise被解决后启动。然后ajax2运行并返回另一个promise。最终ajax2.done在检查ajax2的诺言是否得到解决之后启动，然后启动我的successWeatherFunction（）。

我的问题是ajax2.done无法正常工作，因为console.log（“ test”）没有显示在控制台上。较早的两个console.logs，console.log（info）和console.log（weatherApiUrl）正常工作。

谢谢！

$("#search").keypress(function(event) {
if (event.which === 13) {
  var searchCity = $("#search").val();
  var jsonURL = "http://autocomplete.wunderground.com/aq?query=" + searchCity + "&cb=?"
  var ajax1 = $.getJSON(jsonURL);
  var ajax2 = ajax1.then(function(data) {
    var info = [];
    info.push(data["RESULTS"][0]["name"]);
    info.push(data["RESULTS"][0]["c"]);
    info.push(data["RESULTS"][0]["lat"]);
    info.push(data["RESULTS"][0]["lon"]);
    console.log(info);
    var searchLat = info[2];
    var searchLng = info[3];
    var countryCode = info[1];
    if (countryCode === "US") {
      var weatherApiUrl = "https://api.forecast.io/forecast/{APIKEY}/" + searchLat + "," + searchLng + "?exclude=minutely" + "&callback=?";
    } else {
      var weatherApiUrl = "https://api.forecast.io/forecast/{APIKEY}/" + searchLat + "," + searchLng + "?exclude=minutely" + "?units=si" + "&callback=?";
      console.log(weatherApiUrl);
    }
    return $.getJSON(weatherApiUrl);
  });
  ajax2.done(function(data){
    console.log("test");
    successCityWeather(data);
  });

最佳答案

您的代码使用then和done。 done是古老的Promise jQuery语法，因此您只能使用then。

以下代码对我有用：

$(function() {
  $.get('/test').then(function() {
    console.log('First request end');
    return $.get('/test');
  }).then(function() {
    console.log('second request end');
  });
});

但是在您的情况下，您的请求之一可能会失败。为then提供第二个参数以记录错误：

$.getJSON('...').then(function(data) {
    console.log('success', data);
}, function(data) {
    console.log('fail', data);
});