# 发送自定义事件
<a name="CloudWatch-RUM-custom-events"></a>

CloudWatch RUM 可记录并摄取 [CloudWatch RUM Web 客户端收集的信息](CloudWatch-RUM-datacollected.md) 中列出的事件。如果您使用 1.12.0 或更高版本的 CloudWatch RUM Web 客户端，则您可以定义、记录和发送其他自定义事件。对于您定义的每个事件类型，您可以定义事件类型名称和要发送的数据。每个自定义事件负载最多可达 6KB。

只有当应用程序监视器启用了自定义事件时，才会摄取自定义事件。要更新应用程序监视器的配置设置，请使用 CloudWatch RUM 控制台或 [UpdateAppMonitor](https://docs.aws.amazon.com/cloudwatchrum/latest/APIReference/API_UpdateAppMonitor.html) API。

启用自定义事件，然后定义和发送自定义事件，即可搜索它们。要搜索自定义事件，请使用 CloudWatch RUM 控制台中的 **Events**（事件）选项卡。请使用事件类型进行搜索。

## 要求和语法
<a name="CloudWatch-RUM-custom-event-syntax"></a>

自定义事件由事件类型和事件详细信息组成。其要求如下：
+ **事件类型**
  + 这可以是事件的 **type**（类型）或 **name**（名称）。例如，名为 **JsError** 的 CloudWatch RUM 内置事件类型的事件类型为 `com.amazon.rum.js_error_event`。
  + 长度必须介于 1-256 个字符之间。
  + 可以是字母数字字符、下划线、连字符和句点的组合。
+ **事件详细信息**
  + 包含要在 CloudWatch RUM 中记录的实际数据。
  + 必须是由字段和值组成的对象。

## 记录自定义事件的示例
<a name="CloudWatch-RUM-custom-event-examples"></a>

有两种方法可以在 CloudWatch RUM Web 客户端中记录自定义事件。
+ 使用 CloudWatch RUM Web 客户端的 `recordEvent` API。
+ 使用自定义插件。

**使用 `recordEvent` API 发送自定义事件，NPM 示例**

```
awsRum.recordEvent('my_custom_event', {
        location: 'IAD', 
        current_url: 'amazonaws.com', 
        user_interaction: {
            interaction_1 : "click",
            interaction_2 : "scroll"
        }, 
        visit_count:10
    }
)
```

**使用 `recordEvent` API 发送自定义事件，嵌入式脚本示例**

```
cwr('recordEvent', {
    type: 'my_custom_event', 
    data: {
        location: 'IAD', 
        current_url: 'amazonaws.com', 
        user_interaction: {
            interaction_1 : "click",
            interaction_2 : "scroll"
        }, 
        visit_count:10
    }
})
```

**使用自定义插件发送自定义事件的示例**

```
// Example of a plugin that listens to a scroll event, and
// records a 'custom_scroll_event' that contains the timestamp of the event.
class MyCustomPlugin implements Plugin {
    // Initialize MyCustomPlugin.
    constructor() {
        this.enabled;
        this.context;
        this.id = 'custom_event_plugin';
    }
    // Load MyCustomPlugin.
    load(context) {
        this.context = context;
        this.enable();
    }
    // Turn on MyCustomPlugin.
    enable() {
        this.enabled = true;
        this.addEventHandler();
    }
    // Turn off MyCustomPlugin.
    disable() {
        this.enabled = false;
        this.removeEventHandler();
    }
    // Return MyCustomPlugin Id.
    getPluginId() {
        return this.id;
    }
    // Record custom event.
    record(data) {
        this.context.record('custom_scroll_event', data);
    }
    // EventHandler.
    private eventHandler = (scrollEvent: Event) => {
        this.record({timestamp: Date.now()})
    }
    // Attach an eventHandler to scroll event.
    private addEventHandler(): void {
        window.addEventListener('scroll', this.eventHandler);
    }
    // Detach eventHandler from scroll event.
    private removeEventHandler(): void {
        window.removeEventListender('scroll', this.eventHandler);
    }
}
```