关于前端:保姆级教程集成声网-SDK-实现-iOS-平台音视频通话和虚拟背景功能

6次阅读

共计 5237 个字符，预计需要花费 14 分钟才能阅读完成。

大家好，我是声网 RTE 开发者社区作者 @小曾同学。

如果你想实现 iOS 平台的音视频通话，想在音视频通话中增加虚构背景，那这篇文章齐全能够借鉴。应用 swift 语言，集成声网 SDK 实现音视频通话，并调用 enableVirtualBackground 接口增加虚构背景，小伙伴们赶快跟着小曾实际起来吧。

本篇文章次要是集成声网 iOS 端 SDK，实现繁难音视频 Demo，并在 Demo 中实现虚构背景性能。其中也会蕴含导入虚构背景图片时遇到的一些问题，以及相干 API 的调用姿态。跟着一步一步做，你肯定能够实现本人的音视频 Demo，如果有任何问题，也可评论或者私信留言。

在实现 iOS 平台音视频 Demo 之前，你须要有以下筹备：

• Xcode
• 注册声网账号，申请声网 APPID、长期 Token，详见开始应用声网平台

如果你还没有声网账号，能够通过文末的链接收费注册，每个账户每月都有 10000 分钟收费额度。 如果是集体学习 / 调试，时长齐全够用。

留神长期 Token，主要用途是在客户端退出频道时对用户鉴权，有效期为 24 小时。

小曾集体开发及测试环境如下：

• MacBook Pro
• Xcode：v 14.2
• 声网 SDK：4.1.1，SDK 的下载可查看文末参考资料
• Apple 开发者账号

本次实际，将一步步率领大家实现音视频通话并调用 enableVirtualBackground 接口增加虚构背景性能。

2.1 创立我的项目

(1）创立 iOS 我的项目

关上 Xcode——Create a new Xcode project——抉择 iOS 模块下的 APP，之后便会呈现如下界面，输出相干内容，须要留神的是，Team 是开发者账号，如果没有能够去 Apple 开发者官网注册一个收费的。

(2）点击 Next 之后，会呈现如下界面，抉择 Minimum Deployments 为 13.0，示意 demo 反对 iOS 13.0 及以上版本，须要留神，虚构背景性能只反对 iOS 13 及以上版本的零碎。

(3）增加媒体设施权限

点击 Info 栏目，增加摄像头和麦克风权限，点击“+”号抉择别离抉择Privacy – Camera Usage Description、Privacy – Microphone Usage Description。如果没有增加权限的话，当你点击 demo 时，会呈现解体问题。

(4）关上终端，进入根目录 VideoCall_ios，输出并运行命令 pod init，此时目录中会生成 Podfile 文件，编辑 Podfile 文件，输出 pod 'AgoraRtcEngine_iOS','4.1.1’，示意集成声网 sdk。

pod init
open -e Podfile

(5）装置 SDK

在终端进入根目录，输出命令 pod install 并运行，通过 cocoapods 主动下载声网 SDK，当看到 Pod installation complete! 示意装置胜利，此时会发现根目录下多了一个{project}.xcworkspace 的文件，在该文件里，会同时加载我的项目文件及方才装置好的 Pod 依赖库，并使两者建设好关联。通过 Xcode 关上该文件进行后续操作。

2.2 实现音视频通话

本节次要介绍如何应用 Agora 视频 SDK 实现 iOS 平台音视频通话。以下代码实现均在 ViewController.swift 文件中输出。

(1）导入声网 kit

import AgoraRtcKit
// 自 3.0.0 版本起，AgoraRtcEngineKit 类名更换为 AgoraRtcKit

(2）创立根底用户界面，并初始化界面

在 ViewController 类中创立用户界面，并初始化

class ViewController: UIViewController{ 
    // 定义本地视图变量
    var localView: UIView!
    // 定义远端视频变量
    var remoteView: UIView!
    // 定义 agoraKit
    var agoraKit: AgoraRtcEngineKit!

  // 设置视频窗口布局
    override func viewDidLayoutSubviews(){super.viewDidLayoutSubviews()
        remoteView.frame = self.view.bounds
        localView.frame = CGRect(x: self.view.bounds.width - 180, y:0, width: 180, height: 230)  
    }

    func initView(){
        // 初始化远端视频窗口。remoteView = UIView()
        self.view.addSubview(remoteView)
        // 初始化本地视频窗口。localView = UIView()
        self.view.addSubview(localView)
    }

（3）初始化 AgoraRtcEngineKit

在 ViewController 类中，实例化 AgoraRtcEngineKit 对象。

// 初始化引擎
func initializeAgoraEngine(){let config = AgoraRtcEngineConfig()
     // 在这里输出你的 App ID.
     config.appId = "24bbaca4116c4b11b81cdf4cffdf41"
     // 调用 AgoraRtcEngineDelegate
     agoraKit = AgoraRtcEngineKit.sharedEngine(with: config, delegate: self)
    
 }

（4）退出频道

退出频道是实现音视频通话的必要步骤，须要调用 agoraKit.joinChannel(byToken:channelId:info:uid:joinSuccess:) 办法.

留神：YOUR_TOKEN是您在声网官网生成的 Token，YOUR_CHANNEL_ID是您本人定义的频道 ID, 频道可了解为专用于传输实时音视频数据的通道。uid是您在频道中的用户 ID，0 示意应用主动生成的用户 ID。

func joinChannel(){let option = AgoraRtcChannelMediaOptions()
    // 在视频通话场景下，将频道场景设置为 liveBroadcasting
    option.channelProfile = .liveBroadcasting 
    // 设置用户角色为主播
    option.clientRoleType = .broadcaster 
    // 应用长期 token 退出频道，在这里传入你的我的项目的 token 和频道名。agoraKit?.joinChannel(byToken: "007eJxTYezdV5FYj92Eh4WVzc+Yfl9sd4XNOyPb1it1+3nGPwt4rMBiZJCUlJieaGBqaJZskGRomWRgmp6SZJKelAUlDI/PFnAIpDYGMDDtmv2BkZIBAEJ+FoSo1L52BAQBbtCAO", channelId: "zeng", uid: 0, mediaOptions: option)
}

（5）启用本地视频采集和预览

调用 agoraKit.enableVideo() 开启视频采集性能，调用 agoraKit.enableAudio() 开启音频采集性能，调用 agoraKit.startPreview() 开始本地预览。

func setupLocalVideo(){
    // 启用视频模块
    agoraKit?.enableVideo()
    agoraKit?.enableAudio()
    // 开始本地预览
    agoraKit?.startPreview()
    let videoCanvas = AgoraRtcVideoCanvas()
    videoCanvas.uid = 0
    videoCanvas.renderMode = .hidden
    videoCanvas.view = localView
    // 设置本地视图
    agoraKit?.setupLocalVideo(videoCanvas)
    }

（6）来到频道

func leaveChannel() {
    // Step 1, release local AgoraRtcVideoCanvas instance
    agoraKit.setupLocalVideo(nil)
    // Step 2, leave channel and end group chat
    agoraKit.leaveChannel(nil)
    AgoraRtcEngineKit.destroy()}

(7) 设置远端用户视频

应用 extension 关键字实现类的扩大。

extension ViewController: AgoraRtcEngineDelegate{
    // 监听 didJoinedOfUid 回调
        // 远端主播退出频道时，会触发该回调
    func rtcEngine(_ engine: AgoraRtcEngineKit, didJoinedOfUid uid: UInt, elapsed: Int){let videoCanvas = AgoraRtcVideoCanvas()
        videoCanvas.uid = uid
        // 渲染模式 采纳 hidden
        videoCanvas.renderMode = .hidden
        videoCanvas.view = remoteView
        // 设置远端视图
        agoraKit?.setupRemoteVideo(videoCanvas)
   }
}

（8）加载视图，渲染画面

在 ViewController 类中实现viewDidLoad 函数

override func viewDidLoad() {super.viewDidLoad()
        // 当加载视图后，你能够进行其余其余设置。// 初始化视频窗口函数
        initView()
        // 当调用声网 API 时，以下函数会被调用
        initializeAgoraEngine()
        setupLocalVideo()
        joinChannel()}

（9）运行 demo

点击运行按钮，抉择适合的测试机，运行 demo，我应用的是真机 iPhone13 进行调试。

当启动 demo 时，须要先信赖 APP，在设置——通用——VPN 与设施治理——信赖 APP 即可。

2.3 实现虚构背景性能

声网视频 SDK 提供了 enableVirtualBackground 接口，虚构背景性能反对你应用自定义的背景图代替本地用户原来的背景图或者将背景虚化解决。胜利开启虚构背景性能后，频道内所有用户都能看到自定义的背景。

须要留神的是，在 enableVideo 或 startPreview 之后调用 enableVirtualBackground 办法。而且这个办法依赖于虚构背景动静库 AgoraVideoSegmentationExtension.xcframework，如果删除该动静库会导致无奈失常开启该性能。可在 Pods 目录下查看动静库。

在 enableVirtualBackground 办法中须要传入三个参数

enable：示意是否开启虚构背景，值为 true 或者 false

backData：示意自定义的背景图

segData：示意背景图像的解决属性

具体实现如下：

（1）上传背景图片

右击我的项目——Add Files to“VideoCall_ios”——抉择一张图片增加至我的项目中，留神，自定义背景图反对 PNG 和 JPG 格局。

增加完图片之后，右击图片——show File Inspector——在界面右侧，更改图片 Type 为 Data。如果抉择默认值的话，则自定义背景不会失效。

（2）逻辑代码实现

在 setupLocalVideo 函数，agoraKit?.startPreview() 办法之后，增加虚构背景，其中应用Bundle.main.path() 办法来关上文本文件。

let source = AgoraVirtualBackgroundSource()
source.backgroundSourceType = .img
source.source = Bundle.main.path(forResource: "test", ofType: "png")
agoraKit.enableVirtualBackground(true, backData: source, segData: nil)

其中，agoraKit.enableVirtualBackground() 存在返回值，0 示意调用胜利，当小于 0 时，示意调用失败。具体返回值信息可查看 enableVirtualBackground。

（3）Demo 展现

运行 demo 后，视频背景曾经换成了咱们自定义图片

本篇文章次要分享应用 Swift 语言，集成声网 SDK 实现音视频通话，并调用 enableVirtualBackground 接口增加虚构背景。从我的项目搭建到接口调用以及 Demo 运行，均已具体解说，并对其遇到的问题，也做了具体阐明。如果有不懂的中央可参考声网官网 疾速开始。（注：本文 Demo 源码已搁置集体 github）

参考资料

• 注册声网账号
• SDK 下载
• 声网官网 - 疾速开始

正文完