实时音视频
  • iOS
  • Android
  • macOS
  • Windows
  • HarmonyOS
  • Linux
  • Web
  • 小程序
  • Flutter
  • Electron
  • Unreal Engine
  • Unity3D
  • uni-app
  • React Native
  • Cocos Creator : TypeScript
  • 产品简介
  • 下载
  • 快速开始
    • 跑通示例源码
    • 集成 SDK
    • 实现视频通话
    • 场景化音视频配置
  • 通信能力
  • 音频能力
  • 视频能力
  • 客户端 API
  • 服务端 API
  • 常见问题
  • 文档中心
  • 实时音视频
  • 快速开始
  • 跑通示例源码
示例源码
本地下载

示例代码运行指引

准备环境

请确保开发环境满足以下要求:

  • 使用 Cocos Creator v3.6.0 或以上版本(建议通过 Cocos Dashboard 下载最新的版本)。

  • 根据需要运行的平台,确保对应的开发环境和设备。

    • Android:Android 5.0 或以上版本且支持音视频的 Android 设备或模拟器(推荐使用真机),如果为真机,请开启允许调试选项。
    • iOS:Xcode 14.0 或以上版本,iOS 11.0 或以上版本且支持音视频的 iOS 设备或模拟器(推荐使用真机)。
    • macOS:macOS 10.13 或以上版本且支持音视频的 macOS 设备。
    • Windows:Windows 7 或以上版本且支持音视频的 Windows 设备;并安装 Visual Studio 2019 或以上版本。
  • 确保运行设备已经连接到 Internet。

  • 当前版本 SDK 仅支持 Android / iOS / macOS / Windows 原生平台;暂不支持 Web(即不支持编辑器预览以及发布到 Web 平台、小游戏平台)。
  • 您可以从 Github 下载其他 Cocos Creator 编辑器版本的示例 Demo 源码。

前提条件

已在 ZEGO 控制台 创建项目,并申请有效的 AppID 和 AppSign,详情请参考 控制台 - 项目管理 中的“项目信息”。

SDK 同时也支持 Token 鉴权,若您需要升级鉴权方式,可参考 如何从 AppSign 鉴权升级为 Token 鉴权

示例源码目录结构

下列结构为工程目录的文件结构,下文所涉及的文件路径均为相对于此目录的路径。

cocos_creator
├── VERSION.txt
└── ZegoExpressExample
    ├── assets
    │   ├── HomeScene.scene # 主场景
    │   ├── HomeScene.ts # 主场景的脚本
    │   ├── KeyCenter.ts # 填写申请的 AppID 和 AppSign
    │   ├── resources # 资源文件
    │   ├── topics # 示例专题
    │   └── utils # 工具类
    ├── native
    │   └── engine # 原生工程配置
    ├── package.json
    .
    .

运行示例代码

  1. 解压已下载的示例 Demo 源码压缩包,并打开 “CocosDashboard”。
  2. 在 CocosDashboard 中,单击项目侧边栏,然后单击“Add”按钮,导入示例工程源码所在的 ZegoExpressExample 目录。
  3. 打开示例工程(建议使用示例工程指定的 Cocos Creator Editor 编辑器版本打开工程)。
  1. 加载示例工程后,控制台会报大量错误,原因是下载的示例源码中缺少 SDK,因此需要先 下载 SDK 包 (无需解压)。
  2. SDK 包下载完成后,在 Cocos Creator 菜单栏,选择“Extensions > Extensions Manager”。
  3. 单击“Project” 并单击 + 号,导入下载好的 SDK 压缩包即可。

导入完成后,若控制台仍然报大量错误,请重新启动 Cocos Creator。

  1. 示例源码中缺少 SDK 初始化所需的 AppID 和 AppSign,请使用 VS Code 打开示例源码工程,修改 assets/KeyCenter.ts 文件,请使用本文 前提条件 已获取的 AppID 和 AppSign 正确填写,否则示例源码无法正常运行。
  1. 返回 Cocos Creator 检查控制台是否仍然有错误,若有错误,则重新打开“扩展编辑器”找到 SDK 扩展,尝试先停用 SDK 扩展(单击“开关”按钮),并打开“文件资源管理器/访达”,再回到 Cocos Creator 让其刷新资源,再重新启用 SDK 扩展。然后再打开“文件资源管理器/访达”,再回到 Cocos Creator,直到控制台没有报错为止。若仍然报错,可能需要多次重新启动 Cocos Creator并重复上述步骤。

  2. 打开工程后,在左下角单击“Assets”,在 assets 目录下,双击 “HomeScene” 场景文件,可以看到示例源码主页的场景(主页为 2D 场景)。

  1. 在菜单栏选择“Project > Build”,先根据 Cocos Creator 安装配置原生开发环境 文档配置好开发环境,然后再根据 发布到原生平台 文档和实际情况,构建出原生平台工程。

    若构建失败,请打开构建日志文件查看错误信息并根据错误提示修正问题。若错误信息与 ZEGO SDK 有关并难以自行解决,请联系 ZEGO 技术支持。

  2. 开始运行。

    • 运行到 Android 设备:

      1. 在菜单栏选择“Project > Build”,新建构建任务,平台选择 “Android”,填写好各项信息后,单击 “Build”,最后单击 “Make” 开始编译(此步骤耗时较久)。

      2. 完成上述操作后,连接 Android 设备并单击 “Run”。或者使用 Android Studio 打开原生工程目录 “build/android/proj” 进行操作。

        若生成失败,请参考 集成 SDK 文档中的常见问题 1、2、3 进行操作。

    • 运行到 iOS 设备:

      1. 在菜单栏选择“Project > Build”,新建构建任务,平台选择 “iOS”,填写好各项信息后,单击 “Build”,最后单击 “Make” 开始编译(此步骤耗时较久)。

      2. 完成上述操作后,使用 Xcode 打开 “build/ios/proj/ZegoExpressExample.xcodeproj” 原生工程,然后连接 iOS 真机设备,选择 “ZegoExpressExample-mobile” 目标,并选择该真机设备,单击 “Run” 按钮运行。

      • 若要构建 iOS 模拟器架构,请参考 集成 SDK 文档 “2.2 导入 SDK” 中关于 iOS 工程的额外处理步骤。

      • 若生成失败,请参考 集成 SDK 文档中的常见问题 7 进行操作。

  • 运行到 macOS 设备:

    1. 在菜单栏选择“Project > Build”,新建构建任务,平台选择 “macOS”,填写好各项信息后,单击 “Build”,最后单击 “Make” 开始编译(此步骤会比较久)。

    2. 完成上述操作后,单击 “Run”,或者使用 Xcode 打开 “build/mac/proj/ZegoExpressExample.xcodeproj” 原生工程进行操作。

      若生成失败,请参考 集成 SDK 文档中的常见问题 7 进行操作。

  • 运行到 Windows 设备:

    1. 在菜单栏选择“Project > Build”,新建构建任务,平台选择 “Windows”,填写好各项信息后,单击 “Build”,最后单击 “Make” 开始编译(此步骤会比较久)。

    2. 完成上述操作后,单击 “Run”,或者使用 Visual Studio 打开 “build\windows\proj\ZegoExpressExample.sln” 原生工程进行操作。

  • 体验实时音视频功能

    在真机中运行项目,运行成功后,可以看到本端视频画面。

    为方便体验,ZEGO 提供了一个 Web 端调试示例 ,在该页面下,输入相同的 AppID、RoomID,输入不同的 UserID、以及对应的 Token,即可加入同一房间与真机设备互通。当成功开始音视频通话时,可以听到远端的音频,看到远端的视频画面。

    常见问题

    1. 打开示例工程时 CocosDashboard 报错 The editor version does not exist 如何处理?

    • 方式 1:本地尚未安装示例工程指定的 Cocos Creator 版本,请单击 CocosDashboard 侧边栏的 Editor 选项卡,并单击右下角的 Download 下载指定的 Cocos Creator 版本。
    • 方式 2:单击示例工程的 Editor Version 下拉框,修改示例工程所使用的编辑器版本,但这样可能会存在兼容性问题,需要自行解决。
    本篇目录