更新记录

2.4.3(2024-11-01) 下载此版本

  • 支持外部传递rtc channel name和rtc uid

2.4.2(2024-06-20) 下载此版本

修复了偶现铃声从听筒出来的问题

2.4.1(2024-06-17) 下载此版本

支持通话状态通知

查看更多

平台兼容性

Android Android CPU类型 iOS
适用版本区间:5.0 - 14.0 armeabi-v7a:未测试,arm64-v8a:未测试,x86:未测试 适用版本区间:11 - 16

原生插件通用使用流程:

  1. 购买插件,选择该插件绑定的项目。
  2. 在HBuilderX里找到项目,在manifest的app原生插件配置中勾选模块,如需要填写参数则参考插件作者的文档添加。
  3. 根据插件作者的提供的文档开发代码,在代码中引用插件,调用插件功能。
  4. 打包自定义基座,选择插件,得到自定义基座,然后运行时选择自定义基座,进行log输出测试。
  5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项:使用HBuilderX2.7.14以下版本,如果同一插件且同一appid下购买并绑定了多个包名,提交云打包界面提示包名绑定不一致时,需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择


本文档介绍基于 Vue 框架(支持 Vue 2&Vue 3)快速集成网易云信 RTC 音视频通话点对点呼叫组件。

插件概述

网易云信音视频呼叫(呼叫组件 NERtcCallKit)是网易云信推出的含 UI 组件,您只需要几行代码,就可以快速实现音视频呼叫,在 App 中添加包括呼叫、接通、拒接、以及通话中音频和视频的开关控制功能,并包含呼叫的 UI 界面。

呼叫组件基于云信信令、音视频通话 2.0 和 IM 即时通讯产品封装的融合性场景组件,简化了呼叫流程,将呼叫功能以 UI 组件化的形式提供给客户,提高接入效率、降低使用成本。

呼叫组件(NERtcCallKit)支持的功能如下表所示。

功能
描述
自定义 UI 开发者可以自行设计通话和呼叫页面 UI。
音视频呼叫 App 通过此功能通知被叫用户呼叫请求,呼叫请求类型包括音频和视频呼叫。
音视频通话 接通后可依照呼叫类型进行实时通话。
音视频控制 通话过程中可以控制本端音频或视频的开关,以及摄像头方向等。
话单 每次通话结束后都会收到对应的话单消息,标记本次通话是否接通以及通话时间、类型等数据。

限时优惠活动

如果您在 Dcloud 平台下载了该组件,您可登录云信控制台(Dcloud专属链接)进行开通与管理。

此外通过以上 Dcloud 平台的专属链接成功注册账号并开通服务的用户,云信将提供特别的优惠价,可在开通账号后联系云信销售或技术支持。

Demo 体验

平台 二维码
Android
iOS

Demo 效果图

技术支持

网易云信提供多种服务,包括客服、技术支持、热线服务、全流程数据监控等,建议扫码添加我们的技术支持,协助接入、测试以及定制需求。 在线咨询 电话咨询
点击在线咨询 4009-000-123

准备工作

1. 申请 AppKey

用户在使用本插件之前需要获取AppKey,AppKey 申请的具体流程请参见 创建应用并获取AppKey

2. 获取账号

本插件使用中需要 account 和 token,具体请参见 注册云信IM账号

3. 开通服务

使用音视频呼叫(呼叫组件)之前,需要开通部分能力,开通的具体流程请参见 开通服务

4.开发环境

  • HBuilderX
  • sass(sass-loader 版本 <= 10.1.1)
  • node(16.0.0 <= node 版本 <= 17.0.0, 推荐使用 Node.js 官方 LTS 版本 16.17.0)
  • npm(版本请与 node 版本匹配)

快速接入

说明

本项目为App原生语言插件,请参考原生语言插件的集成方式进行集成。

步骤一:在 vue 页面中引入原生插件

使用 uni.requireNativePlugin 的 API 在 vue 页面中引入原生插件,参数为插件的 ID。

var demo = uni.requireNativePlugin("netease-CallKit")

步骤二:初始化组件

接口

initConfig({params}, callback(ret))

params

appKey:

account:

token:

rtcUid:

  • 类型:Number
  • 描述:(可选值)云信 RTC Uid

apnsCername:

  • 类型:String
  • 描述:(可选值)云信 Apns 推送证书名

pkCername:

  • 类型:String
  • 描述:(可选值)云信 PushKit 推送证书名

language

  • 类型:String
  • 描述:(可选值)语言,zh为中文,en为英文,不填默认跟随系统

enableFloatingWindow

  • 类型:布尔类型
  • 描述:(可选值)是否开启悬浮窗,true开启,false不开启

enableAutoFloatingWindowWhenHome

  • 类型:布尔类型
  • 描述:(可选值)是否开启回到桌面自动开启悬浮窗,true开启,false不开启

enableForegroundService

  • 类型:布尔类型
  • 描述:(可选值)是否开启前台服务,true开启,false不开启

enableAudio2Video

  • 类型:布尔类型
  • 描述:(可选值)是否显示语音转视频的按钮,true开启,false不开启,默认显示

enableVideo2Audio

  • 类型:布尔类型
  • 描述:(可选值)是否显示视频转语音的按钮,true开启,false不开启,默认显示

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
{
    code:200,                   // Int类型;失败初始化返回 code(登录成功返回 200)
    message:''                     // String 类型;失败初始化接口信息
}

示例代码

demo.initConfig({
    appKey: "appkey123456789",
    account: "123456789",
    token: "123456789",
    apnsCername: "",
    pkCername: "",
    language: "",
    enableFloatingWindow: true,
    enableAutoFloatingWindowWhenHome: true,
    enableForegroundService: true,
}, (ret) => {
    if (ret.code != 200) {
        var msg = 'init失败\n错误码:' + ret.code + '\n错误信息:' + ret.message;
        uni.showToast({
            title: msg,
            icon: "none"
        })
    } else {
        uni.showToast({
            title: 'init成功 ' + ret.code,
            icon: "none"
        })
    }
})

可用性

  • iOS系统:可提供的 11 及更高版本
  • Android系统:可提供的 21 及更高版本

步骤三:登录

接口

login({params}, callback(ret))

params

appKey:

  • 类型:String
  • 描述:云信应用的 AppKey

account:

token:

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
{
    code:200,                   // Int类型;失败登录返回 code(登录成功返回 200)
    message:'',                     // String 类型;失败登录接口信息
    loginInfo:{                 // 登录信息
        account:"123456",       // String 类型;账号ID
        token:"456789"          // String 类型;账号token
    }
}

示例代码

demo.login({
    account: '123465',
    token: '456789'
}, function(ret) {
    if (ret.code != 200) {
        var msg = '登录失败\n错误码:' + ret.code + '\n错误信息:' + ret.message;
        uni.showToast({
          title: msg,
          icon: 'none',
        })      
    } else {
        uni.showToast({
          title: '登录成功',
          icon: 'none',
        })
    }
})

可用性

  • iOS系统:可提供的 11 及更高版本
  • Android系统:可提供的 21 及更高版本

步骤四:拨打通话

接口

toCallPage({params}, callback(ret))

params

calledAccount:

  • 类型:String
  • 描述:被叫账号,即 account 账号

type:

  • 类型:Int
  • 描述:呼叫类型(1: 音频呼叫, 2: 视频呼叫)

calledShowName:

  • 类型:String
  • 描述:被叫展示名称,即呼叫的时候展示的名称

rtcChannelName:

  • 类型:String
  • 描述:RTC频道名称

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
{
    code:200,                   // Int类型;错误码(呼叫成功返回 200)
    message:''                  // String 类型;错误信息(呼叫接口信息)
}

示例代码

demo.toCallPage({
    calledAccount:'123456',
    type:2
}, function(ret) {
    if (ret.code != 200) {
        var msg = '呼叫失败\n错误码:' + ret.code + '\n错误信息:' + ret.message;
        uni.showToast({
          title: msg,
          icon: 'none',
        })      
    } else {
        uni.showToast({
          title: '呼叫成功',
          icon: 'none',
        })
    }
})

可用性

  • iOS系统:可提供的 11 及更高版本
  • Android系统:可提供的 21 及更高版本

步骤五:更多特性

一、登出

demo.logout({}, (ret) => {
    if (ret.code != 200) {
        uni.showToast({
          title: '登出失败 ' + ret.code,
          icon: 'none',
        })
    } else {
        uni.showToast({
          title: '登出成功 ',
          icon: 'none',
        })
    }
})

二、通话状态监听

如果您的业务需要 监听通话的状态,例如:异常、通话开始、结束等,可以监听以下事件:

//接收到邀请
// e.callType 呼叫类型,1: 语音呼叫;2: 视频呼叫
// e.callerAccount 呼叫账号
callKitEvent.addEventListener('onReceiveInvited', function(e) {
      console.log('onReceiveInvited' + JSON.stringify(e));
});

//通话建立
// e.callType 呼叫类型,1: 语音呼叫;2: 视频呼叫
// e.callId 通话Id
// e.callerAccount 呼叫账号
// e.calledAccount 被呼账号
// e.currentAccount 当前账号
callKitEvent.addEventListener('onCallConnected', function(e) {
  console.log('onCallConnected' + JSON.stringify(e));
});

//通话类型变更
// e.callType 呼叫类型,1: 语音呼叫;2: 视频呼叫
callKitEvent.addEventListener('onCallTypeChange', function(e) {
  console.log('onCallTypeChange' + JSON.stringify(e));
});

//通话结束
//  e.code 错误码 
// (code:12 手动取消;code:2 超时取消;code:14 对方拒接通话;code:15 接听并自己结束通话;code:16 接听并对方结束通话)
//  e.message 错误信息
callKitEvent.addEventListener('onCallEnd', function(e) {
  console.log('onCallEnd' + JSON.stringify(e));
});

// 远端用户是否开启视频流采集
//  e.account 账号
//  e.mute 是否静音
callKitEvent.addEventListener('onVideoMuted', function(e) {
  console.log('onVideoMuted' + JSON.stringify(e));
});

// 远端用户是否开启音频流采集
//  e.account 账号
//  e.mute 是否静音
callKitEvent.addEventListener('onAudioMuted', function(e) {
  console.log('onAudioMuted' + JSON.stringify(e));
});

常见问题

运行iOS的时候,需要在项目根目录的manifest.json中的“App权限配置”中配置麦克风和摄像头权限

同时集成呼叫组件和推送插件后无法正常呼叫

需要在控制台开通IM的多端登录

隐私、权限声明

1. 本插件需要申请的系统权限列表:

"android.permission.ACCESS_NETWORK_STATE" - 网络状态权限 "android.permission.CAMERA" - 相机权限 "android.permission.RECORD_AUDIO" -录音权限 "android.permission.FOREGROUND_SERVICE" -后台服务权限 "android.permission.SYSTEM_ALERT_WINDOW" -弹窗权限

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT License

Copyright (c) 2022 NetEase, Inc.

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问