@rrweb/record
概述
本包包含 rrweb 中所有与录制相关的代码,设计用于发布到前端应用/网页中。更多信息请参阅 rrweb 指南中的快速开始,包括录制选项。
对于需要基于 WebSocket 对接 rrweb Cloud API 的录制,请使用浏览器客户端,它构建于本包之上,并接受相同的录制选项。
安装
1) 打包器 / npm(推荐)
npm install @rrweb/recordimport { record } from '@rrweb/record';2) 不使用打包器的浏览器环境(ESM)
直接在浏览器中加载时,请使用 CDN 托管的 @rrweb/record 浏览器资源:
<script type="module">
import { record } from 'https://cdn.rrweb.com/record/current/dist/record.js';
</script>使用 current 指向最新稳定版本,或固定到精确版本(例如 https://cdn.rrweb.com/record/2.0.0/dist/record.js),以获得不可变的 生产环境 URL。
3) 传统的直接 <script> 引入方式(UMD 回退方案)
仅用于兼容非模块化环境。
<script src="https://cdn.rrweb.com/record/current/dist/record.umd.cjs"></script>旧版 UMD 全局变量为 rrwebRecord。
用法
import { record } from '@rrweb/record';
record({
emit(event) {
// send event to server
},
});备注
目前本包实际上只是对主 rrweb 包中 record 函数的一层封装。 未来所有 record 相关代码都将迁移到本包中。
@rrweb/record 发布说明
2.1.1
补丁变更
- 更新依赖 []:
- rrweb@2.1.1
- @rrweb/types@2.1.1
- @rrweb/utils@2.1.1
2.1.0
补丁变更
#1865
b08a06f感谢 @eoghanmurray! - 修复当 URL 包含 hash 时绝对 URL 转换为相对 URL 的问题- rrweb@2.1.0
- @rrweb/types@2.1.0
- @rrweb/utils@2.1.0
2.0.1
补丁变更
- 更新依赖 [
5f52d63]:- rrweb@2.0.1
- @rrweb/utils@2.0.1
- @rrweb/types@2.0.1
2.0.0
重大变更
#1762
22bc4c3感谢 @Juice10! - 破坏性变更:将 UMD 全局名称从rrweb更名为rrwebRecord(录制器)和rrwebReplay(回放器)。这可以避免两者加载到同一页面时发生冲突。#1497
2606a2a感谢 @Juice10! - 分发的文件使用了新的文件名、路径和扩展名。重要:如果你直接引用分发的文件或类型,可能需要更新路径/文件名。例如你从rrweb/typings/...或rrdom/es导入。但如果你使用import rrweb from 'rrweb'的方式导入,则不会受到此变更的影响。 如果你直接在 script 标签中引入 rrweb 文件,可能需要将该路径更新为.umd.cjs文件。所有.js文件现在使用 ES 模块,可在现代浏览器、node.js 以及支持 ES 模块的打包器中使用。所有 npm 包现在还同时提供.cjs和.umd.cjs文件。.umd.cjs文件是将所有文件打包在一起的 CommonJS 模块,便于向浏览器环境分发单个文件(类似于之前的.js文件)。.cjs文件是可在旧版 Node.js 环境中使用的 CommonJS 模块。类型在package.json中会有更完善的定义;如果你需要特定类型,它们可能从新的包中导出(例如PlayerMachineState和SpeedMachineState现在从@rrweb/replay导出)。请查看package.json的main和exports字段了解可用文件。#1497
2606a2a感谢 @Juice10! - 从rrweb包中移除 rrweb-all.js、rrweb-record.js 和 rrweb-replay.js 文件。现在你可以改用@rrweb/all、@rrweb/record和@rrweb/replay包。更多信息请查看各包的 README,或查看 PR #1033 了解这些变更。
补丁变更
#1762
22bc4c3感谢 @Juice10! - 从所有构建产物中移除 base64 内联的 worker 源码#1515
8059d96感谢 @okejminja! - 新增对已废弃的 addRule 与 removeRule 方法的支持#1777
3b8daa6感谢 @arredgroup! - 在捕获 WebGLRenderingContext 之前先验证其是否存在#1631
88ea2d0感谢 @pauldambra! - 将 patch 函数移入 @rrweb/utils 以改善打包效果#1597
bd9eb70感谢 @pauldambra! - 正确检测 angular 包装了 mutation observer 的情况#1837
527d9d3感谢 @Juice10! - 从@rrweb/record构建产物中 tree-shake 移除仅回放使用的postcss代码。#1704
33e01f5感谢 @eoghanmurray! - 在 /dist/ 之外提供 /umd/ 输出目录,以便提供带 .js 扩展名的 UMD(Universal Module Definition)文件,同时不违背 package.json 中 /dist/ 下所有 .js 文件均为模块的约定更新依赖 [
6db8f71,0f0a532,7103625,a2c8a1a,3d1877c,af0962c,57a940a,e65465e,d872d28,36da39d,b5e30cf,40bbc25,22bc4c3,11f6567,490b3e2,dc20cd4,3e9e42f,f27e545,7261c43,03b5216,ae6908d,46f1b25,e0f862b,cbbd1e5,a6893f7,8aea5b0,267e990,68076b7,9c6edfe,a1ec9a2,8059d96,bfe14c5,4014305,efdc167,88ea2d0,609b7fa,f6f07e9,1e0b273,1fe39ab,490b3e2,979d2b1,1385f7a,d7c72bf,ebcbe8b,123a81e,05478c3,fc390a9,bbbfa22,e96f668,58c9104,227d43a,bc84246,d2582e9,aa79db7,82f6fec,2606a2a,980a38c,2606a2a,a225d8e,a82a3b4,5c27b76,b149cf3,a2be77b,227d43a,527d9d3,79837ac,a7c33f2,43e4f5b,3cc4323,d38893f,6f4e691,d7cf8dd,335639a,123a81e,04ee6ed,5fbb904,1e6f71b,d08624c,2606a2a,123a81e,314a8dd,5a78938,3416c3a,7c0dc9d,8e47ca1,53b83bb,9cd28b7,07ac5c9,33e01f5,02f50d2,502d15d,d0fbe23,a3de582,e08706a,8d209a6,be6bf52,aaabdbd,1e6f71b,6388fb5,c278d06,4cb4d0e,5e6c132]:- @rrweb/utils@2.0.0
- @rrweb/types@2.0.0
- rrweb@2.0.0
2.0.0-alpha.20
补丁变更
- 更新依赖 [
6388fb5]:- rrweb@2.0.0-alpha.20
- @rrweb/utils@2.0.0-alpha.20
- @rrweb/types@2.0.0-alpha.20
2.0.0-alpha.19
补丁变更
#1631
88ea2d0感谢 @pauldambra! - 将 patch 函数移入 @rrweb/utils 以改善打包效果更新依赖 [
dc20cd4,3e9e42f,a6893f7,88ea2d0,fc390a9,79837ac,6f4e691,9cd28b7]:- rrweb@2.0.0-alpha.19
- @rrweb/utils@2.0.0-alpha.19
- @rrweb/types@2.0.0-alpha.19
2.0.0-alpha.18
补丁变更
#1597
bd9eb70感谢 @pauldambra! - 正确检测 angular 包装了 mutation observer 的情况更新依赖 [
04ee6ed,5fbb904,5a78938,53b83bb]:- rrweb@2.0.0-alpha.18
- @rrweb/types@2.0.0-alpha.18
2.0.0-alpha.17
补丁变更
#1515
8059d96感谢 @okejminja! - 新增对已废弃的 addRule 与 removeRule 方法的支持更新依赖 [
40bbc25,68076b7,8059d96,335639a,be6bf52]:- rrweb@2.0.0-alpha.17
- @rrweb/types@2.0.0-alpha.17
2.0.0-alpha.15
重大变更
#1497
2606a2a感谢 @Juice10! - 分发的文件使用了新的文件名、路径和扩展名。重要:如果你直接引用分发的文件或类型,可能需要更新路径/文件名。例如你从rrweb/typings/...或rrdom/es导入。但如果你使用import rrweb from 'rrweb'的方式导入,则不会受到此变更的影响。 如果你直接在 script 标签中引入 rrweb 文件,可能需要将该路径更新为.umd.cjs文件。所有.js文件现在使用 ES 模块,可在现代浏览器、node.js 以及支持 ES 模块的打包器中使用。所有 npm 包现在还同时提供.cjs和.umd.cjs文件。.umd.cjs文件是将所有文件打包在一起的 CommonJS 模块,便于向浏览器环境分发单个文件(类似于之前的.js文件)。.cjs文件是可在旧版 Node.js 环境中使用的 CommonJS 模块。类型在package.json中会有更完善的定义;如果你需要特定类型,它们可能从新的包中导出(例如PlayerMachineState和SpeedMachineState现在从@rrweb/replay导出)。请查看package.json的main和exports字段了解可用文件。#1497
2606a2a感谢 @Juice10! - 从rrweb包中移除 rrweb-all.js、rrweb-record.js 和 rrweb-replay.js 文件。现在你可以改用@rrweb/all、@rrweb/record和@rrweb/replay包。更多信息请查看各包的 README,或查看 PR #1033 了解这些变更。