@wenh/snapshot v1.0.0
前端快照
对前端用户的操作流程进行快照并上传到服务器中留存
快速开始
安装依赖
npm install @wenh/snapshot
页面入口引入
import snapshot from '@wenh/snapshot';
snapshot({
url: '' // 需要上传的服务地址
});
snapshot 函数 options 入参说明
入参 | 类型 | 是否必传 | 说明 |
---|---|---|---|
url | String | 是 | 上传快照到服务器的地址 |
debug | Boolean | 否 | 是否开启调试,默认为 false,开启时不会上传快照到服务器,而是直接下载到本地 |
on | Function|Boolean | 否 | 异步或同步函数或 boolean 值,控制是否启用前端快照,返回 true 为启用,false-为不启用,默认值为 true |
hack | Function | 否 | 样式 hack 处理函数,纠正截图样式问题,暴露的参数可以接受到 iframeDocument 元素 |
black | Object[] | 否 | 对象数组,通过黑名单列表直接配置设置对应的样式类 |
scrollElements | String[] | 否 | 需要监听的哪些元素滚动进行截屏, 如:‘demo-scroll’ 前面不需要带上点号 |
data | Object | 否 | 需要上传到服务器的请求附加属性值 |
black对象数组说明 | 入参 | 类型 | 是否必传 | 说明 |---|---|---|---| | className | String | 是 | 需要处理的样式类,如:‘demo’ 前面不需要带上点号 | | style | Object | 是 | 需要处理的样式,如:{ porision: 'absolute'}, 包含可以设置的属性值遵循元素的样式属性值|
data请求默认自带的附加属性说明 | 入参 | 类型 | 是否必传 | 说明 |---|---|---|---| | data | Object | 是 | 需要上传图片带的附加信息 | | 图片文件名称 | Blob | 是 | 需要上传图片的二进制信息, 如: screenshot.screenshot_prod_1.0.0_index_iOS_1690855479677.jpeg: (binary)|
data对象数组说明 | 入参 | 类型 | 是否必传 | 说明 |---|---|---|---| | environment | String | 否 | 环境,生产或测试 | | clientType | String | 否 | 客户端类型 | | screenshotTimeStamp | String | 否 | 截图时间戳 | | moduleVersion | String | 否 | 页面模块版本 | | module | String | 否 | 页面模块 | | fileType | String | 否 | 图片类型 | | routePath | String | 否 | 页面路由 |
2 years ago