声网在 GitHub 上提供一个开源的小程序实时音视频示例项目 Agora-Miniapp-Tutorial。在搭建自己的小程序项目前,你可以下载体验或参考源代码。本文介绍如何配置环境并跑通该示例项目。
开始前,请确保你的开发环境满足如下条件:
在微信公众平台的小程序开发选项中,切换到接口设置页签,打开实时播放音视频流和实时录制音视频流的开关。
在小程序的开发设置里,将如下域名配到服务器域名里,其中 request 合法域名区域填入以 https 开头的域名;socket 合法域名区域点入以 wss 开头的域名。
如果你使用的 SDK 为 v2.5.3 或更高版本,你需要在 request 合法域名及 socket 合法域名中添加以下域名:
wss://miniapp.agoraio.cn
https://uap-ap-web-1.agora.io
https://uap-ap-web-2.agoraio.cn
https://uap-ap-web-3.agora.io
https://uap-ap-web-4.agoraio.cn
https://report-ad.agoralab.co
https://rest-argus-ad.agoralab.co
https://uni-webcollector.agora.io
参考以下步骤创建一个声网项目:
第一次使用微信小程序时,需要参考如下步骤开通服务:
登录声网控制台,点击左侧导航栏的用量图标 ,进入用量页面。
点击页面左上角聚合用量旁的箭头 ,在下拉框中选择需要开通小程序支持的项目名称。
开通成功后你就可以在用量页面看到小程序的使用情况。
声网会给每个项目自动分配一个 App ID 作为项目唯一标识。
在声网控制台的项目管理页面,找到你的项目,点击 App ID 右侧的 图标,即可获取项目的 App ID。
为提高项目的安全性,声网推荐使用 Token 对即将加入频道的用户进行鉴权。
为了方便测试,声网控制台提供生成 RTC 临时 Token 的功能。参考以下步骤获取 RTC 临时 Token:
testroom
,然后点击生成。后续调用 API 加入频道时,请确保填入的频道名与这里的频道名一致。参考如下步骤获取小程序示例项目,并将小程序 SDK 集成到示例项目中。
Agora-Miniapp-Tutorial-master/lib
路径下。Agora-Miniapp-Tutorial-master/utils/config.js
文件,然后在 const APPID
行后添加你获取到的声网项目 App ID。Agora-Miniapp-Tutorial-master/pages/meeting/meeting.js
文件,将 client.join
和 client.rejoin
方法中的 undefined
参数修改为你获取到的临时 Token,确保需要带 ""。参考如下步骤在微信开发者工具中运行小程序示例项目。
打开微信开发者工具,点击小程序界面的 +。
在弹出的界面中选择导入项目页签,然后在目录一栏中选中小程序示例项目在本地的存储路径,填入你微信小程序的 App ID,然后点击导入。
加载成功后,微信开发者工具上会出现小程序示例项目的界面。为保证体验效果,我们建议选择真机调试。点击右上角的真机调试,工具界面会出现一个真机调试的二维码。
使用移动端微信 App 扫描二维码,进入手机调试界面。填入房间名,然后点击加入房间。在弹出的对话框中点击确定,表示作为主播加入频道。稍等片刻,就可以在小程序的界面看到本地的视频画面。请确保此处填入的房间名,和生成临时 Token 时填入的频道名是一致的。
通常客户端初始化失败,会伴随错误码 901 或 903。我们建议你检查确认如下项:
config.js
文件中的 App ID,确认已在控制台开启了小程序服务。