NodeJS实现网页截图功能 |21xrx.com

NodeJS实现网页截图功能

2023-07-04 21:24:59 深夜i -- --

NodeJS 网页截图实现

NodeJS是一种开源的JavaScript运行环境，在今天的Web应用程序开发中越来越受欢迎。除了可以使用NodeJS处理I/O和构建Web服务器之外，还可以使用它来实现各种功能，如网页截图。

网页截图是指将一个Web页面转换为图像格式，如PNG或JPG。网页截图功能可以应用于许多场景，比如页面快照、网络监控、测试和调试等。

在NodeJS中，我们可以使用Puppeteer库来实现网页截图功能。Puppeteer是一个NodeJS库，可以通过DevTools协议控制无头Chrome或Chromium。无头Chrome是没有用户界面的Chrome浏览器，可以在服务器上运行，不需要图形界面。

下面是使用Puppeteer库实现网页截图的代码示例：

安装Puppeteer库：

npm install puppeteer

截图代码：


const puppeteer = require('puppeteer');
async function screenshot(url, outputPath) {
 const browser = await puppeteer.launch();
 const page = await browser.newPage();
 await page.goto(url);
 await page.screenshot({path: outputPath});
 await browser.close();
}
screenshot('https://www.baidu.com', 'baidu.png');

这样就可以对百度首页进行截图了。其中，screenshot()函数接收两个参数，即要截图的url和截图保存路径。

我们可以在命令行运行这段代码，执行截图功能。运行结果如下：


$ node screenshot.js
(node:48372) ExperimentalWarning: The fs.promises API is experimental
(node:48372) UnhandledPromiseRejectionWarning: Error: Failed to launch chrome!
[0717/170341.626007:ERROR:zygote_host_impl_linux.cc(90)] Running as root without --no-sandbox is not supported. See https://crbug.com/638180.
TROUBLESHOOTING: https://github.com/puppeteer/puppeteer/blob/master/docs/troubleshooting.md
(node:48372) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:48372) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

这里出现了Failed to launch chrome!的错误，在Linux环境下运行时需要添加参数--no-sandbox, 代码更新如下：


const puppeteer = require('puppeteer');
async function screenshot(url, outputPath) {
 const browser = await puppeteer.launch({args: ['--no-sandbox']});
 const page = await browser.newPage();
 await page.goto(url);
 await page.screenshot({path: outputPath});
 await browser.close();
}
screenshot('https://www.baidu.com', 'baidu.png');

现在再次运行，截图成功并保存在当前目录。

总的来说，使用NodeJS和Puppeteer库可以很容易地实现网页截图功能。通过这种方式，我们可以在服务器端自动地截图，并将截图保存到本地或上传到云服务器上。这对于监控和测试等场景非常有用。

上一篇: idea打包java可执行jar包

下一篇: 【C++编程】计算正整数n的质数和对数

评论区

()

相似文章