========= iOS 访客端demo集成(含UI库) =========
======== 代码下载 ========
您可以通过以下两种方式获取到源代码:
* 下载代码压缩包:客服云sdk 及 Demo 下载 [[http://www.easemob.com/download/cs ]]
* 下载源代码:github源码地址 [[https://github.com/easemob/kefu-ios-demo ]]
欢迎大家提交PR改进和修复HelpDeskUI中的问题。
======== 运行 CustomerSystem-ios 工程 ========
从//客服云sdk 及 Demo 下载// 下载 iOS SDK 压缩包,然后解压。解压后在 kefu-iossdk-vx.x.x 文件夹下有一个kefu-ios-demo文件夹,即为CustomerSystem-ios的工程目录。
终端cd到kefu-ios-demo的podfile目录下,终端执行pod install命令,等待下载完所有的pod依赖库,即可打开CustomerSystem-ios.xcworkspace,运行kefu-ios-demo进行自定义再次开发。
===== sdk集成请参考 =====
请移步sdk集成文档[[http://docs.easemob.com/cs/300visitoraccess/iossdkvec]]
======== 工程配置 ========
=== 确保以下内容工程都配置上 才能正确使用 环信UI库 ===
=====info.plist配置 =====
* 视频通话界面图片采用字体图标方式 集成时需要把General文件夹下的字体图标库加入到工程中 如果没有视频相关可以不加
{{:cs:300visitoraccess:icfont.png?400|}}
====== 环信UI库======
环信UI库介绍主要分为两种 一种是基础会话聊天UI库 一种是音视频UI库:
* HelpDeskUI —— 基础会话聊天UI库
* HDCallUIKit —— 音视频UI库 (基于声网音视频服务,使用环信 IM 作为信令通道的开源音视频模块)
=====HelpDeskUI=====
==== 目录介绍====
* 3rdparty——ui依赖的第三方库 部分基于pod集成
* ViewController——存放所有页面的控制器类
* Views—— 存放界面的view
* Helper—— 封装发送各个类型消息的工具类
* Model—— 消息模型解析模块
* Util—— 工具类模块
====集成====
===集成基础会话聊天UI库时只需要把demo中HelpDeskUI文件夹拖入到自己项目中===
{{:cs:300visitoraccess:qq20230228-114841_2x.png?200|}}
=== 在pch文件或全局.h文件中添加如下代码===
UI库使用了第三方库Masonry作用页面布局 如果工程中也用了Masonry请把我们的如下代码放到您工程引入的#import "Masonry.h"的上边防止跟您本身使用的库导致的冲突
#ifdef __OBJC__
#import
#import "HelpDeskUI.h"
#endif
=====音视频UI库=====
==== UI库说明 ====
*音视频UI库主要分为两种 一种是融合视频(在线聊天中视频) 一种是独立视频(VEC视频) 都在HDCallUIKit下
{{:cs:300visitoraccess:hdcallkit.png?200|}}
==== HDCallUIKit 目录介绍====
General —— 通用基础工具类 两种视频都依赖这个文件下的类
Online —— 融合视频(在线聊天中视频)
VEC —— 独立视频(VEC视频)。
其中Online 和 VEC 都是独立的代码。相互不依赖 可以灵活插拔 根据需求添加对应音视频UI库
==== Online 目录介绍 ====
Fastboard —— 互动白板相关代码类
Manager —— 视频中的管理类
HDAgoraCallManager主要类 对声网sdk进行了封装 详细请查看这个类的头文件
ViewController —— 视频界面相关类
HDCallViewController 视频界面主要入口类 这个类有一个需要注意的地方 这个类包含了白板界面相关的代码 如果没有集成白板相关代码 请一定要在这个类的头文件中找到 如下代码 进行注释 即关闭 白板功能 要不然 会影响编译 因为ui库中默认都是所以功能开启的
// ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️如果不使用白板功能请一定要注释到以下的代码 ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️
//#define OnlineWhiteBoard 1
// ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️如果不使用白板功能请一定要注释到以上的代码 ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️
Views —— 视频界面需要的相关view
==== 集成接入 CEC会话中的视频 ====
=== cec监听坐席接通视频或者坐席发起视频 ===
* 在需要弹视频界面的类导入头文件 #import "HDCallAppManger.h"
* 在对应类的监听视频弹窗的通知 代码如下
// 使用HDCallUIKit中声网视频相关功能请一定注册这个通知
[[HDCallAppManger shareInstance] initAddCallObserver];
==== cec 访客发起视频 ====
HDMessage *message = [HDClient.sharedClient.callManager cec_creteVideoInviteMessageWithImServiceNum:self.conversation.conversationId content: NSLocalizedString(@"em_chat_invite_video_call", @"em_chat_invite_video_call")];
HDVisitorInfo *visitorInfo = [[HDVisitorInfo alloc] init];
visitorInfo.nickName = @"我是访客";
[message addContent:visitorInfo];
[[HDClient sharedClient].chatManager sendMessage:message
progress:nil
completion:^(HDMessage *message, HDError *error){
if (!error) {
dispatch_async(dispatch_get_main_queue(), ^(void) {
//online
[[HDCallViewController sharedManager] showViewWithKeyCenter:nil withType:HDVideoCallDirectionSend];
[HDCallViewController sharedManager].hangUpCallback = ^(HDCallViewController * _Nonnull callVC, NSString * _Nonnull timeStr) {
[[HDCallViewController sharedManager] removeView];
[[HDCallViewController sharedManager] removeSharedManager];
};
});
}
}];
==== VEC UI库目录介绍 ====
注意 所有vec相关的代码类都添加了vec 标识以便区分使用功能
VEC_Fastboard —— 互动白板相关代码类
Manager —— 视频中的管理类
HDVECAgoraCallManager主要类 对声网sdk进行了封装 详细请查看这个类的头文件
ViewController —— 视频界面相关类
HDVECCallViewController 视频界面主要入口类 这个类有一个需要注意的地方 这个类包含了白板界面相关的代码 如果没有集成白板相关代码 请一定要在这个类的头文件中找到 如下代码 进行注释 即关闭 白板功能 要不然 会影响编译 因为ui库中默认都是所以功能开启的
// ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️如果不使用白板功能请一定要注释到以下的代码 ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️
//#define HDVECWhiteBoard 1
// ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️如果不使用白板功能请一定要注释到以上的代码 ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️
Views —— 视频界面需要的相关view
==== 集成接入 VEC独立视频====
====vec监听坐席接通视频或者坐席发起视频====
在需要弹视频界面的类导入头文件 #import "HDCallAppManger.h"
在对应类的监听视频弹窗的通知 代码如下
// 使用HDCallUIKit中声网视频相关功能请一定注册这个通知
[[HDCallAppManger shareInstance] initAddCallObserver];
====vec 访客发起视频====
===访客发起视频邀请 需要注意 发起视频前 一定要保证登录了环信才可以===
// 发起视频 必要参数设置 如下代码
HDVECCallInputModel * model = [[HDVECCallInputModel alloc] init];
model.videoInputType = HDCallVideoInputDefault; // 固定类型HDCallVideoInputDefault 这个
HDVisitorInfo *visitorInfo = [[HDVisitorInfo alloc] init];
visitorInfo.nickName = @"我是访客";
model.visitorInfo = visitorInfo; //传访客信息
model.vec_imServiceNum = @"vec的im服务号"; 管理后台-》接入-〉视频客服-》关联信息获取
model.vec_configid = @"vec的插件id"; 管理后台-》接入-〉视频客服-》关联信息获取
[[NSNotificationCenter defaultCenter] postNotificationName:@"hd_easemob_vec_call" object:model];
=== cec会话内发起vec 视频邀请场景 如下是 询前引导场景下的发起视频邀请===
// cec会话内发起vec 视频邀请场景 如下是 询前引导场景下的发起视频邀请
HDVECCallInputModel * model = [[HDVECCallInputModel alloc] init];
model.videoInputType = HDCallVideoInputGuidance; // 固定类型HDCallVideoInputGuidance 这个
HDVisitorInfo *visitorInfo = [[HDVisitorInfo alloc] init];
visitorInfo.nickName = @"我是访客";
model.visitorInfo = visitorInfo; //传访客信息
model.cec_imServiceNum = @"cec的im服务号"; 管理后台-》接入-〉在线客服-》关联信息获取
// 把item 传过去 HDMenuItem 是询前引导的菜单消息解析后的model类 跳转到独立视频需要的参数都在这个解析类里边 HDCallAppManger 里边自动解析了 详细解析请参考HDCallAppManger.m这个类的实现方式
//还需要传一个当前会话过去 目前是在聊天的HDMessageViewController.h类里调用 具体请参考改类里的实现方式 如果是集成了我们的会话HelpDeskUI ui库 那询前引导的这个场景 可以不用集成因为我们我的HelpDeskUI ui库 已经集成好了 具体请参考HDMessageViewController.m内的实现方式
NSMutableDictionary * dic = [[NSMutableDictionary alloc] init];
[dic hd_setValue:self.conversation forKey:@"easemob_currentConversation"];
[dic hd_setValue:item forKey:@"easemob_currentHDMenuItem"];
[[NSNotificationCenter defaultCenter] postNotificationName:@"hd_easemob_vec_call" object:model userInfo:dic];
=== ⚠️⚠️⚠️⚠️⚠️⚠️⚠️注意 如果是 融合视频 和 独立视频 共同使用 需要根据sdk 中的isVECMessage 这个方法 进行判断是融合视频还是vec独立视频 代码请 参考 HDCallAppManger.m类里的实现方式⚠️⚠️⚠️⚠️⚠️ ===
/*!
* \~chinese
* 获取当前消息是否是 VEC 消息 yes 是vec 消息。no 不是vec 消息
*/
- (BOOL)isVECMessage:(HDMessage *)message;
====== 集成pod库======
# 环信环信UI库 依赖的第三方库
* pod 'MBProgressHUD',
* pod 'Masonry'
* pod 'SDWebImage'
#音视频UI库 依赖的声网sdk
* pod 'AgoraRtcEngine_iOS','4.1.1'
#音视频UI库 依赖的白板sdk 需要注意 如果音视频UI库 中没有涉及白板业务 不需要 导入此库
pod 'Fastboard', '1.1.2'
pod 'TZImagePickerController'
====== 选择手动导入声网sdk======
*前往 声网官网[[https://docs.agora.io/cn/video-call-4.x/downloads?platform=iOS|sdk下载]] 页面,获取客服对应的版本的SDK(目前客服集成依赖的版本是3.6.1),然后解压。
*将 SDK 包内 libs 路径下的文件,拷贝到你的项目路径下。
*打开 Xcode,添加对应动态库,确保添加的动态库 Embed 属性设置为 Embed & Sign。
===详细代码请查看demo中HDCallUIKit文件下对应的源码===