1.1.0 • Published 6 years ago

error-tracker v1.1.0

Weekly downloads
4
License
ISC
Repository
gitlab
Last release
6 years ago
    ooooooooooo oooo     oooo  oooooooo8          ooooooooooo ooooooooooo 
    88  888  88  88       88  888                  888        88  888  88
        888      88 888o8 88   888oooooo   ooooo   888ooo8        888
        888      88  888  88          888          888            888
       o888o    o88o  8  o88o o88oooo888          o888ooo8888    o888o    
       

欢迎

TMS-ET是一个用于记录前端脚本异常的组件,目标是为各个业务线产品提供统一的异常记录接口,使记录信息更丰富、完整、易于分析。

最新版本

快速开始

1.引用

  • 方式1:et.js已经放进了通用配置文件(UXStaticSharedConfig), 取通用配置文件对应节点(Name="node9"), 输出到承载页上 (建议使用)

  • 方式2:直接在运维系统配置文件中, 找到对应产品的XML配置文件, 在 HTML.hearder 顶部创建script标签, 引入et.js

  • 方式3:在项目代码里, js创建script标签, 添加进 HTML.hearder, 举例: $("<script src='.../et.js'></script>").appendTo( $('head') )

2.功能配置

需要在getExtendEtParams()方法中返回产品线信息, 示例如下:

window.ET.getExtendEtParams = function() {
    return {
        "applicationName": "ux.recruit.tms.com", // 应用名称(必填)
        "userId": Context.getUserInfo().id, // 当前用户ID(必填)
        "tenantId": Context.getTenantInfo().id // 当前租户ID(必填)
    }
};

3.测试

ET 提供了测试函数: ET.binGo()

  1. 开发者工具-> console 里执行 window.ET.binGo(), 在页面顶部左侧会生成一个测试按钮, 点击按钮会触发一个错误并记录到鹰眼服务器。
  2. 开发者工具-> network 中查看 鹰眼接口 的请求参数, 检测 ET 是否配置正确。
  3. 到鹰眼系统中查看异常信息。链接:http://ops.beisencorp.com:88/OpsAdmin/errortracker/exceptioncounts

4.Demo

http://gitlab.beisen.co/tms-ui/et/blob/master/index.html

ET Module

事件

  • etOnload

    描述: ej.js加载完毕后, 会在 window.document 对象上触发 etOnload 事件

    注意: 在IE8中, 无法在 window.document 上注册事件。 我们在 document.documentElement 对象上设置了 etOnload 属性. et.js 加载完毕后会修改此属性。

    最佳实践: 见 demo

配置项

  • ET.getExtendEtParams() 必要

    描述:产品线通过重写该方法,实现返回异常记录中的数据属性。

    返回值 Object: { key: value, key1: value1, ... }

    key 数据属性名称(鹰眼系统指定,非自定义)

    value 属性值

    window.ET.getExtendEtParams = function() {
        return {
            "applicationName": "ux.recruit.tms.com", // 应用名称(必填)
            "userId": Context.getUserInfo().id, // 当前用户ID(必填)
            "tenantId": Context.getTenantInfo().id // 当前租户ID(必填)
        }
    };
  • ET.getFieldsFormatter() 可选

    描述:对数据字段进行格式化处理。

    返回值 Object: { key: value, key1: value1, ... }

    key 需要过滤的参数

    value 参数的过滤函数 ( 注意: 返回值如果不是字符串, 最终会被JSON.stringify转换成字符串 )

    window.ET.getFieldsFormatter = function() {
    		  return {
    
    		 	  // 格式化message数据
    			  "message": function(obj) {
    					  obj['userAgent'] = navigator.userAgent;
    				  return JSON.stringify(obj);
    		  		  },
    
    		  		  // 格式化stackTrace数据
    		  		  "stackTrace": function(str) {
    		  			 return str.toUpperCase();
    				  }
    
    		  		  // 其他
    		  	  };
    		  }
  • ET.getPort() 可选

    	描述:获取鹰眼系统接口地址。
    
    	> `返回值` String
    
    	> `默认返回值` 线上鹰眼接口地址
    
    	```javascript
    	window.ET.getPort = function(){
    		return "http://10.129.8.21/api/ErrorTracker";
    	};
    	```
  • ET.getAction() 可选

    	描述:返回记录设备类型。
    
    	> `返回值` Number:1.移动端设备; 2.桌面端设备
    
    	> `默认返回值` 根据设备自动识别
    
    	> `注意`: 目前鹰眼对移动端设备只提供了日志记录的接口, 详情见[鹰眼接口使用说明文档2.0](http://ops-doc.beisencorp.com/devops/interface.html)。 如需记录移动端异常, 可以返回 2, 并用 applicationName 标示移动端即可
    
    	```javascript
    	window.ET.getAction = function(){
    		return 2;
    	};
    	```
  • ET.beforeOnWinError() 可选

    	描述:记录日之前被调用。该功能通常用来实现只记录生产环境异常的需求。
    
    	> `返回值` Boolean:true.记录日志; false.取消记录日志
    
    	> `默认返回值` true
    
    	```javascript
    	window.ET.beforeOnWinError = function(){
    		// 只记录生产环境的异常
    		return BSGlobal.env && BSGlobal.env.toUpperCase() === 'PRODUCTION';
    	};
    	```
  • ET.afterOnWinError() 可选

    	描述:记录日志之后被调用。
    
    	```javascript
    	window.ET.afterOnWinError = function(){
    		// do something.
    	};
    	```

属性

  • ET.availableExtendEtParams

    	描述:获取全部可扩展的异常数据字段。
    
    	> `返回值` Array: ['message','userId',...]
    
    	```javascript
    	var arrParams = window.ET.availableExtendEtParams;
    	```

方法

  • ET.record( paramsFilterFns )

    	描述:手动记录错误异常信息。

    参数 paramsFilterFns: function( oriParams, formattedParams ) { do something.. }

    oriParams: 未格式化的参数元数据集

    formattedParams: 通过 ET.getFieldsFormatter() 函数格式化后的参数集

    	> `返回值` Object ( ***返回值将做为鹰眼接口的请求参数*** )
    
    	```javascript
      window.ET.record(function( oriParams, formattedParams ){
          oriParams['stackTrace'] = formattedParams['stackTrace'];
          oriParams['exceptionType'] = 'TMS-RECRUIT-Code:500';
          return oriParams
      });

注意事项

  • et.js 载入后, 会重写 window.onerror 函数, 确保该函数不要被覆盖。

打包发布

  1. 在ET项目目录下执行 webpack。
  2. 命令执行完毕后, 会在 target 目录下生成一个带有当前年月日时分秒的文件夹。
  3. 带版本号的文件夹复制到 tms-recruit 项目的 extras/et/ 目录下并提交 。( master分支: 在master分支下提交的et.js会发布到外网 )
  4. 更新ET版本号。

更新记录

0.1.0 测试版
0.1.1 测试版
  • 解决Script error.时, 堆栈信息解析失败的情况
0.1.2 测试版
  • 解决没有方法名的堆栈信息解析失败的问题
0.1.4 正式版
  • et解析失败时,添加标示符 901:组装参数时异常; 902:解析堆栈时异常
  • 901时记录异常信息到鹰眼(eStack),便于之后的完善
0.1.5 正式版
  • 调整了throwClass和catchClass
  • 扩充了堆栈信息匹配规则: 没有函数名的情况( '@file:...:1:2' )
0.1.6 正式版
  • 扩充了堆栈信息匹配规则: 没有函数名的情况( '@...:1:2' )
0.1.7 正式版
  • Script error时, 如果有报错文件地址, 则用报错文件地址替换errMsg. ( jsonp请求时会出现script error情况 )
0.1.8 正式版
  • 解决用fileName替换Script error时,因为带有参数导致聚类失败的问题
0.1.9 正式版
  • 优化了record()函数的使用:自动同步exceptionFullName的值与exceptionType一致,除非手动修改
0.2.0 测试版
  • 优化了代码结构, IE低版本浏览器对列号的支持
0.2.5 测试版
  • 优化了代码结构
  • 提出bower组件
  • IE8,IE9不通过window.onerror记录异常, 通过errorCacher记录
0.2.6 测试版
  • 在window.onerror中, 不处理ie10的错误, ie10只能拿到script error., 只能用errorCacher获取错误信息
0.5.3 测试版
  • 动态切换 http / https
0.6.0 测试版
  • 提出一级配置, 二级配置
  • 可以记录白页异常
0.6.2 测试版
  • 添加资源文件请求错误记录
  • 默认如果没有appName, 取host为appName
0.6.3 测试版
  • log函数env不需要传递
0.6.5 测试版
  • 没有 userId .. 等, BSG 上的变量, 返回默认值
0.6.6 测试版
  • Script error 时, 记录报错页面的url
0.6.6 测试版
  • 修复Firefox, 出现没有列号,解析失败的情况
  • 没有堆栈的情况, 只记录错误信息
1.1.0

6 years ago

1.0.9

7 years ago

1.0.8

7 years ago

1.0.7

7 years ago

1.0.6

7 years ago