如何解决基于axios请求响应发起后续请求的时序异常问题

首先要明确：你的代码里第二个请求并不会在第一个请求结束前被调用——then回调本身就是第一个请求成功完成后才会执行的。问题出在ScraperAPI的异步任务机制：第一个请求返回的statusUrl只是用来查询抓取任务状态的接口，此时抓取任务可能还在处理中，直接请求它拿不到最终的抓取结果。

解决方法是通过轮询statusUrl，直到任务状态变为完成，再提取最终的抓取数据：

// 第一个请求：创建抓取任务
axios.post("https://async.scraperapi.com/jobs", {
  apiKey: KEY,
  url: URL,
}).then(async (response) => {
  await getThePrice(response.data.statusUrl);
});

// 轮询任务状态直到完成，再获取结果
async function getThePrice(statusUrl) {
  let taskStatus;
  do {
    // 请求状态接口
    const statusResponse = await axios.get(statusUrl);
    taskStatus = statusResponse.data.status;
    
    // 如果任务未完成，等待1秒后再查询
    if (taskStatus !== "finished") {
      await new Promise(resolve => setTimeout(resolve, 1000));
    } else {
      // 任务完成，输出最终抓取结果
      console.log(statusResponse.data.response);
    }
  } while (taskStatus !== "finished");
}

也可以用全async/await的写法让代码逻辑更清晰：

async function startScraping() {
  // 第一步：创建抓取任务
  const createTaskResponse = await axios.post("https://async.scraperapi.com/jobs", {
    apiKey: KEY,
    url: URL,
  });
  const statusUrl = createTaskResponse.data.statusUrl;

  // 第二步：轮询任务状态
  let taskStatus;
  do {
    const statusResponse = await axios.get(statusUrl);
    taskStatus = statusResponse.data.status;
    
    if (taskStatus !== "finished") {
      await new Promise(resolve => setTimeout(resolve, 1000));
    } else {
      console.log("抓取结果：", statusResponse.data.response);
    }
  } while (taskStatus !== "finished");
}

// 启动整个抓取流程
startScraping();

关键说明 #

• ScraperAPI的异步任务需要时间处理目标页面，statusUrl接口返回的status字段会标识任务状态，常见值包括pending（待处理）、running（处理中）、finished（完成）
• 轮询时设置合理的间隔时间（比如1秒），避免过于频繁请求导致被限流
• 可根据需求添加超时逻辑，防止因任务异常导致无限轮询

内容的提问来源于stack exchange，提问作者AmrElgendy