钉钉机器人播报代码提交和报错信息？一点都不难

TheSnifter
532 阅读5分钟

背景

这年头的公司，如果使用钉钉作为公司的通讯工具，多多少少都会涉及到钉钉机器人。本篇文章将为大家讲解如何使用钉钉机器人进行自定义内容播报，以及在真实项目开发中如何播报项目代码提交和线上错误信息。

设置流程

1、设置钉钉机器人

既然涉及到钉钉机器人，首先肯定是需要有一个钉钉群，创建完钉钉群之后就可以在群里添加自定义的播报机器人了（目前钉钉支持的自定义机器人只允许在内部群中，大家测试的时候可以先去整一个内部群）。在点击右上角的设置，就可以看到机器人的添加，我们选择自定义机器人（大家也可以根据业务需求添加自己需要的机器人）

image.png

image.png 选择自定义机器人后会进入一个设置界面

image.png 自定义关键词：这里设置了关键词之后，只有推送到钉钉的内容中含有设置的关键词，才会触发机器人在群里进行播放

加签：勾选之后会提供一个密钥，这个密钥需要自己保管，后续将机器人与其他平台关联的时候需要这个密钥

IP地址：这个可以限制上报的IP地址，大家可以按需勾选，不是必需的

设置完上面的步骤，钉钉群的自定义机器人算是设置好了，机器人会提供一个Webhook，可以简易理解为一个POST接口，只要你调用这个接口，就会把内容上报到这里。

2、提交代码错误信息

当我们拥有这个接口之后，你可能会想在前端项目中直接调用该接口进行上报就行了，so easy。但是，这是钉钉提供的接口，并没有设置允许的域，直接在浏览器中调用会因为浏览器的安全策略被拦截。

解决方案：我们可以自己创建一个服务器添加接口（或者在已有的服务器添加一个新的接口），这个接口的作用也很简单，允许我们自己的项目进行跨域调用，然后将我们上报的内容进行一个转发，这样就可以使用自定义内容的一个上报。

image.png

这里给大家做一个简单的示范，在上报的内容中可以自行区分错误类型、报错项目等信息，至于上报内容在钉钉群的播报格式，大家可以参考一下钉钉机器人的文档。钉钉机器人开发文档

这里涉及到代码异常上报，可以给大家提供两种类型的异常监控上报

一、代码执行异常

// 这个方法适用于vue框架，在全局入口文件进行监听上报
app.config.errorHandler = (err, instance, info) => {
  let mode = import.meta.env.MODE
  let { stack } = err.error || {}
  let params = {
    // 自定义参数
    traceId: 'web-code',
    appId: 'vue',
    // 其它参数
    data: {
      stack,
      href: window.location.href,
      message: err.message
    }
  }
  // 这里可以加上环境判断，只在生产环境进行上报
  if (mode !== 'prod') {
    return console.error(err, instance, info);
  }
  fetch.post('/dingTalk/robot/message/send', params)
}
// 下面两种方法适用于任何框架
// 可采集资源加载错误
window.addEventListener(
  'error',
  function (e) {
    let mode = import.meta.env.MODE
    let { stack } = e.error || {}
    let params = {
      // 自定义参数
      traceId: 'web-code',
      appId: 'all',
    // 其它参数
      data: {
        stack,
        href: window.location.href
      }
    }
    fetch.post('/dingTalk/robot/message/send', params)
  },
  false
)
window.onerror = () => {
  let mode = import.meta.env.MODE
  let { stack } = e.error || {}
  let params = {
    // 自定义参数
    traceId: 'web-code',
    appId: 'all',
    // 其它参数
    data: {
      stack,
      href: window.location.href
    }
  }
  fetch.post('/dingTalk/robot/message/send', params)
}

二、接口返回异常

接口返回异常一般都是统一响应拦截器进行处理，上报时需要注意剔除隐私信息，也可以设置白名单排除部分接口上报。

// 响应拦截器
serive.interceptors.response.use(async (response) => {
  // 上报错误信息，根据环境进行判断上不上报
  if (import.meta.env.MODE !== 'prod') {
    return response
  }
  // 不上报的接口集合-可以对部分接口进行过滤
  let excludeLinks = []
  try {
    const { data, config } = response
    if (data.status !== 200) {
      console.log(data, config)
      // 排除特定接口不收集报错信息
      let urlObject = new URL(response.url)
      if (excludeLinks.includes(urlObject.pathname)) {
        return response
      }

      let params = {
        // 上报参数，自定义
        traceId: 'web-api',
        appId: 'all',
        // 上报信息
        data: {
          // 报错接口
          url: config.baseURL + config.url,
          // 页面路径
          href: window?.location?.href || '',
          httpStatus: data.status,
          httpMethod: config.method,
          // 响应参数
          data: data || {},
          // 请求头
          headers: config.headers,
          // 请求参数
          body: config.data
        }
      
      serive.post('/dingTalk/robot/message/send', params)
    }
  } catch (e) {
    console.error('err: ', e)
  }
  return response
})

通过上述流程的配置，当代码执行错误或接口返回异常时，就可以及时的在钉钉群进行播报，该功能一般作用于线上代码的异常监控。

3、代码提交仓库播报

首先按照第一步的操作创建钉钉机器人，获取机器人的密钥之后，在对应平台（这里的示范平台是Gitee）的代码仓库处-管理-Webhook-添加Webhook

image.png

image.png 这里添加Webhook，URL为创建的钉钉机器人提供的上报接口，签名密钥则是添加创建机器人时提供的密钥，下方的选择事件可以按需勾选，根据不同的事件在钉钉群进行上报。配置完成后该仓库对应的事件就已经生效了，可以在代码仓库中提交代码进行测试。

注意：这里播放的内容为gitee自带的，在配置钉钉机器人的关键词时必须包含内容相关的词条，否则钉钉机器人识别不到gitee播报内容的关键词，不会在群里播报

image.png

总结

钉钉机器人播报除了上述功能之外，还可以进行一些其它内容的播报，如：CI/CD工作流执行成功之后的播报、埋点定时播报等，由于涉及的内容比较复杂就不在这里一一列举，后续大家可以根据自己的需求去添加各种各样的场景。

avatar
文章
阅读
粉丝