天眼FAST探针(Browser)
安装
使用Yarn进行安装(推荐)
yarn add fast-tracker-browser
使用npm进行安装
npm install fast-tracker-browser
使用
建议登录天眼平台按照前端应用接入指引使用
如对该工具比较熟悉,可自行进行配置,请在应用程序入口添加以下代码
import fastTracker from 'fast-tracker-browser';
import fastTrackerConfig from '这里需要自行创建一个JSON配置文件 可从天眼平台数据接入功能中下载';
fastTracker(config);
JSON配置文件内容
其中endpoint、accessKey、app、replay.endpoint、replay.accessKey均会在下载的配置文件中默认填写
{
"endpoint": "{天眼日志服务数据上报接口域名}",
"accessKey": "{在天眼平台创建的产品下的前端日志库密钥}",
"app": "{数据接入中创建的应用名称}",
"is_spa": true,
"include_search": true,
"log_content_attribute": "data-log",
"log_event_attribute": "data-event",
"log_module_attribute": "data-module",
"report_api_params": false,
"api_ignore_urls": [],
"ignore_pages": [],
"collect_event_types": ["event","page","click","api","error","crash"],
"tenant_reader": {
"key": "",
"range": ["url","localstorage","sessionstorage","cookie","window"]
},
"real_user_reader": {
"key": "",
"range": ["url","localstorage","sessionstorage","cookie","window"]
},
"user_group_reader": {
"key": "",
"range": ["url","localstorage","sessionstorage","cookie","window"]
},
"app_version_reader": {
"key": "",
"range": ["url","localstorage","sessionstorage","cookie","window"]
},
"trace_config": {
"trace_id_type": "fast",
"rules": [],
"headers": []
},
"replay": {
"endpoint": "{MFastLog的数据上传接口}",
"accessKey": "{回放数据日志库密钥}",
"error": false,
"crash": false,
"all": false
}
}
探针配置清单
配置项 | 配置描述 | 是否必填 | 默认值 | 说明 | 配置示例 |
---|
endpoint | 探针上报地址 | 是 | 无 | 在天眼平台下载的配置会自动注入当前所属产品前端日志库的上报地址 | "https://fast-logstore-test.mypaas.com/report" |
accessKey | 探针上报KEY | 是 | 无 | 在天眼平台下载的配置会自动注入当前所属产品前端日志库的标识KEY | "P5Nn2BVv2gEbR8CspaRoFn0nvVWVCRmYMilZ5sHl1UX_k8kLRAPgf3t6kZLaWoFa=" |
app | 应用名称 | 否 | 无 | 在天眼平台下载的配置中会自动注入创建应用时填写的名称 | "analysis" |
include_search | 开启页面地址参数采集 | 否 | true | 开启后将页面URL的参数(search)部分上报为page_search字段 | true |
ignore_pages | 按页面禁用日志采集 | 否 | [] | 将屏蔽配置的列表中匹配到的页面的所有事件采集 | [".mypaas.com",".baidu.com"] |
tenant_reader | 租户读取 | 否 | {key: "",range:["url","localstorage","sessionstorage","cookie","window"]} | 根据配置的key在range指定的范围内按先后顺序读取作为tenant字段上报 | {key:"org_code",range:[”localstorage“]} |
real_user_reader | 用户读取 | 否 | {key: "",range:["url","localstorage","sessionstorage","cookie","window"]} | 根据配置的key在range指定的范围内按先后顺序读取作为real_user_id字段上报 | {key:"userinfo.code",range:[”localstorage“]} |
user_group_reader | 用户分组读取 | 否 | {key: "",range:["url","localstorage","sessionstorage","cookie","window"]} | 根据配置的key在range指定的范围内按先后顺序读取作为user_group字段上报 | {key:"userinfo.role",range:[”localstorage“]} |
app_version_reader | 应用版本读取 | 否 | {key: "",range:["url","localstorage","sessionstorage","cookie","window"]} | 根据配置的key在range指定的范围内按先后顺序读取作为app_version字段上报 | {key:"version",range:[”window“]} |
log_event_attribute | 申明式埋点事件名称属性名称 | 否 | data-event | click事件中指定作为event字段上报的由DOM读取的属性名 | data-eventname |
log_content_attribute | 申明式埋点事件内容属性名称 | 否 | data-log | click事件中指定作为logs字段上报的由DOM读取的属性名 | data-content |
log_module_attribute | 申明式埋点事件模块属性名称 | 否 | data-module | click事件中指定作为module字段上报的由DOM读取的属性名 | data-mod |
collect_event_types | 采集事件类型 | 否 | ["page","api","click","error","crash","event"] | 按照事件类型指定需要采集的日志 | ["page","api"] |
is_spa | 开启单页应用页面切换采集 | 否 | true | 开启后将增加history.pushState、history.replaceState、hashchange事件、popstate事件的监听,用于单页应用路由切换监听 | true |
report_api_params | 开启API调用参数采集 | 否 | false | 开启后将开始采集api的参数,包含querystring以及requestbody部分 | true |
api_ignore_urls | 忽略采集的API地址 | 否 | [] | 列表中匹配到的API地址不采集API日志,默认屏蔽endpoint以及其他同类产品的采集请求 | ["fast.mypaas.com/api/log"] |
api_url_regx | API地址截取 | 否 | "" | 这个配置还需要继续改造,暂未在配置表单中体现 | "" |
trace_config | 打通前后端调用链路 | 否 | {tid_type: "fast",rules:[],headers:[]} | 开启后针对rules中匹配域名的API,将添加headers中的自定义请求头,默认会添加x-fast-trace-id请求头,trace_id的类型支持fast和skywalking两种,详见下方说明 | {trace_id_type:"fast",rules:["fast.mypaas.com"],headers:[{name:"x-fast-uid",type:"built-in",value:"u"}]} |
replay | 视频回放采集 | 否 | {endpoint:"",accessKey:"",error:false,crash:false,all:false} | replay.endpoint:视频回放上报地址 replay.accessKey:视频回放上报KEY replay.error:在发生错误时上报错误前一小段时间的视频 replay.crash:与replay.error的机制相同,采集崩溃前的一段视频 replay.all:全量采集回放视频 | {endpoint:"",accessKey:"",error: true,crash:false,,all:false} |
debug | 开启调试模式 | 否 | false | 目前暂时没有明确作用,不在配置表单中体现 | false |
关于trace_config的说明
| 配置子项 | 说明 | 默认值 | 示例值 |
| :--- | :--- | :--- |
| tid_type | 跟踪ID的类型 | fast | skywalking |
| rules | 需要进行跟踪的API地址匹配规则 | [] | ['fast.mypaas.com'] |
| headers | 需要附加的请求头 | [] | [{name:"x-fast-uid",type:"built-in",value:"u"}] |
tid_type可填写fast与skywalking两个值,默认为fast
trace_id类型 | 请求头名称 | 请求头值示例 |
---|
fast | x-fast-trace-id | fast-24c02aa0b8c84c0-82cc00d917-6e2e4131_d05c4000fc2e |
skywalking | sw8 | skywalking的sw8实现 |
探针API
API名称 | API描述 | 参数说明 |
---|
registUser({tenant_code,user_account,user_group}) | 注册用户信息 | 所有参数非必填,参数与上报字段对应关系:tenant_code→tenant,user_account→real_user_id,user_group→user_group |
setBasicInfo({custom_data,app_version,app_hotupdate_version}) | 设置附加日志内容 | custom_data公共附加信息,!!#ff9900 作为cd字段上报,!! 追加至logs字段中 |
report(eventName, logs, eventModule, forceMode) | 上报埋点日志 | eventName事件名称(event字段),logs日志内容(需要JSON OBJECT,追加到logs中),eventModule事件所属模块(module字段),forceMode强制上报模式(0普通,1创建日志后立即异步上报,2创建日志后立即同步上报) |
reportError(errorData, extraInfo) | 上报前端错误 | errorData错误对象(需要使用new Error等方式创建),extraInfo错误附加信息(作为logs.extraInfo上报) |
版本日志
1.0.1
1、修复传递给MFastLog插件的endpoint缺少env参数的问题
2、修复回放日志上报endpoint缺少env参数的问题
3、修复fetch方法传递通过Headers构造的请求头参数时在添加trace-id请求头后原请求头丢失的问题
1.0.0
1、适配天眼3.0新的日志结构
2、对接天眼3.0日志服务
3、适配新的Cordova插件MFastLog
4、修复在页面LOAD事件触发前使用Image上报导致页面LOAD事件被推迟的问题