监控 Angular 2

1. 安装fundebug-javascript

npm install fundebug-javascript --save

2. 接入插件

修改app.module.ts

import { ErrorHandler } from '@angular/core';
var fundebug: any = require("fundebug-javascript");
fundebug.apikey = 'API-KEY';

// 定义FundebugErrorHandler
export class FundebugErrorHandler implements ErrorHandler {
   handleError(err:any) : void {
     fundebug.notifyError(err);
   }
}

// 使用FundebugErrorHandler
@NgModule({
   // 其他代码
   providers: [ { provide: ErrorHandler, useClass: FundebugErrorHandler } ]
 })

其中，获取apikey需要免费注册帐号并且创建项目，注意选择对应的项目类型。

3. 过滤 status 为 0 的 HTTP 上报

由于 Angular 自带框架提供的 HTTPClient 会导致 Fundebug 捕获的所有 HTTP 请求的 status 为 0，为了防止误报，建议在插件配置的时候把 status 为 0 的上报过滤。 配置方法如下：

fundebug.init({
    apikey: "YOUR-API-KEY",
    filters: [
        {
            res: {
                status: /^0$/,
            },
        },
    ],
});

参考

• Angular 文档：ErrorHandler

SystemJS

如果您使用 SystemJS, 那么需要为fundebug-javascript需要配置相应的路径才能成功。

System.config({
    paths: {
        // paths serve as alias
        "npm:": "node_modules/",
    },
    // map tells the System loader where to look for things
    map: {
        /* ... 其他配置 ...*/

        // other libraries
        /* ... 其他配置 ...*/
        "fundebug-javascript":
            "npm:fundebug-javascript/release/fundebug.x.x.x.min.js",
    },
});

注意: fundebug.x.x.x.min.js中的x.x.x要改为插件的版本号，例如fundebug.0.3.1.min.js。