快速开始 Demo 是 RTC 提供的基本音视频通话功能的开源示例工程文件。获取该工程文件后，你可以快速构建应用，体验 RTC 的通话效果；也能通过阅读代码，了解基本音视频通话的最佳实践。

• 操作系统为图形界面

• 终端

• 安装 Web SDK 支持的浏览器，推荐使用 Chrome 最新版本

Web 端快速开始工程文件包含了基于原生 JS 和 React 框架的两个示例工程。目录结构如下：

├─ Web
│  │─ ReactDemo                 // 基于 React 的快速开始 Demo
│  │  ├─ public                 // 图片等静态资源
│  │  ├─ src                    // 进房、通信等基础模块
│  │  ├─ README.md              // 跑通快速开始指南
│  │─ BasicDemo                 // 基于原生 JS 的快速开始 Demo
│  │  ├─ assets                 // 图片等静态资源
│  │  ├─ js                    // 进房、通信等基础模块
│  │  ├─ lib                    // vrtc sdk
│  │  ├─ README.md              // 跑通快速开始指南

参考 RTC 接入指南获取 AppId 和临时 Token。
申请临时 Token 后，你应记录下申请时使用的房间 ID、用户 ID 和对应生成的临时 Token，以供后续配置环境和加入房间时使用。

临时 Token 仅用于测试或跑通 Demo，你可以通过阅读密钥说明了解更多 Token 相关信息。

1. 全局安装 Node.js 和 npm。

2. 使用 npm 全局安装 yarn ：npm install -g yarn。

3. 下载快速开始 Demo 工程文件并解压到本地。

4. 进入你希望体验的 Demo 文件目录，找到配置文件并填写配置，包括上一步骤中获取到的 AppId 和 Token。

   • BasicDemo：./BasicDemo/js/common.js
   • ReactDemo：./ReactDemo/src/config.ts

   修改以下配置：

   • appId：填写你的 AppID
   • roomId：填写申请 Token 时填写的房间 ID
   • token：填写用户 ID 和对应 Token，多对token值之间使用西文逗号隔开

const config = {
  appId: 'YourAppId',
  roomId: 'YourRoomId',
  token: {
    'YourUserId1': 'YourToken1', // "test_user1": "test_tokenxxxxxxxxx"
    'YourUserId2': 'YourToken2',
  }
};

1. 打开终端。

2. 进入 BasicDemo 或 ReactDemo 工程文件根目录。

3. 运行 yarn 编译 Demo。

4. 运行 yarn start 启动 Demo，启动后会自动跳转到浏览器，登录页面如下：