前端监控埋点部署教程技术分享:5步教你快速部署埋点系统

591 阅读2分钟

封面222.png

提示:部署前可以先查看webfunny相关文档

环境要求

请安装NodeJS,版本号:10.6.0及以上。

第一步、下载(clone)最新部署包,初始化

1.本地克隆代码$:' git clone https://github.com/a597873885/webfunny_event.git '

使用码云仓库$:' git clone https://gitee.com/webfunnyMonitor/webfunny_event.git '(github网络不稳定,可以使用码云地址)

2.在项目根目录下执行初始化命令和安装命令$:npm run init && npm install

  建议切换淘宝镜像:' npm config set registry http://registry.npm.taobao.org/ '

  默认没有bin目录,执行' npm run init '命令生成bin目录

3.确认是否安装了pm2,如果没有安装pm2,请执行安装命令$:npm install pm2 -g

 

第二步、配置数据库(Mysql)连接

1. 安装 Mysql 数据库(Mysql安装教程)

2. 创建数据库
数据库名称:webfunny_db。
字符集设置:[Default Character set]:utf8、 [Default Collation]:utf8_bin

3. 数据库连接配置
进入webfunny_monitor/bin/mysqlConfig.js文件中(如果没有数据库,可以联系我,使用测试数据库哦)

module.exports = {
  write: {
    ip: 'xxx.xxx.xxx.xxx',         // 远程ip地址
    port: '3306',                  // 端口号
    dataBaseName: 'webfunny_db',   // 数据库名
    userName: 'root',              // 用户名
    password: '123456'             // 密码
  }
}

 

第三步、本地部署运行

1) 此时此刻,本地配置已经完成了,尝试运行命令$: npm run prd
如果提示报错:Script already launched,说明程序已经运行了,请使用$: npm run restart

2) 打开浏览器,访问地址:http://localhost:8010/webfunny_event/register.html?type=1 (初始化管理员账号,并登录)

3) 创建新项目后,可以看到探针部署教程,完成部署。

 

第四步、生产环境部署 

1. IP地址或者域名配置(方式一)
进入webfunny_monitor/bin/domain.js文件中(注意,对应的端口号要保持一致)

IP地址配置方式:
module.exports = {
  localServerDomain: 'xxx.xxx.xxx.xxx:8015',    // 日志上报域名
  localAssetsDomain: 'xxx.xxx.xxx.xxx:8014',    // 日志上报域名
  
  localServerPort: '8015',                      // 日志上报端口号
  localAssetsPort: '8014',                      // 前端页面端口号
}

2. 代理域名配置,去掉端口号(方式二)
使用代理域名的用户,请一定要理解清楚Nginx代理的方法

代理域名配置方式(端口号还是需要配置的):
module.exports = {
  localServerDomain: 'www.baidu.com',      // 日志上报域名
  localAssetsDomain: 'www.baidu.com',      // 可视化服务域名
  
  localServerPort: '8011',                 // 日志上报端口号
  localAssetsPort: '8010',                 // 前端页面端口号
}

 

第五步、添加执行权限

正常情况下 createTable.sh, restart.sh 这两个脚本没有执行权限,需要用户手动授权。
linux、mac系统,需要在项目根目录下执行命令$:chmod 755 createTable.sh, chmod 755 restart.sh 进行授权。

其他操作系统,请自行搜索授权方式。【注意】如果不授权,可能无法自动创建每天的数据库表。

 

恭喜您,Webfunny这样就部署好了,快去尝试部署到线上环境吧。

关于Webfunny

Webfunny专注于微信小程序、H5前端、PC前端线上应用实时监控,实时监控前端网页、前端数据分析、错误统计分析监控和BUG预警,第一时间报警,快速修复BUG!支持私有化部署,容器化部署,可支持千万级PV的日活量 !!