Skip to content

@rrweb/record

概述

本包包含 rrweb 中所有与录制相关的代码,设计用于发布到前端应用/网页中。更多信息请参阅 rrweb 指南中的快速开始,包括录制选项

对于需要基于 WebSocket 对接 rrweb Cloud API 的录制,请使用浏览器客户端,它构建于本包之上,并接受相同的录制选项。

安装

1) 打包器 / npm(推荐)

bash
npm install @rrweb/record
js
import { record } from '@rrweb/record';

2) 不使用打包器的浏览器环境(ESM)

直接在浏览器中加载时,请使用 CDN 托管的 @rrweb/record 浏览器资源:

html
<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 回退方案)

仅用于兼容非模块化环境。

html
<script src="https://cdn.rrweb.com/record/current/dist/record.umd.cjs"></script>

旧版 UMD 全局变量为 rrwebRecord

用法

js
import { record } from '@rrweb/record';

record({
  emit(event) {
    // send event to server
  },
});

备注

目前本包实际上只是对主 rrweb 包中 record 函数的一层封装。 未来所有 record 相关代码都将迁移到本包中。

在 GitHub 上编辑 README

@rrweb/record 发布说明

2.1.1

补丁变更

  • 更新依赖 []:
    • rrweb@2.1.1
    • @rrweb/types@2.1.1
    • @rrweb/utils@2.1.1

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 中会有更完善的定义;如果你需要特定类型,它们可能从新的包中导出(例如 PlayerMachineStateSpeedMachineState 现在从 @rrweb/replay 导出)。请查看 package.jsonmainexports 字段了解可用文件。

  • #1497 2606a2a 感谢 @Juice10! - 从 rrweb 包中移除 rrweb-all.js、rrweb-record.js 和 rrweb-replay.js 文件。现在你可以改用 @rrweb/all@rrweb/record@rrweb/replay 包。更多信息请查看各包的 README,或查看 PR #1033 了解这些变更。

补丁变更

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

补丁变更

2.0.0-alpha.18

补丁变更

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 中会有更完善的定义;如果你需要特定类型,它们可能从新的包中导出(例如 PlayerMachineStateSpeedMachineState 现在从 @rrweb/replay 导出)。请查看 package.jsonmainexports 字段了解可用文件。

  • #1497 2606a2a 感谢 @Juice10! - 从 rrweb 包中移除 rrweb-all.js、rrweb-record.js 和 rrweb-replay.js 文件。现在你可以改用 @rrweb/all@rrweb/record@rrweb/replay 包。更多信息请查看各包的 README,或查看 PR #1033 了解这些变更。

补丁变更