tencent cloud

文档反馈

最后更新时间:2024-12-04 17:11:08

    适用场景

    我们的主播开播观众观看功能主要依赖于我们视频直播的核心控件(LiveCoreView),该核心控件提供了 开播前画面预览、开启视频直播、关闭视频直播,直播间内和观众连线,跨房和其他主播连线等丰富的 API。
    当您通过 快速接入 接入视频直播 UIKit 后,如果 UI 风格和您的理想中 UI 风格有出入,您可以使用我们的核心控件半小时内快速搭建视频直播的主流程。然后在其之上添加您自己的业务 UI 视图。

    环境准备

    Xcode 15 及以上。
    iOS 13.0 及以上。
    CocoaPods 环境安装,点击查看
    如果您的接入和使用中遇到问题,请参见 常见问题

    步骤一:开通服务

    请参见 开通服务(TUILiveKit),领取体验版或者开通付费版。

    步骤二:导入 LiveStreamCore 组件

    使用 CocoaPods 导入组件,如果您遇到问题,请先参见 环境准备。导入组件具体骤如下:
    1. 请在您的 Podfile 文件中添加 pod 'LiveStreamCore' 依赖。
    Swift
    target 'xxxx' do
    ...
    ...
    pod 'LiveStreamCore'
    end
    如果您没有Podfile 文件,首先终端cdxxxx.xcodeproj目录,然后通过以下命令创建:
    pod init
    2. 在终端中,首先cdPodfile目录下,然后执行以下命令,安装组件。
    pod install
    如果无法安装 LiveCoreView 最新版本,可以先删除Podfile.lockPods。然后执行以下命令更新本地的 CocoaPods 仓库列表。
    pod repo update
    之后执行以下命令,更新组件库的 Pod 版本。
    pod update
    3. 可以先编译运行一下,如果遇到问题,请参见 常见问题。问题如果依然无法解决,可以先去跑一下我们的 Example工程。您在接入和使用过程中遇到的任何问题,欢迎给我们 反馈

    步骤三:登录

    在您的项目中添加如下代码,它的作用是通过调用 TUICore 中的相关接口完成 TUI 组件的登录。这一步骤至关重要,只有在成功登录之后,您才能正常使用 LiveCoreView 提供的各项功能。
    swift
    //
    // AppDelegate.swift
    //
    
    import TUICore
    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    TUILogin.login(1400000001, // 请替换为步骤一取到的 SDKAppID
    userID: "denny", // 请替换为您的 UserID
    userSig: "xxxxxxxxxxx") { // 您可以在控制台中计算一个 UserSig 并填在这个位置
    print("login success")
    } fail: { (code, message) in
    print("login failed, code: \\(code), error: \\(message ?? "nil")")
    }
    return true
    }
    参数说明
    这里详细介绍一下 login 函数中所需要用到的几个关键参数:
    参数
    类型
    说明
    SDKAppID
    int
    在步骤一中的最后一步中您已经获取到,这里不再赘述。
    UserID
    String
    当前用户的 ID,字符串类型,只允许包含英文字母(a-z 和 A-Z)、数字(0-9)、连词符和下划线。
    userSig
    String
    使用 步骤一 的第3步中获取的 SecretKey 对 SDKAppID、UserID 等信息进行加密,就可以得到 UserSig,它是一个鉴权用的票据,用于腾讯云识别当前用户是否能够使用 TRTC 的服务。您可以通过控制台中的 辅助工具 生成一个临时可用的 UserSig。更多信息请参见 如何计算及使用 UserSig
    说明:
    开发环境:如果您正在本地开发调试阶段,可以采用本地 GenerateTestUserSig.genTestSig函数生成 userSig。该方法中 SDKSecretKey 很容易被反编译逆向破解,一旦您的密钥泄露,攻击者就可以盗用您的腾讯云流量。
    生产环境:如果您的项目要发布上线,请采用 服务端生成 UserSig 的方式。

    步骤四:使用核心控件实现直播功能

    创建核心控件并开启预览

    创建核心控件
    swift
    import LiveStreamCore
    
    let livecoreView = LiveCoreView()
    开启直播预览:本地摄像头预览,并未真正开启直播间。
    swift
    livecoreView.startCamera(useFrontCamera: true{
    } onError: { code, message in
    }

    主播开启直播间和观众加入直播间

    主播开启直播间:开启一个直播间,并将本地摄像头采集的数据和麦克风采集的数据推流到直播间。
    swift
    let roomInfo = TUIRoomInfo()
    roomInfo.roomId = "123456"
    livecoreView.startLiveStream(roomInfo: roomInfo) { roomInfo in
    } onError: { code, message in
    }
    
    livecoreView.startMicrophone {
    } onError: { code, message in
    }
    观众加入直播间:观众进入直播间,并拉取直播间主播的视频流和音频流。
    swift
    livecoreView.joinLiveStream(roomId: "roomId_123456") { roomInfo in
    } onError: { code, message in
    }
    主播开启直播间开始直播
    观众加入直播间观看直播
    
    
    

    
    
    

    观众连麦

    您如果需要实现观众连麦功能,可参见 观众连麦 文档。

    主播连线

    您如果需要实现主播连线功能,可参见 主播连线 文档。

    设置连线布局

    您可以通过以下方式快速设置您与连线主播或您与连麦观众的布局。
    swift
    // 设置宫格布局
    livecoreView.setLayoutMode(layoutMode: .gridLayout)
    
    // 设置浮窗布局
    livecoreView.setLayoutMode(layoutMode: .floatLayout)
    
    // 设置自定义布局
    let layoutJson = ""
    livecoreView.setLayoutMode(layoutMode: .freeLayout, layoutJson: layoutJson)
    说明:
    自定义布局 layoutJson 是一个 json 格式的字符串,详细内容请查看 自定义布局 json
    主播连线中-九宫格布局
    主播连线中-浮窗布局
    主播连线中-自定义布局

    
    
    

    
    
    

    
    
    

    自定义布局 json

    {
    "1": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.0,
    "width": 1.0,
    "height": -1.0,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    },
    "2": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.384,
    "width": 0.5,
    "height": 0.89333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.5,
    "y": 0.384,
    "width": 0.5,
    "height": 0.89333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    },
    "3": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.384,
    "width": 0.666666666,
    "height": 0.666666666,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    },
    "4": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.384,
    "width": 0.5,
    "height": 0.5,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.5,
    "y": 0.384,
    "width": 0.5,
    "height": 0.5,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 0.8826,
    "width": 0.5,
    "height": 0.5,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.5,
    "y": 0.8826,
    "width": 0.5,
    "height": 0.5,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    },
    "5": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    },
    "6": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    },
    "7": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 1.050666666,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    },
    "8": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 1.050666666,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 1.050666666,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    },
    "9": {
    "backgroundColor": "#000000",
    "viewInfoList": [{
    "x": 0.0,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.384,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 0.717333333,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.0,
    "y": 1.050666666,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.333333333,
    "y": 1.050666666,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }, {
    "x": 0.666666666,
    "y": 1.050666666,
    "width": 0.333333333,
    "height": 0.333333333,
    "zOrder": 0,
    "backgroundColor": "#000000"
    }]
    }
    }
    
    联系我们

    联系我们,为您的业务提供专属服务。

    技术支持

    如果你想寻求进一步的帮助,通过工单与我们进行联络。我们提供7x24的工单服务。

    7x24 电话支持