简化 WebRTC 开发：使用 PaaS 构建视频通话应用程序

开发 WebRTC 应用程序是一个复杂的过程，需要掌握各类音视频知识和各种组件的集成。简化这项工作的一种方法是通过音视频提供商的平台即服务（PaaS），它提供了一套 SDK 和丰富且灵活的 API，可简化整体开发。

本文我们将探讨 PaaS 在 WebRTC 应用程序开发中的作用，如何选择合适的 PaaS 提供商。最后通过一个示例源码介绍如何快速跑通音视频通话功能。

PaaS 的作用

构建视频聊天 Web应用程序不同于一般的网络开发。除了通常的业务相关功能和其他功能要求（如用户管理、身份验证和最佳用户体验/用户界面）外，还有实时通信功能。

WebRTC 为浏览器带来了这些通信功能。它负责启用对媒体设备的访问，并建立连接以交换这些媒体。不过，为了支持这些功能，还需要创建一整套基础设施，其中包括：

• 信令服务器：允许参与者协商视频会话的细节。
• STUN/TURN 服务器：使节点间通信成为可能 。
• 媒体服务器：负责路由和处理媒体。

配置和维护这样的基础设施很容易成为一个独立的项目。您需要一支具备相应专业知识的专业团队。不过，PaaS 提供商会将这种复杂性抽象化，并提供易于使用的 SDK，您可以将其接入您的音视频通话应用程序，从而获得这些功能，而不必担心幕后发生的事情。

选择 PaaS 服务

使用 PaaS 构建视频通话应用的第一步是选择一个提供商，能提供您的应用所需的功能并与您的技术栈兼容。

选择 PaaS 提供商时，要问自己以下问题：

• 它支持哪些功能？这些是我的用例所需要的吗？
• 提供商是否提供任何类型的服务水平协议（SLA）？
• 支持的最大会话参与人数是多少？
• 提供商如何收费？
• 提供商的文档质量如何？
• 提供商是否符合各类监管要求？
• 是否有丰富的行业经验等等

这些问题的答案将帮助您确定哪家提供商最适合您的应用。您还可以考虑添加一个抽象层，使您的应用程序与 PaaS 无关，这样您就可以在将来更换不同的提供商，甚至采用不同的方法，而无需重写所有内容。

作为经验法则，您应始终选择一家提供广泛通信服务并拥有众多合作案例的提供商。比如 ZEGO即构科技就是很好的例子。

ZEGO 即构科技成立于 2015 年，是全球领先的实时互动云服务提供商。基于在 RTC 和 AI 领域多年的技术积累，即构科技提供实时音视频PaaS云服务和行业解决方案，已服务 4000 多个企业客户，包括 700 多所高等院校、200 多个金融及政府机构，以及 70% 国内互联网头部客户。

ZEGO Express Web SDK 使用了 WebRTC 技术实现实时音视频功能。下面介绍如何快速跑通一个示例源码，体验基础的音视频通话服务。

示例源码运行指引

在开始集成 ZEGO SDK 前，可以先了解一下浏览器兼容性和已知问题。

源码地址：https://github.com/zegoim/express-demo-web

前提条件

已在 ZEGO 控制台 创建项目，申请有效的 AppID，以及获取到接入服务器的 “Server 地址”，详情请参考 控制台 – 项目管理 中的“项目信息”。

示例源码目录结构

以下目录结构为 express-demo-web 子目录的文件结构，下文所涉及的文件路径均为相对于此目录的路径。

.
├── README.md
...
└── src  # 源码文件夹
    ├── Examples  # 示例代码
    │   ├── AdvancedAudioProcessing   # 音频进阶功能
    │   ├── AdvancedStreaming         # 推拉流进阶
    │   ├── AdvancedVideoProcessing   # 视频进阶功能
    │   ├── CommonFeatures            # 常用功能
    │   ├── DebugAndConfig            # 调试与配置
    │   ├── Framework                 # 最佳实践/框架相关
    │   ├── Others                    # 其他功能
    │   ├── QuickStart                # 快速开始
    │   └── Scenes                    # 最佳实践/场景相关
    ├── assets    # 资源文件夹，存放项目共用的资源文件，包括sdk、各类依赖库、翻译相关的配置文件等
    └── KeyCenter.js  # 配置相关文件，可以填写申请的appID、server地址等

运行示例源码

1. 在下载的示例源码中，使用支持的浏览器，打开 “./src/Examples/DebugAndConfig/InitSettings/index.html” 文件，输入前提条件中获取的 AppID 和 Server 地址后，单击“设置”。

2. 设置完成后，可以开始体验 Demo 功能，即可使用支持的浏览器，打开 “./src/Examples” 文件夹下各场景功能的 HTML 文件。例如打开 “QuickStart/CommonUsage” 文件夹下的 “index.html”。

注意：

• 如果页面存放的本地路径中带有中文字符，打开页面时，部分浏览器加载 CSS 等样式文件可能会失败，页面将显示异常。建议开发者将源码文件的路径名称全部设置为“英文字符”。
• 为方便开发者调试，ZEGO 控制台提供生成临时 Token 的功能，开发者可直接获取临时 Token 来使用，详情请参考 控制台 – 开发辅助。但是在开发者自己的线上环境中，一定要通过自己的服务端生成 Token。

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

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

最后，随着对 Web 应用程序中实时通信功能的需求不断激增，PaaS 成为寻求高效方式构建 WebRTC 应用程序的公司的重要解决方案。当然，上面一个简单的示例不能完全说明 ZEGO 在 RTC 方面的能力，ZEGO 提供的是整个RTC链路的能力以及生态能力。您可以在我们文档中心查看更多详细信息，或扫码联系我们👇