专栏首页腾讯IVWEB团队的专栏腾讯云 Badjs 镜像使用入门
原创

腾讯云 Badjs 镜像使用入门

作者简介:王少飞

前言

“Badjs前端脚本错误监控及跟踪解决方案” 可以有效的提升web前端业务质量,但部署和使用都有一定的门槛。现在我们把这个服务制作成了腾讯云镜像,使接入和使用都很方便,不用考虑申请硬件资源以及服务的安装部署等复杂工作。

Badjs前端脚本错误监控及跟踪解决方案有如下优势

  • 一站式体系化解决方案:业务只需要简单的配置,引入上报文件,即可实现脚本错误上报,每日统计邮件跟踪方便。
  • 可视化查询系统,快速定位错误信息:web 应用程序脚本数量庞大,开发人员在如此之多的脚本中定位某个问题变得困难。BadJS 能够巧妙定位错误脚本代码,进行反馈。通过各种查询条件,快速找到详细错误日志。
  • 跨域、Script Error 等棘手问题不再是难题: tryjs 帮你发现一切。
  • 真实用户体验监控与分析:通过浏览器端真实用户行为与体验数据监控,为您提供 JavaScript 、AJAX 请求错误诊断和页面加载深度分析帮助开发人员深入定位每一个问题细节。即使没有用户投诉,依然能发现隐蔽 bug,主动提升用户体验。
  • 用户行为分析:细粒度追踪真实的用户行为操作及流程,前端崩溃、加载缓慢及错误问题,可关联到后端进行深度诊断。

产品质量的保障:浏览器百花齐放,用户环境复杂,巨大的差异导致开发人员难以重现用户遇到的问题。无法像后台一样上报所有用户操作日志。通过BadJS,上报用户端脚本错误,为产品质量保驾护航。

更详细的请查看 https://github.com/BetterJS/doc

腾讯云 Badjs 镜像使用说明

  1. 直接点击 badjs 镜像 连接进入镜像详情页,或在腾讯云服务市场中搜索 “Badjs前端脚本错误监控及跟踪解决方案”, 进入 badjs 镜像详情页 。
  1. 点击“立即使用”进入“云服务器 CVM ”购买页面,这里对机型的要求是内存不低于2G(由于系统需要安装 nodejs,mysql,mongodb,git如果系统内存小于2G,会导致 mysql 服务启动不起来),硬盘大小不小于50G(PV 越大 需要的硬盘越大每2条上报大小大致占用硬盘是 1k ,所以每增加 100W 条上报, 就要增加硬盘 500M) 。
  1. 镜像选择已经选好了“Badjs前端脚本错误监控及跟踪解决方案 v1.0”,这里可以直接进入下一步 。
  1. 选择完存储和网络,设置相关必要信息比如密码等,最后点击“开通” 。
  1. 点击“开通”后将进入“云主机创建”页面,这里主机创建需要1-2分钟 。
  1. 创建完成后会得到ip地址,如图 :

如果是已有云服务器的可以选择 badjs 镜像重装系统

1.选择重装系统

2.选择badjs镜像

重装完成后ip地址不变

Badjs系统如何使用

1.首先访问服务器的8081端口(http://服务器ip:8081/ ), 进入帮助页面 :

2.点击“我的业务”,登录管理员,初始用户名和密码是:admin/admin(登录进管理页面可以修改密码),登录进去后点击顶部菜单“申请接入”,进入 “新业务申请” 页面 :

3.填写完相关信息点击“申请”按钮, 到“项目申请列表”页面审核通过后,这个业务就可以正常使用了。 可以先进行简单的测试看系统是否正常,按照(https://github.com/BetterJS/badjs-report ) 项目的指引测试下。

管理页面右侧为展示、搜索条件:

每个条件解释如下:

1.点击每个字段可以开启或关闭相关列 。

2.选择要查看的业务 。

3.选择消息类型,点击可以开启或关闭 。

4.查找日志的起始和终止时间。

5.过滤包含或排除的关键字。

配置邮件订阅

当前版本配置邮件订阅功能步需要部署完整版单机部署。

  1. 登录到服务器,杀掉当前node进行 ;
  2. 拉取全量代码 git clone https://github.com/BetterJS/badjs-installer.git
  3. 进入到badjs-installer的目录,运行 npm run clone ,拉取各个模块 ;
  4. 运行npm run install ,安装依赖,这个步骤很容易出现问题 ,对于新用户建议进入各个模块进行npm install;
  5. phantomjs 安装不成功,请查看 #8 ;
  6. 进入badjs-web/db ,将里面的 create.sql 导入到 mysql中 ;
  7. 运行 npm run start ,启动各个模块 ;
  8. 访问 http://服务器ip:8081/index.html ,进入页面确定启动成功。

具体可以参考 单机部署邮件配置参考

订阅邮件效果展示

如下图badjs日报邮件,包含最近一个月的badjs量趋势,以及当天badjs错误有哪些类型:

以上是badjs腾讯云镜像的使用,以及badjs系统的简单介绍,最后附上github地址:

https://github.com/BetterJS/

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 浏览器自动化测试初探:使用 phantomjs 与 casperjs

    个人认为自动化测试的主要出发点有两点: 减少重复的工作。第一点,让机器自动帮我们完成需要的交互操作,验证我们的页面功能。第二点,自动监控。通过自动回归我们的页面...

    腾讯IVWEB团队
  • 如何搭建高质量、高效率的前端工程体系--页面结构继承

    本系列文章将会将会围绕整个前端的开发流程出发解决这两个问题,帮助大家提高产品质量以及开发效率。本文介绍页面利用类似的继承方式以便达到页面结构以及数据重用。

    腾讯IVWEB团队
  • Es2017 将会给我们带来什么?

    本文介绍了 es2017 管道运算的基本使用方法、通过 pipeline-operator 实现函数柯里化,以及对象继承和数据检测,了解绑定函数,string ...

    腾讯IVWEB团队
  • JQuery javascript实现父子页面相互调用

    如上图,在iframe子页面的<script>元素中,定义了taskStatus全局变量,如果希望在其父页面中获取该全局变量的值,则可在父页面的<script>...

    授客
  • 基于iframe的跨域与更新父窗体地址栏的解决方案

    管理平台前端页面需要在当前前端框架结构基础上,在顶级导航中增加两个模块:首页、运维管理模块,以此接入运维平台提供的页面。在访问到内部某个页面后,希望父窗体的地...

    前端林子
  • 生活类App原型制作分享-AnyList

    AnyList是一款可以帮你创建购物清单,并且帮助你整理食谱的生活工具App,前面引导页采用图片+文字的方式,介绍App的用法,登录注册采用选项卡切换的方式,减...

    奔跑的小鹿
  • BlackHat USA 2020 资料爬虫最佳姿势与打包下载

    现在BlackHat官网的ppt下载真是麻烦,不再像以前放在一页里面直接显示,而是在议题列表里面,一个个点进去翻看才能下载。

    泉哥
  • Android Studio编写微信页面提交功能

    1. 页面具有标题“微信” 2. 页面具有中间显示框 3. 页面具有底部选择框,并且具有选择事件 4. 页面底部选择框在进行改变的时候,我们需要中间显示框...

    砸漏
  • Confluence 6 管理文件

    文件是被附加到 Confluence 的页面上的。请参考 Upload Files 页面中的内容来了解如何附加文件到页面中。

    HoneyMoose
  • Confluence 6 管理文件 原

    文件是被附加到 Confluence 的页面上的。请参考 Upload Files 页面中的内容来了解如何附加文件到页面中。

    HoneyMoose

扫码关注云+社区

领取腾讯云代金券