JavaScript中async/await未等待$.get异步请求返回结果问题求解

问题根源 #

你现在的核心问题是：async/await 只能等待状态变更的Promise对象，你当前的写法存在两个错误：

1. check_saved_url 虽然声明为async，但内部使用回调形式调用$.get，函数执行完会直接返回，不会等待异步请求完成，await 拿到的只是默认的空Promise结果
2. 回调函数内部的return仅作用于回调本身，无法将结果传递到check_saved_url的外层返回值，等于你写的返回逻辑完全没有生效

修复代码 #

jQuery的$.get本身已经实现了Promise接口，直接改用await写法替代回调即可：

async function check_saved_url() {
  // 等待第一个请求返回，拿到ip信息
  const response = await $.get("https://ipinfo.io/json", "jsonp");
  const current_ip = response.ip;
  const location_here = response.country;
  
  const ajax_get_url_prefix = base_url + 'getDomain.php?ip=';
  const key_ip = current_ip + '@@@' + domain_permanent;
  const url = ajax_get_url_prefix + key_ip;
  
  // 等待第二个请求返回
  const data = await $.get(url);
  console.log("Data: " + data + "\nStatus: " + status);
  if (data.includes('0 results')) {
    return 'unknown';
  } else {
    return data;
  }
}

const func1 = async() => {
  return await check_saved_url();
}

const func2 = async() => {
  let domain_preference = '';
  domain_preference = await func1();
  console.log("domain_preference: ",domain_preference);
}
func2();

修改说明 #

• 移除了所有$.get的回调参数，改用await直接接收异步请求的返回结果
• 所有异步操作都增加了await声明，check_saved_url返回的Promise会等待两个请求全部完成后才会变更状态，后续的await逻辑可以正常拿到返回值
• 将原回调内的判断逻辑直接挪到外层，作为check_saved_url的返回值，外层可以直接拿到对应结果

内容的提问来源于stack exchange，提问作者pullidea-dev