实时音视频Web接入——异常处理

• 2020 年 4 月 4 日
• 筆記

不同于一般的Web应用开发，实时音视频对网络质量的要求更高，过往对Web应用开发的经验在实时音视频场景下是不够的。下面我总结一些实际业务场景可能会遇到的问题，以及相应的处理方法。

在接入API文档中，可以将错误类型大致分为2类，回调和通知。

回调错误符合常规的Web开发习惯，理解上也没有难度，这里我主要介绍通知类型的错误。

α. 怎么办

1. 处理流程

2. 代码示例

// 下面代码的 client 是 client实例  // https://www.qcloudtrtc.com/trtc-web-sdk/docs/api/Client.html    // 异常监听  client.on('error', error => {    // 业务侧数据上报    let errorCode = error.getCode()    let errorCodeHex = `0x${errorCode.toString(16)}`    console.error('[trtc] client error observed: ' + error)    switch (errorCode) {      case 0x4001:        retryOrReload('websocket 初始化失败', errorCodeHex)        break      case 0x4002:        retryOrReload('websocket 信令通道异常', errorCodeHex)        break      case 0x4003:      case 0x4005:        retryOrReload('音视频数据传输通道错误', errorCodeHex)        break      case 0x4004:        retryOrReload('进房失败', errorCodeHex)        break      case 0x4041:        retryOrReload('媒体传输服务超时', errorCodeHex)        break      case 0x4042:        retryOrReload('远端流订阅超时', errorCodeHex)        break      case 0xffff:        retryOrReload('未知错误', errorCodeHex)        break      default:        retryOrReload(`错误代码 ${errorCode}（0x${errorCode.toString(16)}）`, errorCodeHex)        break    }  })    // 重连逻辑  // 建议有一个重连的上限，例如 3 次，这里只做重连操作  const retryMaxTimes = 3    function retryOrReload(msg, code) {      // 经过了若干次尝试仍然无法重连成功      if ( retryTimes > retryMaxTimes) {          alert( `网络状态异常(${code})，请您检查网络连接刷新页面尝试重连。`)          return      }      // 重连逻辑，离开，再加入房间      client        .leave()        .then(() => {          client.join({... }).catch(e => {            retryOrReload(msg)          })        })        .catch(e => {          retryOrReload(msg)        })  }  

上面回答了怎么办问题。如果想了解背后的逻辑，可以往下看。

β. 为什么

1. 错误的类型这么多，为什么最后只给用户弹出一个网络状态异常的提示？

用户不是开发者，不必也无需了解这些背后的原因，你只需要告诉他结论，以及怎么办，就够了。

2. 其他问题

可以评论留言