如何使用Puppeteer实现同时控制多个标签页

实现多标签页同时控制的方案 #

Puppeteer 的每个 Page 实例都是完全独立的控制上下文，和标签页是否处于前台激活状态没有绑定关系，你遇到的「仅能控制激活标签页」通常是操作逻辑写为串行执行，或者误以为必须激活才能操作导致的，可参考以下方案实现需求：

• 若要并行控制两个页面执行操作，不要用 await 串行调用两个页面的方法，用 Promise.all 包裹并发任务即可：

// 示例：同时对两个页面执行点击、截图操作
await Promise.all([
  page.click('#submit-btn'),
  page.screenshot({ path: 'page1.png' }),
  page2.click('#confirm-btn'),
  page2.screenshot({ path: 'page2.png' })
])

• 若遇到依赖页面焦点的交互场景，确实需要主动切换某个标签页到前台激活，调用对应页面对象的 bringToFront() 方法即可：

// 将page2切换为当前激活标签页
await page2.bringToFront()
// 操作完成后可切换回page
await page.bringToFront()

• 若需要批量管理所有打开的标签页，可通过 browser.pages() 获取当前浏览器实例下所有的Page实例数组，实现批量操作：

const allPages = await browser.pages()
// 示例：批量关闭所有标签页
await Promise.all(allPages.map(page => page.close()))

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