操作配置

用户可针对某个可以点击的交互元素，例如注册、添加购物车、下载、移动广告点击、小工具、Flash元素、AJAX嵌入式元素以及视频播放等事件，将其单独配置成操作来监控其用户操作过程中的响应耗时体验。

事件分为两类:

自动创建事件：可以直接指定key为事件名称，相同key的事件将被归为一种事件。
可跨页面事件。

配置容错代码

事件监控的基础是，应用必须已嵌入并加载Browser JS探针，故为防止探针移除或未加载提前调用导致的事件监控错误，请务必在事件代码前加入容错代码，代码如下:

//容错代码，当前页面声明一次即可，当移除tingyun_rum.js时进行容错处理
if(!window.TINGYUN){window.TINGYUN={};window.TINGYUN.newAction=function(){var e={};e.end=function(){};e.fail=function(){};e.store=function(){};return e};window.TINGYUN.endStoreEvent=function(){}};

如果不添加容错代码，建议在调用接口前自行判断接口可用：

例如：

if (window.TINGYUN && window.TINGYUN.newAction) {
    window.TINGYUN.newAction({
        ...
    });
}

用户自定义操作

语法:

const action = window.TINGYUN.newAction(options[, immediate]);

参数:

options 操作配置项对象
- key: 操作名称。字符串类型。必须
- context: 操作包含的附加数据。对象类型。可选
- duration: 设置操作时间, 对于立即发送的操作, 可以设置此配置指定操作时间。number类型。可选
- timeout: 操作超时时间, 默认10分钟, 超时后的操作无法结束, number类型, 可选
immediate 是否立即发送此操作, boolean类型, 默认为false。可选

返回操作对象action, 可以用于结束操作。 action对象包含下列函数。

end: 结束操作

action.end(options);

options: 结束操作配置对象。可选
- context: 操作包含的附加数据。对象类型。可选
- status: 设置操作状态success或fail, 默认success。字符串类型。可选
fail: 以失败的状态结束操作

action.fail(options);

options: 结束操作配置对象。可选
- context: 操作包含的附加数据。对象类型。可选
store: 暂存操作, 操作相关信息会保存进localStorage中, 可以使用window.TINGYUN.endStoredAction读取并结束。主要用于跨页面的操作。结束存储操作:

action.store();

window.TINGYUN.endStoredAction(options);

options: 结束存储操作配置对象。可选
- key: 结束指定key的操作, 不传会结束当前存储的操作。字符串类型。可选
- status: 指定存储操作的结束状态。success或fail。字符串类型。可选
- timeout: 设置超时时间, 默认60s, 如果超时不上传数据。number类型。可选

示例:

提交订单的场景示例:

function submitOrder(order) {
    // 创建提交订单操作, 并传入订单id作为额外信息
    const action = window.TINGYUN.newAction({
        key: '提交订单',
        context: {
            orderId: order.id
        }
    });

    // 自定义提交订单请求业务逻辑
    sendRequest(SUBMIT_ORDER_URL, data)
        .then((res) => {
            // 提交成功, 结束操作, 并设置附加返回的业务状态码
            action.end({
                context: {
                    code: res.data.code
                }
            });
        })
        .catch(() => {
            // 提交失败, 以失败的状态结束操作
            action.fail();
        });
}

跨页面事件

如果事件在同域条件下跨页面，需要使用跨页面事件API（跨页面事件API也可以在同一个页面使用，但普通使用方式效率更高且更简洁，因此建议在需要跨页面的场景下使用此 API）。

嵌码示例：

页面1:

const action = window.TINGYUN.newAction({
    key: '跨页面事件'
});


// 执行逻辑
// 逻辑执行完后不使用end或fail, 使用store暂存当前事件 action.store(); 此时事件并未结束

action.store();

// 后续逻辑跳转页面2..

页面2:

  // 页面2加载完成后结束事件
window.addEventListener('load', function() {
    if (window.TINGYUN && window.TINGYUN.endStoredAction) {
        window.TINGYUN.endStoredAction({
            key: '跨页面事件', // 需要和页面1的事件对应, 不传会结束最近存储的事件
            status: 'success', // success 或 fail 表示事件的状态 
            timeout: 60000 // 事件超时时间，超时不会上传，不传默认60秒超时
        }); 
    }
})

如果不传参数，则默认结束最近一次存储的事件，状态为成功。

window.TINGYUN.endStoredAction();

接口说明:

window.TINGYUN.endStoredAction(); // 无参数调用 
window.TINGYUN.endStoredAction(options); // 有参数调用

endStoredAction options对象参数说明：

名称	是否必须	说明
key	否	自动结束事件key, 传递则只结束指定key的事件，不传结束当前存储的事件
status	否	自动结束事件状态。默认为成功。成功: success, 失败: fail
timeout	否	跨⻚面事件超时时间, 默认60s, 超时不上传数据

跨页面事件的处理方式和一些注意的问题：

跨页面事件同时进行的只能有一个，每次调用store函数，当前跨页面事件会使用新的事件替代。
探针数据请求会在结束事件的页面发送，如果结束事件页面与开始事件页面不是同一个页面，会默认增加一条页面的加载信息作为网络请求上传。
页面1和页面2需要同时嵌码，上传的事件归属在页面2嵌码的应用中。
页面1和页面2不能跨域。

操作配置

配置容错代码​

用户自定义操作​

跨页面事件​

配置容错代码

用户自定义操作

跨页面事件