首页Puppeteer实现虚拟浏览器截图

Puppeteer实现虚拟浏览器截图

时间: 2025-01-08 16:37:29 浏览: 41

### 使用 Puppeteer 实现无头浏览器自动截屏为了利用 `puppeteer` 实现自动化网页截图，需安装 Node.js 和 npm。接着通过命令行执行如下操作来安装 puppeteer： ```bash npm install puppeteer ``` 创建一个新的 JavaScript 文件，并编写以下代码片段以启动无头浏览器实例、导航到目标 URL 并捕获整个页面的全尺寸截图。 ```javascript const puppeteer = require('puppeteer'); (async () => { const browser = await puppeteer.launch({ headless: true }); const page = await browser.newPage(); // 设置视口大小可选 await page.setViewport({ width: 1920, height: 1080 }); // 导航至指定URL await page.goto('https://example.com', { waitUntil: 'networkidle2' }); // 获取整个页面的高度以便捕捉完整的屏幕截图 let totalHeight = await page.evaluate(() => document.body.scrollHeight); // 调整窗口高度适应页面内容长度 await page.setViewport({ width: 1920, height: totalHeight }); // 执行截图动作并将图像保存为文件 await page.screenshot({ path: './screenshot.png', fullPage: true }); console.log(`Screenshot saved as screenshot.png`); await browser.close(); })(); ``` 这段脚本会加载给定网址，在后台默默工作而不会弹出任何图形界面[^3]。它还设置了固定的宽度和动态调整的高度以确保能够获得整个页面的内容而不是仅限于初始可见区域内的部分[^1]。最后一步是调用 `page.screenshot()` 方法并传入参数指明输出路径以及是否要拍摄整个页面而非当前可视区。对于中文字符显示问题，如果遇到乱码情况，则可能是因为缺少必要的中文字体所致。可以通过刷新字体缓存并确认已安装适当的语言包解决此问题[^4]。

阅读全文