自定义事件

如何发送特定于业务领域的事件,并为会话录制添加更多智能信息。

自定义事件

自定义事件非常适合通过在会话回放的同时记录特定于业务领域的事件来添加更多智能信息。OpenReplay 使用 2 种类型的事件:功能性事件(event)和技术性事件(issue)。所有事件都会被索引以便于搜索,并与会话录制同步。

功能性事件会被索引,使查找特定的会话录制更加容易。如果它们已被 OpenReplay 成功接收,将在 omnisearch 搜索栏中作为筛选条件提供。

Functional Event

使用 event 方法来标记功能性事件,例如 order completedproduct added。它接受 2 个参数:name(string)和 payload(非递归的 JS 对象)。

tracker.event('product_added', 'shoes'); // after tracker.start()

使用 JavaScript 代码片段

Section titled 使用 JavaScript 代码片段

下面是一个使用代码片段发送功能性事件的示例。

<!-- OpenReplay Tracking Code -->
<script>
var initOpts = { projectKey: "GxPpaDARdn2345fgt321" };
var startOpts = { userID: ""}; 
(function(A,s,a,y,e,r){
  r=window.OpenReplay=[e,r,y,[s-1, e]];
  s=document.createElement('script');s.src=A;s.async=!a;
  ...
})("//static.openreplay.com/latest/openreplay.js", 1, 0, initOpts, startOpts);
</script>
  ...
  __OPENREPLAY__.event('product_added', 'shoes'); // send a functional event later in your code
  ...

技术性事件会显示在会话回放中 DevTools 的 Events 选项卡下,并作为回放过程中的注释显示。它们还会在漏斗(Funnels)中被纳入考量,用于将转化率下降与技术性问题相关联。

Technical Event

issue 用于发送技术性事件,例如可能在你的技术栈或其他下游系统中发生的错误。issue 接受 2 个参数:name(string)和 payload(非递归的 JS 对象)。

tracker.issue('payment_error', {code: 500, context: 42}); // after tracker.start()

使用 JavaScript 代码片段

Section titled 使用 JavaScript 代码片段

下面是一个使用代码片段发送技术性事件的示例。

<!-- OpenReplay Tracking Code -->
<script>
var initOpts = { projectKey: "GxPpaDARdn2345fgt321" };
var startOpts = { userID: "" }; 
(function(A,s,a,y,e,r){
  r=window.OpenReplay=[e,r,y,[s-1, e]];
  s=document.createElement('script');s.src=A;s.async=!a;
  ...
})("//static.openreplay.com/latest/openreplay.js", 1, 0, initOpts, startOpts);
</script>
  ...
  __OPENREPLAY__.issue('payment_error', {code: 500, context: 42}); // send a technical event (issue) later in your code
  ...
import ORTracker

ORTracker.shared.event(name: String, payload: Encodable?)

如果你想要一个使用自定义事件的实用示例,请查看我们的详细教程

在使用自定义事件时遇到问题?请加入我们的 Slack 或访问我们的论坛,从我们的社区获取帮助。