如何在Puppeteer中waitUntil超时后仍获取页面内容与响应状态？

默认情况下，page.goto()的timeout属性会在导航超时或waitUntil条件未满足时直接抛出TimeoutError，但我们可以通过分离导航逻辑和超时控制的方式，实现超时后仍获取已加载的页面状态和内容，完全可行。

实现思路 #

核心是用Promise.race()让导航请求和自定义超时定时器并行执行：当自定义超时先触发时，跳过waitUntil的等待逻辑，直接读取当前页面的状态和内容；如果导航先完成且满足waitUntil条件，则正常返回结果。同时关闭page.goto()的默认超时，避免它提前终止导航。

具体代码实现 #

const puppeteer = require('puppeteer');

async function gotoWithSoftTimeout(url, waitUntil, timeoutMs) {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  // 启动导航，关闭默认超时，确保基础导航能完成
  const navigationTask = page.goto(url, {
    timeout: 0,
    waitUntil: waitUntil
  });

  // 自定义超时定时器
  const timeoutTask = new Promise(resolve => {
    setTimeout(() => resolve('timeout_triggered'), timeoutMs);
  });

  // 等待第一个完成的任务
  const raceResult = await Promise.race([navigationTask, timeoutTask]);

  // 无论是否超时，都获取当前页面的状态和内容
  const statusCode = await page.mainFrame().navigation().then(nav => nav.status());
  const pageContent = await page.content();
  const readyState = await page.evaluate(() => document.readyState);

  await browser.close();
  return {
    statusCode: statusCode,
    content: pageContent,
    isTimeout: raceResult === 'timeout_triggered',
    readyState: readyState
  };
}

// 使用示例：等待networkidle0最多5秒，超时则返回已加载内容
gotoWithSoftTimeout('https://example.com', 'networkidle0', 5000)
  .then(result => {
    console.log(`状态码: ${result.statusCode}`);
    console.log(`是否超时: ${result.isTimeout}`);
    console.log(`页面就绪状态: ${result.readyState}`);
    // 这里可以处理获取到的pageContent
  })
  .catch(err => {
    // 捕获真正的导航失败（如无法连接、服务器错误）
    console.error('导航失败:', err.message);
  });

关键注意事项 #

• 把page.goto()的timeout设为0是为了禁用默认的超时终止逻辑，让页面能完成基础的HTML加载，即使后续资源加载慢导致waitUntil条件不满足
• 如果是真正的导航故障（比如DNS解析失败、服务器无响应），navigationTask还是会抛出异常，需要在catch分支处理这类错误
• 超时后页面可能仍在加载资源，但page.content()可以获取到当前已渲染的DOM内容，适合需要快速获取页面基础内容的场景

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