评论

一行代码完成轻量的错误监控,已适配专业debug平台请自行忽略

结合微信小程序实时日志功能,快速将错误捕获并提醒给开发者。

已适配专业debug平台请自行忽略!!!!

-------------------分割线--------------------------------

只监听了wx.onError事件,可能会存在有一些错误无法捕获,欢迎各位大佬前来指导。

另外代码内大部分用来处理收集周边数据,帮助回看错误。

配置域名

打开微信小程序后台 , 配置下方域名为合法域名

https://push.hellyw.com

需要借助iGot聚合推送实现错误消息的即时送达

引入js文件

点击下载

为方便接入,建议更名为MError.js文件

/* 

  v1.0.0

  * 推送提醒:

    服务依赖iGot小程序, 微信搜索“iGot”体验

    key的获取方式请参照:https://support.qq.com/products/111465/faqs/58267

    iGot桌面客户端 [windows && mac] 下载 : https://github.com/wahao/Electron-iGot

  * 微信实时日志:

    开发者可从小程序管理后台“开发->运维中心->实时日志”进入日志查询页面,查看开发者打印的日志信息。


*/

// 日志实时管理- 方便排查
const realtimeLogManager = wx.getRealtimeLogManager ? wx.getRealtimeLogManager() : null
// 获取当前小程序的账户信息
const accountInfo = wx.getAccountInfoSync ? wx.getAccountInfoSync() : {};
// 获取当前系统信息
const systemInfo = wx.getSystemInfoSync ? wx.getSystemInfoSync() : {};
// 获取启动信息
const launchOptions = wx.getLaunchOptionsSync ? wx.getLaunchOptionsSync() : {};
// 请求地址


module.exports = class MError {
  constructor(key = "", title) {
    try {
      this.title = title || (accountInfo.miniProgram ? `${accountInfo.miniProgram.appId}` : `${accountInfo.plugin.appId }(${accountInfo.plugin && accountInfo.plugin.version || ""}) `) || "小程序"
      this.key = key || ""
      this.host = `https://push.hellyw.com/${this.key}`
      let self = this
      wx.onError((error) => {
        self.log(error)
      })
    } catch (err) {
      console.error(err)
    }
  }
  uploadLog(obj) {
    let self = this
    try {
      console.error(obj)
      realtimeLogManager && realtimeLogManager.error(obj)
      wx.request({
        url: self.host,
        header: {
          "content-typ": "application/json"
        },
        method: "POST",
        data: obj
      })
    } catch (err) {
      console.error(err)
    }
  }
  _getUserInfo() {
    return new Promise((resolve, reject) => {
      try {
        wx.getUserInfo({
          complete: (res) => {
            resolve(res.userInfo || {})
          }
        })
      } catch (err) {
        resolve({})
      }
    })
  }
  _getLocation() {
    return new Promise((resolve, reject) => {
      try {
        wx.getLocation({
          complete: (res) => {
            resolve(res || {})
          }
        })
      } catch (err) {
        resolve({})
      }
    })
  }
  getUser() {
    // 读取设置 - 已被允许的权限 尽可能获取
    let self = this
    return new Promise((resolve, reject) => {
      try {
        wx.getSetting({
          complete: async res => {
            try {
              if (!res.authSetting || (!res.authSetting['scope.userInfo'] && !res.authSetting['scope.userLocation'])) return resolve({})
              resolve({
                userInfo: res.authSetting['scope.userInfo'] ? await self._getUserInfo() : {},
                location: res.authSetting['scope.userLocation'] ? await self._getLocation() : {},
              })
            } catch (err) {
              resolve({})
            }
          }
        })
      } catch (err) {
        resolve({})
      }
    })
  }
  log(error) {
    try {
      let params = {
        title: this.title,
        content: `${typeof error !== 'object' ? error : '当前程序出现一个错误,请及时关注'} [更详细的错误参数可进入“iGot”小程序内查看]`,
        error: typeof error === 'object' ? error : '错误日志已打印。更多细节,请通过微信后台【“开发->运维中心->实时日志”】查看',
        extras: Object.assign({}, {
          accountInfo: accountInfo,
          systemInfo: systemInfo,
          launchOptions: launchOptions,
          storageInfo: wx.getStorageInfoSync ? wx.getStorageInfoSync() : {}
        })
      }
      this.getUser().then(userInfo => {
        params.extras = Object.assign({}, params.extras, {
          user: userInfo
        })
        this.uploadLog(params)
      })
    } catch (err) {
      console.error(err)
    }

  }
}

部署代码

app.json 中引入该js文件

const MError = require('/utils/MError')

app.jsApp({})内加入如下代码,key更换为您自己的key 。 关于iGot的使用,此处不赘述

建议使用临时key,如需项目组多人接收,建议使用不公开的订阅链接key。获取方式:https://support.qq.com/products/111465/faqs/58267

$mError: new MError(key,'推送标题')

其他地方使用可直接 app.$mError.log('error')即可

效果

至此,就已经成功实现了 。 来看看效果吧!!!

手机端成功接收。

最后一次编辑于  2020-02-09  
点赞 0
收藏
评论

1 个评论

  • 不知谓
    不知谓
    2020-01-03

    社区的markdown好像升级了之后,排版好难看

    2020-01-03
    赞同
    回复 1
    • Code Weaver
      Code Weaver
      2020-01-07
      在修复
      2020-01-07
      回复
登录 后发表内容