如何实现从浏览器控制台运行Puppeteer并持续交互？

要满足你提出的三个需求，只需要在Puppeteer配置和脚本逻辑上做几个调整，下面是具体实现步骤和完整代码：

关键配置与逻辑调整 #

• 阻止脚本终止：Node.js脚本执行完主逻辑后会自动退出，我们可以通过挂起进程的方式让脚本持续运行，比如用await new Promise(() => {})或者process.stdin.resume()。
• 默认打开开发者工具：启动浏览器实例时，开启devtools: true配置，同时必须关闭无头模式（headless: false），还要设置autoClose: false避免页面自动关闭。
• 在浏览器控制台调用Puppeteer方法：把Puppeteer的page对象注入到浏览器的全局window对象中，这样就能在控制台直接调用page的各种自动化方法，实时查看执行过程。

完整代码示例 #

const puppeteer = require('puppeteer');

(async () => {
  // 启动浏览器，配置开发者工具、无头模式和自动关闭行为
  const browser = await puppeteer.launch({
    headless: false, // 必须关闭无头模式才能看到浏览器界面和开发者工具
    devtools: true, // 默认打开开发者工具
    autoClose: false, // 阻止浏览器在脚本执行完后自动关闭
    defaultViewport: null // 可选：使用默认窗口大小，避免页面被缩放
  });

  // 打开新页面并加载目标URL
  const page = await browser.newPage();
  await page.goto('https://example.com'); // 替换成你的目标页面

  // 将page对象注入到浏览器全局window中，方便控制台调用
  await page.exposeFunction('getPage', () => page);
  await page.evaluate(() => {
    window.page = getPage();
  });

  console.log('浏览器已启动，开发者工具已打开。');
  console.log('你可以在浏览器控制台中直接调用page对象的方法，比如page.click(selector)');

  // 挂起进程，阻止脚本终止
  await new Promise(() => {});
})();

使用说明 #

1. 运行上述脚本后，浏览器会自动打开并加载目标页面，同时开发者工具也会默认启动。
2. 切换到浏览器的控制台标签，直接输入page相关的命令即可执行自动化操作，比如：
   • page.click('a')：点击页面上的第一个链接
   • page.type('input[type="text"]', 'test content')：在输入框中输入内容
   • page.screenshot({path: 'test.png'})：截取当前页面截图
3. 脚本会一直保持运行状态，直到你手动关闭浏览器或者在终端按下Ctrl+C终止进程。

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