实战教程|快速上线音视频通话:手把手教你实现呼叫与接听全流程

本文教大家基于环信 CallKit 快速实现音视频实时通话能力。

环信CallKit组件是环信即时通讯 IM 和声网实时音视频 RTC 深度整合开发的实时音视频通话框架,实现了一对一及群组音视频通话功能。只需简单集成,即可快速获得稳定流畅的高品质音视频通话能力。环信音视频通话 CallKit 可用于在线互动课堂、视频客服中心、远程会诊系统或视频相亲等场景。目前支持Android、iOS、Web端。

本文以Android端集成为例:

推荐开发环境

Android SDK: API Level 24 及以上

  • Android Studio: 推荐最新版本
  • Kotlin: 2.0.21
  • JDK: 17
  • Gradle 版本: 8.13

前提条件

1.已经注册环信管理后台账号 2.已集成环信即时通讯 IM SDK 创建应用,获取应用的 App Key,格式为 orgname#appname。 创建用户,获取用户 ID 和 IM token。 创建群组,获取群组 ID。将用户加入群组。 开通音视频服务。为了保障流畅的用户体验,开通服务后,你需等待 15 分钟才能跑通示例项目。

集成步骤

步骤一 添加依赖 在 app(module) 目录的 build.gradle.kts 文件中添加以下依赖: (注:需要使用4.16.0及以上版本)

kotlin 复制代码
dependencies {
    ...
    implementation("io.hyphenate:chat-call-kit:4.16.0")
}

步骤二 初始化 CallKit

在应用启动时(建议在Application里)初始化 CallKit: 注:CallKit是使用IM做信令的,需要先初始化IM SDK

kotlin 复制代码
//初始化环信IM SDK
       val options = ChatOptions().apply {
            this.appKey = appkey
            autoLogin = false
        }
        ChatClient.getInstance().init(this, options)
        //开启debug模式
        ChatClient.getInstance().setDebugMode(true)

        // 初始化CallKit
        val config = CallKitConfig()
        CallKitClient.init(this, config)

步骤三 配置监听器 CallKit提供 CallKitListener监听通话过程,可以在初始化时设置监听器处理通话相关的回调:

kotlin 复制代码
//CallKit监听器
private val callKitListener = object : CallKitListener {
        
        // 通话结束
        override fun onEndCallWithReason(reason: CallEndReason, callInfo: CallInfo?) {
            runOnUiThread {
                when (reason) {
                    CallEndReason.CallEndReasonHangup -> {
                        showToast("通话已挂断")
                    }
                    CallEndReason.CallEndReasonCancel -> {
                        showToast("通话已取消")
                    }
                    CallEndReason.CallEndReasonRemoteRefuse -> {
                        showToast("对方拒绝通话")
                    }
                    CallEndReason.CallEndReasonRemoteNoResponse -> {
                        showToast("对方无响应")
                    }
                    // ... 其他结束原因
                }
            }
        }
        
        // 通话错误
        override fun onCallError(
            errorType: CallKitClient.CallErrorType,
            errorCode: Int,
            description: String?
        ) {
            runOnUiThread {
                showToast("通话错误: $description")
            }

步骤四 登录IM

调用接口,登录环信IM(注:登录的环信id需提前注册)

kotlin 复制代码
ChatClient.getInstance().loginWithToken(username, token, object : ChatCallback {
        override fun onSuccess() {
            runOnUiThread {
                showToast("登录成功")
            }
        }

        override fun onError(code: Int, error: String?) {
            runOnUiThread {
                showToast("登录失败: $error")
            }
        }
    })

步骤五 发起通话

  • 发起一对一语音通话
kotlin 复制代码
CallKitClient.startSingleCall(
            CallType.SINGLE_VOICE_CALL, 
            环信id, 
         ext  //可传null
)
  • 发起一对一视频通话
kotlin 复制代码
CallKitClient.startSingleCall(
        CallType.SINGLE_VIDEO_CALL,
        环信id,
        ext  // 可传 null
    )

步骤六 接听电话

当接收到通话邀请时,CallKit 会自动触发 onReceivedCall 回调: (注:被叫用户可选择接听、拒绝或挂断通话)

  • 弹出通话邀请界面
  • 播放来电铃声
  • 显示通话邀请通知(当 App 在后台时)

恭喜你完成环信 CallKit 的快速集成!

接下来您可以基于业务需求,进一步拓展进阶功能。环信 SDK 已为这些功能提供成熟接口,你只需参考官方 Demo 中的示例代码,即可快速落地。期待你的产品借助环信 CallKit,为用户带来更流畅的通话体验!

参考文档:

相关推荐
nece0013 小时前
vue3杂记
前端·vue
Carry3453 小时前
不清楚的 .gitignore
前端·git
张鑫旭3 小时前
AI时代2025年下半年学的这些Web前端特性有没有用?
前端·ai编程
pinkQQx3 小时前
H5唤醒APP技术方案入门级介绍
前端
Lefan3 小时前
UniApp 隐私合规神器!一键搞定应用市场审核难题 - lf-auth 隐私合规助手
前端
Null1553 小时前
浏览器唤起桌面端应用(进阶篇)
前端·浏览器
Jing_Rainbow3 小时前
【Vue-2/Lesson62(2025-12-10)】模块化与 Node.js HTTP 服务器开发详解🧩
前端·vue.js·node.js
风度前端4 小时前
用了都说好的 uniapp 路由框架
前端
冴羽4 小时前
2026 年 Web 前端开发的 8 个趋势!
前端·javascript·vue.js
码银4 小时前
ruoyi的前端(vue)新增的时候给字典设置默认值 但不能正常
前端