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

本文教大家基于环信 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,为用户带来更流畅的通话体验!

参考文档:

相关推荐
下家1 小时前
为了脱离前端鄙视链,于是自己写个框架 - React 党看完沉默了
前端·前端框架
zhiyouTech1 小时前
从“被看见“到“被信任“:关于信源评级机制的一点观察
大数据·前端·人工智能
Hashan1 小时前
Vibe Coding 下前后端怎么对接接口?后端不给力的兜底方案
前端·后端·vibecoding
你挚爱的强哥2 小时前
【sgKeyboard】自定义组件:虚拟键盘
前端·javascript·计算机外设
锅里游的鱼吖2 小时前
echarts自定义折线图
前端·javascript·数据库
hunteritself2 小时前
卷卷卷!GPT-6 Sol、Luna 正式发布,OpenAI 开始卷价格了
大数据·前端·人工智能·深度学习·transformer
何何____3 小时前
Vue 全局事件总线详解
前端·javascript·vue.js
涉密IT资质笔记4 小时前
涉密人员脱密期管理规范:期限分级模型、就业限制边界与违规认定标准
java·服务器·前端·网络·数据库
u0111026754 小时前
工具页案例图如何编写 alt让图片说明与处理场景对应
java·前端·javascript·图像处理·人工智能·算法·ai作画
事圆则缓4 小时前
Flutter 状态管理框架对比(五):GetX 的响应式、依赖注册与生命周期
前端·javascript·flutter