vue中使用钉钉群接受运维警报

发表于 | 更新于

#使用钉钉机器人发送错误信息到钉钉群 ==官网api入口

前端代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
const isDev = process.env.NODE_ENV === 'development'

// 支持markdown语法
export function sendDingding({ content = '测试内容', title = '错误日志' }) {
  const url = window.location.href
  const userAgen = navigator.userAgent
  const text = `### 项目名称：
 > 口碑活动手机项目 

 ### 访问URL：
 > ${url} 

  ### UserAgent：
 > ${userAgen} 

 ### 错误信息：
 > ${content}`

  axios({
    url: '代理地址',
    method: 'post',
    data: {
      isDev,
      msgtype: 'markdown',
      markdown: {
        title,
        text
      }
    }
  })
}
#node代理（防止跨域）
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 发送钉钉消息
async dingding(ctx) {
  const body = ctx.request.body
  const access_token = body.isDev
    ? '这里是token'
    : '这里是token'
  const { data } = await axios({
    url: 'https://oapi.dingtalk.com/robot/send',
    method: 'post',
    params: {
      access_token
    },
    data: body
  })
  ctx.state.data = data
}

main.js中全局错误处理（注意不能cach住异步错误）

1
2
3
4
5
6
Vue.config.errorHandler = (err, vm, info) => {
  console.log(`组件${vm.$vnode.tag}发生错误：${err.message},${info}`)
  sendDingding({
    content: `组件${vm.$vnode.tag}发生错误：${err.message},${info}`
  })
}

群机器人设置入口

image
image

预览图片

错误信息就可以发送至钉钉群中

image