目录

iOS 访客端demo集成(含UI库)

  • 为了方便您快速了解我们的访客端SDK所提供的各种能力,我们对外开放了访客端集成Demo的全部源码,里面包含了对话过程中的业务处理及上层UI库;
  • 通过这个Demo源码,可以帮助产品人员快速了解我们的访客端功能,可以帮助研发人员快速了解集成技术逻辑,帮助测试人员通过对比demo和您自己的app,更快定位问题;
  • 我们的访客端Demo里提供了一整套UI,您可以直接使用这套UI,当然我们更建议您用作参考,根据您的APP风格和实际业务场景,设计您自己的一套UI和业务使用流程,减少访客在使用您app过程中所产生的割裂感;
  • 在SDK集成过程中,针对您遇到的问题我们建议您先对比下Demo里的处理逻辑,帮助您快速解决您遇到的问题,如果Demo仍无法解答您心中的疑惑,请直接联系我们商务或技术支持,我们会全力为您提供所需要的帮助!

访客端Demo使用

当您在手机上安装完访客端demo应用后,首次使用需先经过简单的扫码配置,然后就可以开始发起正常对话了,详细说明如下:

访客端Demo与您自己APP的区别

访客端Demo与客户的APP以及SDK之间的关系说明如下:

代码下载

您可以通过以下两种方式获取到源代码:

欢迎大家提交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配置

环信UI库

环信UI库介绍主要分为两种 一种是基础会话聊天UI库 一种是音视频UI库:
* HelpDeskUI   ——  基础会话聊天UI库 
* HDCallUIKit —— 音视频UI库 (基于声网音视频服务,使用环信 IM 作为信令通道的开源音视频模块)

HelpDeskUI

目录介绍

集成

集成基础会话聊天UI库时只需要把demo中HelpDeskUI文件夹拖入到自己项目中

在pch文件或全局.h文件中添加如下代码

UI库使用了第三方库Masonry作用页面布局 如果工程中也用了Masonry请把我们的如下代码放到您工程引入的#import "Masonry.h"的上边防止跟您本身使用的库导致的冲突
 #ifdef __OBJC__
    #import <HelpDesk/HelpDesk.h>
   #import "HelpDeskUI.h"
   #endif 

音视频UI库

UI库说明

*音视频UI库主要分为两种 一种是融合视频(在线聊天中视频) 一种是独立视频(VEC视频) 都在HDCallUIKit下

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

详细代码请查看demo中HDCallUIKit文件下对应的源码