接入监控数据到SLS RUM

操作步骤

1. 登录日志服务控制台。
2. 在日志应用区域，单击SLS Rum。
3. 创建实例。
   1. 在SLS RUM页面，单击创建实例。
   2. 在创建实例面板中，配置如下参数，然后单击接入数据。

      参数	描述
      实例名称	SLS RUM实例的名称。
      实例描述	SLS RUM实例的描述信息。
      项目Project	用于管理SLS RUM资产（Logstore、仪表盘等）的Project。
      实例ID	SLS RUM实例的ID。
      角色权限	日志服务使用AliyunLogETLRole访问Logstore中的数据。 如果您使用的阿里云账号还未完成AliyunLogETLRole授权，请单击您需要授权系统角色AliyunLogETLRole，根据页面提示完成授权。 如果您要使用RAM用户操作，则使用阿里云账号完成AliyunLogETLRole授权后，还需要使用阿里云账号授予RAM用户数据加工操作权限。更多信息，请参见授予RAM用户数据加工操作权限。

4. 接入数据。
   1. 在接入数据配置向导的选择框架步骤中，选择框架，然后单击下一步。
      目前仅支持Web框架。
   2. 在接入数据配置向导的配置步骤中，配置如下参数。

      参数	说明
      env环境	当您将不同环境（开发、测试、集成）中的Web页面监控数据接入到同一个RUM实例中时，env环境可用于区分不同环境中的Web页面监控数据。
      服务名	当您将不同的服务（网站、业务、部门）中的Web页面监控数据接入到同一个RUM实例中时，服务名可用于区分不同服务中的Web页面监控数据。
      会话回放	打开会话回放开关后，您可以通过可视化方式捕获和回放用户在您网站的浏览体验。更多信息，请参见会话回放。
      采样率	设置性能数据的上报量、成功的API请求数据的上报量、成功的资源加载数据的上报量。
      错误上报	打开错误上报开关，表示允许RUM SDK将上报JS错误和资源加载错误。
      上报资源性能数据	打开上报资源性能数据开关，表示允许RUM SDK将上报资源性能数据（js、css、image、audio、vedio）。
      上报请求信息	打开上报请求信息开关，表示允许RUM SDK将上报API请求数据（fetch、xhr）。
      上报页面加载性能	打开上报页面加载性能开关，表示允许RUM SDK将上报页面加载性能数据。
      链路追踪	打开链路追踪开关，表示允许RUM SDK将上报前后端链路追踪数据。该配置将联合SLS Trace服务。

      完成上述配置后，系统将生成对应的脚本信息。示例如下：

      • CDN同步

        <script src="https://o.alicdn.com/sls/sls-rum/sls-rum.js"></script>
            <script>
               window.SLS_RUM &&
                 SLS_RUM.init({
                   host: 'cn-hangzhou.log.aliyuncs.com',
                   project: 'test-demo',
                   logstore: 'dsfqwe-rum-raw',
                   instance: 'dsfqwe',
                   env:  'prod',
                   service:  'web',
                   sessionReplay:  'false',
                   enableError:  true,
                   enableResourcePerf:  true,
                   enableAjax:  true,
                   enablePerf:  true,
                   enableTrace:  true,
                   sampleRate:  0.1,
                 })
            </script>

      • CDN异步

            <script>
              (function (h, o, u, n, d) {
                h=h[d]=h[d]||{q:[],onReady:function(c){h.q.push(c)},p:[],addLog:function(log){h.p.push(log)},};d=o.createElement(u);d.async=1;d.src=n;n=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)
              })(window, document, 'script', 'https://o.alicdn.com/sls/sls-rum/sls-rum.js', 'SLS_RUM')
              SLS_RUM.onReady(function () {
                SLS_RUM.init({
                  host: 'cn-hangzhou.log.aliyuncs.com',
                  project: 'test-demo',
                  logstore: 'dsfqwe-rum-raw',
                  instance: 'dsfqwe',
                  env:  'prod',
                    service:  'web',
                    sessionReplay:  'false',
                    enableError:  true,
                    enableResourcePerf:  true,
                    enableAjax:  true,
                    enablePerf:  true,
                    enableTrace:  true,
                    sampleRate:  0.1,
                })
              })
            <script>

        根据您的配置生成上述配置项后，RUM SDK还支持添加uid、nickname、version和custom配置项。

        • uid

          RUM SDK会自动生成用户ID，统计PV/UV等信息。用户ID不具备特定的业务属性，也不能准确统计UV等信息。uid生成规则：为每个浏览器分配一个用户ID。

          SLS_RUM.init({
            // 其他配置
          
            uid: 12****87,
          })

        • nickname
          RUM SDK支持配置用户名，用于满足统计需求。

          SLS_RUM.init({
          
            // 其他配置
          
            nickname: '张三',
          })

        • version
          RUM SDK支持配置应用版本号，用于满足统计需求。version字段便于查看不同版本的上报统计情况。

          SLS_RUM.init({
            // 其他配置
          
            version: '1.0.0',
          })

        • custom

          自定义字段，JSON格式。不局限字段的属性名和内容，支持嵌套JSON格式的Value，并且支持自定义解析。

          SLS_RUM.init({
            // 其他配置
          
            custom: {
              d: 'e'，
            },
          })

   3. 将上述的脚本复制到Web页面的所有html的head标签中。
      设置完成后，RUM SDK开始上报监控数据。
   4. 在接入数据配置向导的配置步骤中，单击下一步。
   5. 在接入数据配置向导的检查数据步骤中，单击检查数据。
   6. 确认数据无误后，单击完成。

支持部分参数热更新

SLS_RUM.setOptions({
  uid: 'uid'
  nickname: 'newnickname',
  env: 'newEnv',
  custom: {
    c: 'newCustom',
  },
  version: 'newVersion',
  service: 'newService',
})

附录：SDK配置项

project: 'test-demo'

host: 'cn-hangzhou.log.aliyuncs.com'

logstore: 'dsfqwe-rum-raw'

instance: 'dsfqwe'

sampleRate: 0.1

perfSampleRate: 1

resSampleRate: 1

apiSampleRate: 1

env:  'prod'

service:  'web'

version: '1.0.0'

uid: 12****87

nickname: 'Andy'

custom: {
    d: 'e'，
  }

enableError:  true,

enablePerf:  true

enableResourcePerf:  true

enableAjax:  true

enableTrace:  false

enableConsoleLog: 'error'

enableTrackBody: 'error'

transportTimeThreshold: 2

transportCountThreshold: 10

ignoreAjax: [
            /ignore/,
            'www.example.com',
            (url) => {
              if (url.includes('example')) {
                return false
              }
              return true
            },
          ],

ignoreResource: [
            /ignore/,
            'www.example.com',
            (url) => {
              if (url.includes('example')) {
                return false
              }
              return true
            },
          ],

ignoreError: [
            /ignore/,
            'www.example.com',
            (url) => {
              if (url.includes('example')) {
                return false
              }
              return true
            },
          ],