========= 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文件下对应的源码===