检测麦克风

第一步：使用 AgoraRTC.createStream创建音频流

第二步：使用stream.getAudioLevel来检测当前的音量

/** create an audio stream and try to init/play it /
AgoraRTC.createStream(): stream
/*

accumulate audio level to check
if it is in an ideal range
*/
stream.getAudioLevel(): number

检测扬声器

在这里，我们直接使用了 HTML5 的音频组件，让用户来确认是否听到了正在播放的音频。

测分辨率

第一步：使用AgoraRTC.createStream基于不同的参数创建视频流

第二步：使用HTMLVideoElement来获取视频的分辨率

/** Create stream with different video profiles */
AgoraRTC.createStream(): stream
/** Get actual resolution from html element */
HTMLVideoElement.videoHeight
HTMLVideoElement.videoWidth

检测网络连接

第一步：使用AgoraRTC.createClient来创建一个发送客户端和一个接收客户端
第二步：使用AgoraRTC.createStream创建流
第三步：使用client.publish从发送客户端发布流
第四步：使用client.subscribe将发送的流订阅至接收客户端
第五步：使用stream.getStats获取网络连接状态数据

/**
 * Create two clients: a sender which will publish
 * a regular stream, and a receiver which will subscribe the
 * stream published by the sender.
 */
AgoraRTC.createStream(): stream
/** Get stream tranfer info by using getStats */
stream.getStats(callback: (stats:any) => void): void

检测摄像头

向用户询问是否开启摄像头，如果确认开启，则在画面中显示用户摄像头采集到的图像。

测试工具的修改
如果你是 Agora 开发者，想要修改出一个适用于自己应用的测试工具，可以按照以下步骤操作：

1.将你的 App ID 填写到 ./src/utils 目录下的 settings.js 文件中。

2.安装 dependencies

npm install

3.在本地运行应用

npm run dev

在浏览器访问 localhost:8080

4.Build 应用

npm run build

创建文件需要 HTTP 服务器。

完成以上步骤后，你也可以将它集成到自己的应用中，并根据需要，修改 UI。在用户使用产品之前，可以进行运行环境的检测，帮你提前排雷，提高用户体验。

本文转载自公众号声网Agora（ID：shengwang-agora）。

原文链接：

https://mp.weixin.qq.com/s/BPaj4p1auMb_1JyazhpElQ

创作场景

用这个开源工具，提前为你的 WebRTC 应用排个雷（二）