跳到主要内容

音视频直播 Demo

融云低延迟直播 Demo 演示了融云产品低延迟直播在 Web 端的功能，以便开发者体验产品，快速集成，实现单群聊、音视频通话、语音聊天室、娱乐直播、教学课堂、多人会议等场景需求。

  • QuickDemo（GitHub · Gitee），本文以运行 QuickDemo 为例。

如果想要直接体验产品效果，欢迎前往融云官网查看各场景的演示应用。

环境要求​

所有支持浏览器请参见 Web 兼容性。推荐使用 Google Chrome 最新版体验 Demo。

前置条件​

  • 创建融云开发者账号，获取 App Key。注册成功后，融云控制台会默认自动创建您的首个应用，默认生成在开发环境下的 App Key，使用国内数据中心。
  • 开通音视频通话服务，以及音视频直播服务。开发环境下可免费开通，每个应用均可享有 10000 分钟免费体验时长，免费体验时长用完即止。生产环境下需要先预存费用才可开通。服务开通后最长 30 分钟生效。详见开通音视频服务。

获取 Token​

应用客户端必须连接融云服务器才能使用融云即时通讯功能。连接时必须传入 Token 参数。Token 是与用户 ID 对应的身份验证令牌，是应用客户端用户在融云的唯一身份标识。

在实际业务运行过程中，应用客户端需要通过应用的服务端向融云服务端申请取得 Token，具体方法可参考 Server API 获取 Token。

在本教程中，为了快速体验和测试 SDK，我们从融云控制台获取两个用户 Token，用于后续体验。

  1. 访问控制台「北极星」开发者工具箱的 IM Server API 调试 页面。

  2. 在用户标签下，找到 用户服务 > 获取 Token 接口。

  3. 根据页面提示，填写 userId，并提交。

    在以下示例中，我们将获取到 userId 为 1 的用户的 Token。

    getToken

    提交后，可在左侧结果中取得 Token 字符串。记录下该 Token，用于体验时使用。

  4. 重复上一步，获取 userId 为 2 的用户的 Token。记录下该 Token，用于体验时使用。

运行 QuickDemo​

在运行 QuickDemo 前请确保已完成上述步骤。以下是检查清单：

  • 已注册融云开发者账户
  • 已准备好 App Key
  • 已开通音视频服务免费体验，且已等待 30 分钟
  • 已获取用于体验的两个 Token

以下我们使用已获取的两个 Token，分别模拟主播端和观众端的使用行为。

  1. 克隆下载示例代码。

    git clone https://github.com/rongcloud/web-quickdemo-rtc-living.git

    下载后可看到两个页面：anchor.html 为主播端页面，audience.html 为观众端页面。

  2. 使用浏览器直接打开主播端页面 anchor.html。运行成功后，请按照提示点击，并输入以下值：

    • App Key
    • 主播 Token：userId 为 1 的用户的 Token
    • 房间 ID：房间号长度不能超过 64，可包含 A-Z、a-z、0-9、+、=、-、_

  3. 主播端发布完资源后，页面将显示直播视频流地址（liveUrl）。

  4. 使用浏览器直接打开主播端页面 audience.html。运行成功后，请按照提示点击，并输入以下值：

    • App Key
    • 观众 Token：userId 为 2 的用户的 Token
    • 直播视频流地址：请从主播端的页面复制 liveUrl 地址，在观众端输入
最后于 更新