点击Cookie同意按钮后Puppeteer浏览器意外关闭问题排查

一、浏览器提前关闭的核心原因 #

1. 元素获取逻辑错误：page.waitForSelector(".Ip")仅返回匹配到的第一个DOM元素，并非元素数组。后续代码尝试访问elements.length会直接抛出TypeError，导致scrapeData函数的Promise被拒绝，而代码未添加错误捕获逻辑，Node.js进程直接终止，浏览器随之关闭。
2. 选择器重复无效：即使获取到元素数组，循环中再次使用.Ip作为子元素选择器，与父元素选择器重复，无法正确定位球队名称元素，会进一步触发错误。

二、代码改进建议 #

1. 修正多元素获取逻辑 #

使用page.$$(selector)直接获取所有匹配元素的数组，或用page.$$eval一次性提取数据，避免循环内多次异步调用，提升效率：

async function scrapeData(page) {
  // 示例选择器需根据实际页面调整，此处假设球队元素类名为.Team
  const content = await page.$$eval(".MatchRow .Team", elements => 
    elements.map(el => el.textContent.trim())
  );
  return content;
}

2. 添加错误捕获与浏览器统一管理 #

用try/catch包裹核心逻辑，避免错误直接终止进程；同时在finally中确保浏览器无论成功失败都能关闭：

(async () => {
  let browser;
  try {
    const page = await openPage();
    browser = page.browser();
    const dataScraped = await scrapeData(page);
    console.log(dataScraped);
  } catch (error) {
    console.error("爬取出错:", error);
  } finally {
    if (browser) await browser.close();
  }
})();

3. 校准页面选择器 #

Livescore页面类名可能动态变化，建议将puppeteer.launch的headless设为false，打开浏览器开发者工具重新定位球队元素的正确选择器（比如当前页面球队名称可能在.Team类元素中，而非.Ip）。

4. 优化爬取性能 #

拦截非必要资源加载，提升页面加载速度：

async function openPage() {
  const browser = await puppeteer.launch({ headless: "new" }); // 使用新版无头模式
  const page = await browser.newPage();
  
  await page.setViewport({ width: 1000, height: 926 });
  // 拦截图片、样式、字体等非必要请求
  await page.setRequestInterception(true);
  page.on("request", (req) => {
    if (["image", "stylesheet", "font"].includes(req.resourceType())) {
      req.abort();
    } else {
      req.continue();
    }
  });

  await page.goto("https://www.livescore.com/en/", { waitUntil: "domcontentloaded" }); // 调整等待策略

  // 处理cookie弹窗，添加超时避免无限等待
  try {
    await page.waitForSelector('#onetrust-accept-btn-handler', { timeout: 5000 });
    await page.click('#onetrust-accept-btn-handler');
    console.log("点击了cookie按钮");
  } catch (err) {
    console.log("未出现cookie弹窗");
  }
  
  return page;
}

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