开发Agora视频通话App时点击结束按钮卡顿问题求助

问题根源 #

1. 空安全隐患：代码中使用connectionData!强制解包，若connectionData为null会直接引发异常，阻塞后续流程导致卡顿。
2. 页面跳转时机错误：在leaveChannel回调中直接调用Navigator.pop(context)，此时endCall中的RTM退出、引擎销毁等异步操作尚未完成，上下文失效会引发状态异常。
3. 异步操作无异常捕获：endCall中的异步操作未做错误处理，一旦某个步骤出错会导致整个流程卡住。

修复步骤 #

1. 修复endCall函数，添加空安全判断与异常捕获

Future<void> endCall({required SessionController sessionController}) async {
  try {
    // 先离开RTC频道
    await sessionController.value.engine?.leaveChannel();
    
    // 安全判断RTM是否启用，避免强制解包
    if (sessionController.value.connectionData?.rtmEnabled == true) {
      // 按顺序执行RTM频道退出与客户端登出
      await sessionController.value.agoraRtmChannel?.leave();
      await sessionController.value.agoraRtmClient?.logout();
    }
    
    // 最后销毁RTC引擎
    await sessionController.value.engine?.destroy();
  } catch (e) {
    // 捕获异常，避免流程阻塞
    print("结束通话异常: $e");
  }
}

2. 调整页面跳转时机，移除leaveChannel回调中的pop

修改AgoraClient的事件处理器，删除leaveChannel中的跳转逻辑：

_client = AgoraClient(
  agoraEventHandlers: AgoraRtcEventHandlers(
    // 移除leaveChannel中的Navigator.pop
  ),
  agoraConnectionData: AgoraConnectionData(
    appId: "5a4c1108a1af4a76924c9461d120dc47",
    tempToken: tempToken,
    channelName: widget.channelName,
  ),
  enabledPermission: [Permission.camera, Permission.microphone]
);

3. 自定义结束按钮回调，确保异步操作完成后再跳转

重写AgoraVideoButtons的onCallEnd回调，等待endCall执行完毕再退出页面：

AgoraVideoButtons(
  client: _client,
  onCallEnd: () async {
    await endCall(sessionController: _client.sessionController);
    // 确认页面未被销毁再执行跳转
    if (mounted) {
      Navigator.pop(context);
    }
  },
)

4. 优化Token获取流程，移除不必要的延迟

Future<void> getToken() async {
  String link =
      "https://Agora-Node-TokenServer.vinaym4.repl.co/access_token?channelName=${widget.channelName}";

  Response _response = await get(Uri.parse(link));
  Map data = jsonDecode(_response.body);
  tempToken = data["token"];
  
  _client = AgoraClient(
    agoraEventHandlers: AgoraRtcEventHandlers(),
    agoraConnectionData: AgoraConnectionData(
      appId: "5a4c1108a1af4a76924c9461d120dc47",
      tempToken: tempToken,
      channelName: widget.channelName,
    ),
    enabledPermission: [Permission.camera, Permission.microphone]);
  
  setState(() => _loading = false);
}

内容的提问来源于stack exchange，提问作者vinay