# @datadog/mobile-react-native-session-replay 中文文档

规范地址：https://npmcn.com/package/%40datadog/mobile-react-native-session-replay/

版本：3\.11\.0
npm 元数据更新时间：2026-10-20T14:53:00.290Z
中文译文更新时间：2026-11-11T13:27:43.895Z
软件包许可：Apache-2\.0

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40datadog/mobile-react-native-session-replay
原文对照：https://npmcn.com/package/%40datadog/mobile-react-native-session-replay/?lang=original
项目主页：https://github.com/DataDog/dd-sdk-reactnative#readme
源码仓库：https://github.com/DataDog/dd-sdk-reactnative

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：450 kB，210 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：1 个
- peer 依赖：react \>=16\.13\.1，react-native \>=0\.63\.4 \<1\.0
- 首次发布：2024-01-15T16:18:55.072Z
- 最新版本发布：2026-10-20T14:52:59.314Z
- 近 30 天下载量：794956（2026-10-12 至 2026-11-10，npm 官方下载统计）
- 已发布版本数：76（近 12 个月 32 个）

## 中文简介

客户端 React 本地模块, 允许与 Datadog 重放会话

## 安装

```sh
npm install @datadog/mobile-react-native-session-replay
```

也可以使用：`pnpm add @datadog/mobile-react-native-session-replay`、`yarn add @datadog/mobile-react-native-session-replay`、`bun add @datadog/mobile-react-native-session-replay`

## README

# 回放原生的会话

Mobile Session Replay通过视像重放每个用户互动,例如自带,刷卡和卷轴,将能见度扩展到您的移动应用程序. 在您的应用程序上可视化地重放用户交互功能,使得复制崩溃和出错更加容易,以及理解用户进行UI改进的行程.

## 设置

**说明**:确保您已经设置并初始化 [数据犬反应原生 SDK](https://www.npmjs.com/package/@datadog/mobile-react-native) 并启用了视图仪器.

要安装国家预防机制,运行:

```sh
npm install @datadog/mobile-react-native-session-replay
```

要安装 Yarn, 请运行 :

```sh
yarn add @datadog/mobile-react-native-session-replay
```

## 启用会话重放

启用会话重放、导入并调用 `enable` 方法与配置。 以下是一个实例:

```js
import { SessionReplay } from "@datadog/mobile-react-native-session-replay";

SessionReplay.enable({
    replaySampleRate: sampleRate, // The percentage of sampled replays, in the range 0.0 - 100.0 (Default: 100.0).
    textAndInputPrivacyLevel: TextAndInputPrivacyLevel.MASK_ALL, // Defines the way text and input (e.g text fields, checkboxes) should be masked (Default: `MASK_ALL`).
    imagePrivacyLevel: ImagePrivacyLevel.MASK_ALL, // Defines the way images should be masked (Default: `MASK_ALL`).
    touchPrivacyLevel: TouchPrivacyLevel.HIDE  // Defines the way user touches (e.g tap) should be masked (Default: `HIDE`).
});
```

**说明**:所有配置属性都是可选的,应当根据应用程序的需要进行调整.

## 手动启动或停止录音

默认情况下,会话重放会自动开始录制. 然而,如果您喜欢在应用程序的特定点上手动开始录制,您可以使用可选的 `startRecordingImmediately` 参数如下,以后调用 `SessionReplay.startRecording()`。您也可以使用 `SessionReplay.stopRecording()` 随时停止录音.

```js
import { SessionReplay } from "@datadog/mobile-react-native-session-replay";

SessionReplay.enable({
  replaySampleRate: sampleRate,
  startRecordingImmediately: false
});
// Do something
SessionReplay.startRecording();
SessionReplay.stopRecording();
```

## SVG 支持

会话重放为在您的 React Natural 应用程序中捕获 SVG 图像提供更强大的支持 。 要启用 SVG 跟踪, 您需要设置 Datadog Babel 插件和 Metro 插件 .

### 先决条件

安装 Datadog Babel 插件 :

```sh
npm install @datadog/mobile-react-native-babel-plugin
```

或与雅恩:

```sh
yarn add @datadog/mobile-react-native-babel-plugin
```

### 设置 Babel 插件

配置您的 Babel 插件 `babel.config.js` 以启用 SVG 跟踪:

```js
module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: [
    [
      '@datadog/mobile-react-native-babel-plugin',
      {
        sessionReplay: {
          // SVG tracking is disabled by default
          // Set to true to enable SVG asset extraction
          svgTracking: true
        }
      }
    ]
  ]
};
```

### 设置地铁插件

配置您的地铁插件 `metro.config.js` 以便自动捆绑 SVG 资产:

```js
const { withSessionReplayAssetBundler } = require('@datadog/mobile-react-native-session-replay/metro');

module.exports = withSessionReplayAssetBundler({
  /* your existing Metro config */
});
```

Metro插件在开发和生产建设期间自动监控并捆绑SVG资产.

### 安装工作流程

设置您的项目或安装新的依赖性后, 请遵循此工作流程, 以确保 SVG 资产被正确生成给本地建筑 :

```sh
# 1. Install dependencies
yarn install

# 2. Generate Session Replay SVG assets
npx datadog-generate-sr-assets

# 3. Install iOS pods (if building for iOS)
cd ios && pod install && cd ..

# 4. Run your app
yarn ios
# or
yarn android
```

这个 `datadog-generate-sr-assets` CLI 工具扫描您的 SVG 元素的代码库, 并预生成优化将包含在您本地建筑中的资产 .

#### CLI 选项

这个 `datadog-generate-sr-assets` 命令支持以下选项:

```sh
npx datadog-generate-sr-assets [options]
```

| 选项 | 别名 | 说明 | 示例 |
| --- | --- | --- | --- |
| `--ignore <pattern>` | `-i` | 扫描时需要忽略的额外光彩图案 。 可多次指定. | `npx datadog-generate-sr-assets --ignore "**/legacy/**" --ignore "**/vendor/**"` |
| `--verbose` | `-v` | 为调试启用动词输出 . | `npx datadog-generate-sr-assets --verbose` |
| `--path <path>` | `-p` | 要扫描的根目录路径 。 默认当前工作目录 . | `npx datadog-generate-sr-assets --path ./src` |
| `--followSymlinks` |  | 在目录 traversal 时跟随符号链接. 默认: 虚假( 符号链接被忽略) . | `npx datadog-generate-sr-assets --followSymlinks` |

**CI/CD说明**: 如果您的建筑使用连续集成, 请确保将这些步骤包括在您的 CI 管道中 。 工作流程应为: `yarn install` → `npx datadog-generate-sr-assets` → `pod install` (for iOS) – 构建您的应用程序. 这确保了SVG资产在本土建设过程前被适当生成.

### 发展 工作流量

在开发过程中,地铁插件自动处理由 Babel 插件创建的 SVG 资产 :

1.  用 SVG 元素从 `react-native-svg`
2.  Babel 插件在构建过程中提取并转换 SVG 节点
3.  Metro插件检测新的 SVG 资产并自动捆绑
4.  SVG 图像在会话回放录制中无缝捕获

在开发过程中不需要人工资产管理.

## 常见问题

### @datadog/mobile-react-native-session-replay 是什么？

客户端 React 本地模块, 允许与 Datadog 重放会话

### 如何安装 @datadog/mobile-react-native-session-replay？

在项目目录运行 npm install @datadog/mobile-react-native-session-replay，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（\>=16\.13\.1）、react-native（\>=0\.63\.4 \<1\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @datadog/mobile-react-native-session-replay 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @datadog/mobile-react-native-session-replay 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @datadog/mobile-react-native-session-replay 可以商用吗？

@datadog/mobile-react-native-session-replay 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @datadog/mobile-react-native-session-replay 的下载量有多少？

根据 npm 官方下载统计，@datadog/mobile-react-native-session-replay 在 2026/10/12 – 2026/11/10 这 30 天内被下载 794,956 次，日均约 26,499 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @datadog/mobile-react-native-session-replay 还在维护吗？

最新版本 3\.11\.0 发布于 2026/10/20（21 天前）；至今共发布 76 个版本，其中过去 12 个月发布了 32 个；首次发布于 2024/01/16。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。