会话回放
会话回放功能允许您回放用户在 Web 应用上的交互操作，帮助您了解用户访问路径。通过捕获用户操作、DOM 事件、控制台事件、资源洞察、问题及内存使用趋势，该功能有助于故障排除并提升终端用户体验。
视频
配置会话回放
要录制应用的所有用户会话，您需要在 RUM 脚本中启用此功能。
在 RUM 脚本中添加以下自定义 API，以激活会话回放并跟踪用户交互。
s247r('recordSession',{
"trackEvents": true,
"trackConsoleEvents": true,
"maskAllInput": true,
"maskAllText": true,
"collectNetworkDetails": true,
"allowedNetworkUrls": [/.*/]
});
recordSession 自定义 API 的配置项
| 配置项 | 描述 | 默认值 |
|---|---|---|
| trackEvents | 启用用户操作事件的捕获。在会话回放中捕获用户事件时，必须将其设置为 true。 | false |
| trackConsoleEvents | 启用控制台事件的捕获。 | false |
| maskAllInput | 对所有输入数据进行脱敏处理，防止其被捕获。 | true |
| maskAllText | 对所有文本进行脱敏处理，防止其被捕获。 | true |
| collectNetworkDetails | 启用网络事件详情的捕获。 | false |
| allowedNetworkUrls | 用于配置需捕获的网络 URL 的正则表达式或正则表达式列表（例如 [ /.*/ ]）。 | N/A |
| allowedRequestHeaders | 需要捕获的请求头列表（例如 [ 'Custom-header', 'Accept-language' ]）。 | N/A |
| allowedResponseHeaders | 需要捕获的响应头列表（例如 [ 'Custom-header' ]）。 | N/A |
默认包含的请求头：['Content-Type','Content-Length','Accept']
永久排除的请求头：['authorization', 'x-forwarded-for', 'cookie', 'set-cookie', 'x-api-key', 'x-real-ip', 'remote-addr', 'forwarded', 'proxy-authorization', 'x-csrf-token', 'x-csrftoken', 'x-xsrf-token']
查看录制会话的步骤
- 登录您的 Site24x7 客户端。
- 导航至 RUM，选择您希望查看会话回放的应用。
- 点击会话回放。
录制的会话将与关键指标一同展示。
| 指标 | 描述 |
|---|---|
| 开始时间 | 会话开始的时间戳。 |
| 用户名 | 用户的名称。 |
| IP 地址 | 用户会话的 IP 地址。 |
| 浏览器 | 用户使用的浏览器。 |
| 设备 | 设备类型（例如 Windows、Linux 或移动设备）。 |
| 页面加载次数 | 会话期间加载的总页面数。 |
| 错误 | 会话中遇到的错误数量。 |
| Ajax 调用次数 | 会话期间发起的 AJAX 请求数量。 |
| 浏览时长 | 用户在会话中的总停留时长。 |
- 点击某个会话以查看详细指标。
会话回放中的会话详情
此页面提供用户交互、错误及性能指标的深度分析，帮助您有效分析用户访问路径并进行故障排除。
录制
录制时间轴以可视化方式呈现会话，按时间段进行划分，并以不同的事件标记帮助您高效分析用户交互。每种事件类型均以颜色区分，便于快速识别：
- 红点：表示会话期间发生的错误。
- 灰点：代表滚动事件。
- 深蓝点：显示用户输入交互（例如在表单字段中输入内容）。
- 浅蓝点：表示点击事件。
- 绿点：代表页面加载事件。
这种颜色编码有助于快速识别会话中各类事件的类型和频率。
访问的 URL
您可以查看用户在会话中访问的具体网页。复制按钮可帮助您快速复制 URL，以便进一步调试或分析。
回放视频
回放视频功能允许您观看用户在网站或应用上的会话录制，以可视化方式呈现用户的交互操作，更便于诊断问题和了解用户行为。
该功能还支持播放速度控制（1x、2x、4x 或 8x）以及跳过非活跃时段的选项。
您可以通过点击时间轴上的任意位置，快速跳转至会话中的特定时间点。
用户操作
此标签页捕获用户在会话期间执行的所有操作，包括：
- 操作名称：描述操作类型（点击、滚动、页面加载、错误等）。
- 名称：显示与用户操作关联的具体元素或 URL，例如被点击的按钮、输入字段或已加载的网页。
- 时间：显示操作发生的时间。
- 您可以使用事件类型下拉菜单按类型过滤事件，专注于特定类型的用户操作，例如仅查看点击或滚动事件。
- 此外，还可以使用搜索栏查找与特定 HTML 元素、错误信息或时间戳相关的事件。
DOM 事件
DOM 事件标签页捕获并列出用户会话期间发生的所有文档对象模型 (DOM) 事件。
- HTML 元素：参与事件的 HTML 元素。
例如，<elem id="data-source-selection-header"> 表示 "data-source-selection-header" 元素被点击。 - 事件类型：被捕获的 DOM 事件类型。
- 时间：事件发生的精确时间戳。
- 您可以使用事件类型下拉菜单按类型过滤事件，专注于特定类型的交互，例如仅查看点击或滚动事件。
- 此外，还可以使用搜索栏通过 HTML 元素或时间戳查找特定事件。
控制台
此标签页提供用户会话期间记录的控制台消息详细日志。借助这些消息，您可以深入了解用户会话的技术层面，从而主动发现并解决影响 Web 应用性能和可靠性的问题。
- 事件类型下拉菜单允许您按类型过滤控制台消息，例如错误、警告或其他日志级别，有助于聚焦特定类型的问题。
- 提供搜索功能，可通过关键词或短语在控制台日志中快速定位特定消息。
瀑布流
此部分显示用户会话期间加载的资源列表（例如脚本、样式表和图片），通常包含每个资源的 URL、类型、大小和平均响应时间。有助于了解这些资源对页面加载时间和应用整体性能的影响。
- URL：请求的端点或资源（例如 API 调用、脚本、样式表或图片）。
- 类型：请求的类别（例如 HTTP、脚本或 CSS）。
- 大小：请求传输的数据量，以字节或千字节显示。
- 平均响应时间：请求完成所需的平均响应时间。
- 事件类型下拉菜单允许您按类型过滤网络请求，例如代码片段、HTTP 调用、图片、字体或源映射文件，有助于隔离特定资源类型以分析其对页面性能的影响。
- 提供搜索功能，可通过输入关键词或短语快速定位特定网络请求，便于调试加载问题。
问题
此部分捕获并显示用户在会话期间遇到的所有错误，同时提供各类问题的详细信息，例如 JavaScript 错误、网络故障以及可能影响用户在网站或应用上体验的其他问题。
- 顶部的时间轴显示会话期间每个错误的发生时间，以红点标记。
- 有助于将错误与用户操作及其他事件（例如以不同颜色点标记的滚动、输入、点击或页面加载事件）进行关联分析。
内存
此部分提供用户会话期间内存使用情况的详细视图，帮助开发人员了解应用随时间的内存消耗情况，并识别潜在的内存泄漏或低效问题。
- 空闲堆内存：应用可使用的可用内存量。
- 已用内存：应用当前使用的内存量。
关键洞察：
- 已用内存持续增加而没有相应下降，可能表明存在内存泄漏。
- 内存使用量突然出现峰值，可能指向应用中需要大量内存的特定操作或事件。
网络部分
网络部分提供用户会话期间所有网络请求的详细视图，通过列出以下关键信息帮助调试：
- URL：网页访问的端点。
- 状态：HTTP 状态码，指示请求是否成功（例如 200 表示成功，404 表示未找到）。
- 类型：请求类型，例如 AJAX 或 JavaScript 文件。
- 大小：响应的大小（以字节为单位）。
- 时间：完成请求所需的时间。
此部分有助于识别可能影响用户体验的慢速或失败网络请求。