网页截图API-Npm工具包分享

背景

以前在做低代码搭建页面的时候有需求给每个搭建的页面生成一个预览图,那个时候通过调研确定方案做了一版本内部使用,封装和很多能力,包括截取全屏,截取局部,导出png,缓存,清晰度,分辨率控制等等,随着越来越稳定后开始把这些能力整体整理成为一个工具包,取名为kaca,就像给页面拍照一样。

介绍

KaCa(官网:www.321kaca.com/)是一个npm包,你可以全局安装这个包后运行他,安装和运行方式参考官方文档,运行后会启动一个server服务,可通过接口调用这个服务实现网页转图片、PDF 等功能。

在线体验

为了方便快速体验基本功能,提供了一个页面,修改参数来快速了解其功能,你可以输入你想截取的页面。以及其他参数。除了页面提供的基本参数外,可以在配置文档里面查看全部支持的参数。

更多配置

把截图服务常用到的一些能力做了对应的参数配置,跟多数据可以参考官方文档。

总结

对于网页截图的方案其实市面上比较成熟,但是使用的时候还是会碰到很多细节问题,这个库把日常碰到的一些问题,以及截图经常设计到的需求都列举实现了一下,方便直接使用,该文章主要是分享一个自己开发的库,方便大家使用和提建议。

相关推荐
excel6 小时前
Nuxt 中 useSeoMeta 与 useHead 的区别
前端
竹林8186 小时前
OmniGame 技术白皮书:从零依赖到 WebRTC P2P,重新定义网页小游戏的工程上限
前端·浏览器
ss2736 小时前
AI全栈实战 | 2.1-02 CSS 布局:垂直居中为什么是经典面试题?所有布局在解决什么矛盾
前端·css
律宏阔6 小时前
Flutter Riverpod 3:统一打印 Provider 错误与自动重试日志
前端·flutter
周洲08306 小时前
STM32片内Flash读写深度详解|掉电参数保存、底层原理
linux·前端·stm32
data analyse 4567 小时前
埋点工具的私有化部署成本高吗?
前端·数据分析·github
data analyse 4567 小时前
埋点工具的埋点查询语言难学吗?
前端·数据分析
DianSan_ERP8 小时前
多平台订单自动下载与回传的技术实现:从消息推送到状态闭环引言
java·linux·服务器·前端·网络·架构·自动化
恋猫de小郭8 小时前
Shopify 回应为什么从 RN 回到原生,为什么不用 KMP ?
android·前端·flutter
小蜗 strong8 小时前
和电脑猜拳(随机程序应用)
服务器·前端·python