火山引擎“应用性能监控全链路版”实践

·  阅读 2037

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动

前两天刚看了一篇文章应用性能前端监控,字节跳动这些年经验都在这了,决定试用一下这个应用性能监控全链路版系统,目前面向新用户提供了试用 30 天的限时免费服务。

温馨提示:一定要看到最后,前面的操作包含试错的过程,操作不对,最后的操作才是正确的

注册

注册时,需要绑定手机号,毕竟现在账号和密码太多了,一般也难得记住,直接用手机号和验证码登陆已经是很通用的方式了。

demo

默认进入系统之后,是没有权限的,只能查看 Demo,如下图所示: ic_register_5.png

要想开通 30 天免费试用,必须进行实名认证并且开通业务。

试用

产品试用文档介绍:www.volcengine.com/docs/6431/6…

应用与权限文档介绍:www.volcengine.com/docs/6431/7…

  1. 实名认证

如果要申请 30 天免费试用,必须先在进行实名认证,实名认证要绑定身份证和银行卡,然后在后台创建应用,最后填写一个申请表,等待工作人员处理就行。

申请表链接:wenjuan.feishu.cn/m/cfm?t=s6R…

  1. 创建项目

进入管理后台,点击“访问控制”->“项目管理”->“新建项目”,如下图所示:

这个地方发现了一个 bug,这个备注的编辑是有问题的,修改不了。工单中没看见提问题的地方,只能在这提示下了

项目中可以添加成员,添加角色;还可以查看“已添加资源”,这个是和应用绑定了,即查看绑定的应用信息

ic_register_3.png

  1. 创建应用

进入管理后台,点击“我的应用”->“创建应用”,当然,应用中可以关联之前创建的项目,如下图所示:

ic_register_2.png

Web 端监控

官方文档:www.volcengine.com/docs/6431/6…

我目前体验的仅仅是 web 端的监控,还可以进行服务端、APP 端、小程序等的监控。

  1. 安装及配置

我是用的 npm 接入形式

// 1. 安装
npm install @apm-insight-web/rangers-site-sdk

// 2. main.js配置
// 默认配置只需要配置app_id,其他的功能开启类配置,都默认开启了
import RangersSiteSDK from "@apm-insight-web/rangers-site-sdk";
RangersSiteSDK("config", {
  app_id: '你的appid',
  // app_id: 257357,

  // 功能开启类, 如果要关闭,需要设置代码
  hookXHR: true, // 是否劫持xhr, 默认 true
  hookFetch: true, // 是否劫持fetch, 默认 true
  enableFMP: true, // 是否计算fmp, 默认true
  enablePerformance: true, // 是否监控性能, 默认true
  enableResourcePerformance: true, // 是否监控静态资源性能,默认 true
  enableStaticError: true, // 是否捕获静态资源异常, 默认true
  enableCatchJSError: true, // 是否捕获JS异常, 默认true
  enableBreadcrumb: true, // 是否采集用户行为, 默认true
});
复制代码
  1. 验证是否开启成功

在谷歌浏览器控制台中,查看上报请求。默认上报路径为https://tbm.snssdk.com/monitor_browser/collect/

ic_register_4.png

重来一次

一顿操作猛如虎,一看战绩零杠五。

真的是一脸懵逼,突然发现好像项目配置的不对,看不到系统的性能分析。后来确定真的是配错地方了,贼尴尬的

创建新应用

快捷入口地址:console.volcengine.com/apmplus/con…

直接通过“快捷入口”创建的应用(“创建新应用”),会显示在下面的“应用接入”中,但是我们编辑时,是看不到 AppIDAppKey 信息。

ic_register_7.png

右侧的"应用使用情况"可以看到,默认监控权限都是没有开的,需要填写试用申请表,在试用群中联系“小助手”帮我们开通一下。下图是没有开通权限的情况:

ic_register_6.png

使用已有应用

(1)创建应用

正确的使用文档应该是这个:火山引擎接入应用流程

按照上述文档的第 5 步操作,新建一个自己的集团。之后进行操作如下操作:

“我的集团”=>“新增接入”=>"应用性能监控 立即接入"=>"业务模式"选择

‘ic_register_10.png

如下图所示,新增成功后,就可以在详情中查看应用的AppIDAppKey

ic_register_9.png

(2)通过“快捷入口”创建应用(“使用已有应用”),填入上面创建应用的AppIDAppKey 信息,保存后会自动显示成“应用名称”和“英文名称”,之后也看不到应用的AppIDAppKey自己要千万要记住呀ic_register_8.png

开通试用权限之后,就是如下的形式,可以正常使用了:

截屏2021-09-27 下午3.40.45.png

分类:
前端
收藏成功!
已添加到「」, 点击更改