Skip to content

Latest commit

 

History

History
139 lines (95 loc) · 6.28 KB

README.cn.md

File metadata and controls

139 lines (95 loc) · 6.28 KB
Raw

Agora RTC Web SDK 4.x 示例项目

English | 简体中文

简介

此仓库包含基于 Agora RTC Web SDK 4.x 的示例项目。

如果你还不熟悉 Agora RTC Web SDK 4.x，建议你先通过我们提供的 社区版互动教程 快速理解 SDK 的功能并通过 CodePen 控件在浏览器中直接调用 SDK。

Web SDK 4.x 是基于 Web SDK 3.x 开发的全量重构版本，在继承了 Web SDK 3.x 功能的基础上，优化了 SDK 的内部架构，提高了 API 的易用性。

Web SDK 4.x 具有以下优势：

  • 面向开发者提供更先进的 API 架构和范式。
  • 所有异步场景的 API 使用 Promise 替代 Callback，提升集成代码的质量和健壮性。
  • 优化频道事件通知机制，统一频道内事件的命名和回调参数的格式，降低断线重连的处理难度。
  • 提供清晰和完善的错误码，方便错误排查。
  • 支持 TypeScript。

示例项目（使用 jQuery 和 Bootstrap）

功能 示例项目位置
调整视频参数 /Demo/adjustVideoProfile
混音与音效 /Demo/audioMixingAndAudioEffect
视频直播 /Demo/basicLive
启用/禁用音视频轨道 /Demo/basicMute
视频通话 /Demo/basicVideoCall
云代理 /Demo/cloudProxy
自定义视频源 /Demo/customVideoSource
显示呼叫状态 /Demo/displayCallStats
双流模式 /Demo/dualStream
地理区域限制 /Demo/geoFencing
加入多频道 /Demo/joinMultipleChannel
推流到 CDN /Demo/pushStreamToCDN
控制录制设备 /Demo/recordingDeviceControl
自定义音视频渲染 /Demo/selfRendering
自定义音视频采集 /Demo/selfCapturing
屏幕共享 /Demo/shareTheScreen
美颜 /Demo/videoBeautyEffect

如何运行示例项目

前提条件

  • 你必须使用 SDK 支持的浏览器运行示例项目。 关于支持的浏览器列表参考 产品概述。

运行步骤

  1. 使用 SDK 支持的浏览器打开 Demo/index.html 并选择一个示例项目。
  2. 在示例项目页面上，输入 App ID、Token 和频道名，然后加入频道。
    • 关于 App ID 和 Token 的获取方法参考 开始使用 Agora 平台。你可以获取一个临时 token，快速运行示例项目。
    • 生成 Token 使用的频道名必须和加入频道时使用的频道名一致。

示例项目（使用 React）

特性 示例项目位置
视频通话 /ReactDemo
OpenLive /OpenLive

如何运行示例项目

前提条件

  • 你必须使用 SDK 支持的浏览器运行示例项目。关于支持的浏览器列表参考 产品概述。
  • npm

ReactDemo 的运行步骤

  1. 导航至 ReactDemo 并运行下面的命令安装依赖项。

    npm install

  2. 运行下面的命令启动示例项目。

    npm run start

  3. 在示例项目页面上，输入 App ID、Token 和频道名，然后加入频道。

    • 关于 App ID 和 Token 的获取方法参考 开始使用 Agora 平台。你可以获取一个临时 token，快速运行示例项目。
    • 生成 Token 使用的频道名必须和加入频道时使用的频道名一致。

OpenLive 的运行步骤

  1. 导航至 /OpenLive。 将 .env.example 重命名为 .env。在 .env 文件中，使用 App ID 替换 <#YOUR APP ID#>，使用 token 替换 <#YOUR TOKEN#>.

    关于 App ID 和 Token 的获取方法参考 开始使用 Agora 平台。你可以获取一个临时 token，快速运行示例项目。

    REACT_APP_AGORA_APP_ID=<#YOUR APP ID#>
REACT_APP_AGORA_APP_TOKEN=<#YOUR TOKEN#>
REACT_APP_AGORA_LOG=true

  2. 运行下面的命令安装依赖项。

    npm install

  3. 运行下面的命令启动示例项目。

    生成 Token 使用的频道名必须和加入频道时使用的频道名一致。

    npm run dev

参考

反馈

如果你有任何问题或建议，可以通过 issue 的形式反馈。

相关资源

  • 你可以先参阅 常见问题
  • 如果你想了解更多官方示例，可以参考 官方 SDK 示例
  • 如果你想了解声网 SDK 在复杂场景下的应用，可以参考 官方场景案例
  • 如果你想了解声网的一些社区开发者维护的项目，可以查看 社区
  • 若遇到问题需要开发者帮助，你可以到 开发者社区 提问
  • 如果需要售后技术支持, 你可以在 Agora Dashboard 提交工单

许可证

示例项目遵守 MIT 许可证。详见 LICENSE 文件。