npm 包 webshot-client 使用教程

什么是 webshot-client

webshot-client 是一个 npm 包，它提供了一种简单的方法将网页截图。

webshot-client 支持不同的输出格式，可以将截图保存为 PNG，JPEG 或 PDF 文件。此外，它还支持将截图作为数据 URI 返回，方便在网页上直接使用。

安装

在使用 webshot-client 之前，需要先安装它。

可以通过 npm 在终端中安装：

npm install webshot-client --save-dev

注：使用 --save-dev 标志将包添加到开发依赖项中。因此它不会出现在生产构建中。

用法

引入 webshot-client 包：

const webshot = require('webshot-client');

然后使用以下代码截取网页截图：

webshot('https://example.com', 'example.png', function (err) {
    if (err) {
        console.log(err);
    } else {
        console.log('Screenshot saved!');
    }
});

该函数的第一个参数是要截取的网页的 URL。第二个参数是将带有截图的 PNG 文件保存到的位置。

选项

webshot-client 提供了多种选项来控制截图的生成方式。

我们可以传递一个选项对象作为第三个参数。以下是可用的选项：

• windowSize： 指定浏览器窗口的大小。格式为 [宽度，高度]。
• quality： 用于 JPEG 格式的截图。例如：100 表示最高质量。默认值为 75。
• streamType： 指定输出格式。支持 PNG，JPEG 和 PDF。
• timeout： 指定加载网页的超时时间。默认为 20000 毫秒。
• siteType： 指定网站类型。可以是 html 或 pdf。
• shotSize： 控制要截图的页面部分。可用的属性有 width，height，top 和 left。

下面是一个使用选项的示例代码：

webshot('https://example.com', 'example.png', { windowSize: [1280, 720], quality: 100 }, function (err) {
    if (err) {
        console.log(err);
    } else {
        console.log('Screenshot saved!');
    }
});

在上面的示例中，我们指定了窗口大小为 1280x720，JPEG 质量为 100。

总结

webshot-client 是一个很方便的包，用于截取网页截图。通过使用选项，可以轻松控制截图的生成方式。

希望这篇文章能帮助你了解如何使用 webshot-client。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600671068dd3466f61ffddfa