puppeteer提供node.js控制chrome/chromium的自动化接口，支持无头/有头模式；需安装依赖、启动浏览器、加载网页截图、注入脚本提取数据、模拟用户交互。
如果您希望使用Node.js控制谷歌浏览器执行网页自动化操作，Puppeteer提供了一套无头或有头模式下的Chrome/Chromium控制接口。以下是实现基础自动化测试与控制的具体步骤：
一、安装Puppeteer依赖
Puppeteer是一个Node.js库，通过DevTools协议与Chrome或Chromium通信，需先在项目中安装对应包。安装过程会自动下载兼容版本的Chromium，也可配置跳过下载以使用系统已安装的Chrome。
1、确保本地已安装Node.js（建议v16.0.0及以上版本）。
2、在项目根目录下运行命令初始化npm：npm init -y。
3、执行安装命令：npm install puppeteer。
4、如需使用系统Chrome而非内置Chromium，安装时添加--no-sandbox参数并后续指定executablePath。
二、启动浏览器实例
通过puppeteer.launch()可创建一个浏览器实例，支持无头模式（默认启用）或有头模式便于调试。实例启动后可获取页面对象并执行导航、截图等操作。
1、创建index.js文件，引入puppeteer模块：const puppeteer = require('puppeteer');
2、调用launch方法启动浏览器：const browser = await puppeteer.launch({ headless: false });
3、使用newPage()创建新标签页：const page = await browser.newPage();
4、关闭浏览器前请勿遗漏browser.close()调用，否则进程将持续占用资源。
三、加载网页并截取屏幕
page.goto()用于导航至指定URL，支持等待网络空闲或DOM加载完成；page.screenshot()可在任意时刻保存当前视口截图，适用于验证页面渲染结果。
1、导航到目标网址：await page.goto('https://example.com', { waitUntil: 'networkidle0' });
2、设置视口尺寸以模拟不同设备：await page.setViewport({ width: 1280, height: 720 });
3、执行截图并保存为PNG文件：await page.screenshot({ path: 'screenshot.png' });
4、截图路径支持绝对路径或相对路径，文件夹需预先存在，否则抛出ENOENT错误。
四、注入脚本并提取页面数据
page.evaluate()可在浏览器上下文中执行JavaScript代码，返回序列化后的结果；该方法隔离Node.js环境与页面环境，是获取DOM元素内容、表单值或计算结果的核心方式。
1、等待特定选择器出现后再执行脚本：await page.waitForSelector('h1');
2、提取首屏h1文本内容：const title = await page.evaluate(() => document.querySelector('h1').innerText);
3、向页面注入自定义函数并传入参数：const result = await page.evaluate((selector) => document.querySelectorAll(selector).length, 'a');
4、evaluate内不可直接访问Node.js变量或require模块，所有依赖必须显式传递或内联定义。
五、模拟用户交互操作
page.click()、page.type()、page.select()等方法可模拟真实用户行为，配合waitForTimeout或waitForSelector可应对异步加载场景，提升脚本健壮性。
1、点击带有data-testid属性的按钮：await page.click('[data-testid="submit-btn"]');
2、在输入框中输入文本并触发键盘事件：await page.type('#search-input', 'Node.js automation');
3、选择下拉菜单中的选项：await page.select('select#country', 'US');
4、按下回车键提交表单：await page.keyboard.press('Enter');
