Webfunny前端监控接入指南
2024.02.17 22:18浏览量:5简介:Webfunny是一款轻量级前端异常监控和前端性能监控系统,可以帮助前端工程师定位并解决各种线上问题。本文将介绍如何将Webfunny接入前端监控系统,以确保项目健康良好的运行。
千帆应用开发平台“智能体Pro”全新上线 限时免费体验
面向慢思考场景,支持低代码配置的方式创建“智能体Pro”应用
Webfunny前端监控接入指南
Webfunny是一款轻量级前端异常监控和前端性能监控系统,可以帮助前端工程师定位并解决各种线上问题,确保项目健康良好的运行。本文将介绍如何将Webfunny接入前端监控系统。
首先,需要创建一个团队来承载项目,便于管理。在Webfunny官网(www.webfunny.cn/home.html)上注册账号并创建团队。
接下来,需要在项目中集成Webfunny监控代码。具体步骤如下:
- 在项目中找到需要监控的JavaScript文件,通常是index.html或app.js等入口文件。
- 在需要监控的JavaScript文件中引入Webfunny的监控代码。可以通过将以下代码添加到文件的底部来实现:
<script src='http://www.webfunny.cn/js/webfunny.js'></script>
- 确保在项目的配置文件中设置了正确的Webfunny配置信息。可以在项目的配置文件中添加以下代码:
window.__webfunny = {
appId: 'your_app_id', // 替换为你在Webfunny上创建的应用ID
projectId: 'your_project_id', // 替换为你在Webfunny上创建的项目ID
notify: true, // 开启机器人通知功能
monitor: true, // 开启HTTP请求监控功能
timeout: 3000 // 设置接口请求超时时间(毫秒)
};
- 重新加载页面,即可开启Webfunny前端监控。
Webfunny可以收集各种错误信息,包括jserror、on_error、console_error等类型。当发生错误时,Webfunny会自动记录错误信息并发送给服务器。同时,Webfunny还可以对HTTP请求进行监控,根据不同状态进行机器人通知,并对接口请求的超时时间进行预警设置。
此外,Webfunny还支持容器化部署。如果项目使用Docker进行容器化部署,可以将Webfunny监控代码打包到Docker镜像中。具体步骤如下:
- 创建一个Dockerfile文件,并在其中添加以下内容:
FROM node:10.6.0-slim
RUN npm install pm2 -g
COPY . /app
WORKDIR /app
RUN npm install --registry=https://registry.npm.taobao.org
RUN ln -sf /usr/share/zoneinfo/Asia/Shanghai /etc/localtime
RUN echo 'Asia/Shanghai' >/etc/timezone
EXPOSE 8010
EXPOSE 8011
CMD npm run prd
- 在项目的根目录下运行以下命令构建Docker镜像:
docker build -t your_image_name .
- 运行Docker容器:
docker run -p 8010:8010 -p 8011:8011 your_image_name
- 访问容器内的Webfunny监控页面(http://localhost:8010/webfunny/overview.html)。

发表评论
登录后可评论,请前往 登录 或 注册