ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
[TOC] ## enumerateDevices 基本格式: ``` var ePromise = navigator.mediaDevices.enumerateDevices(); ``` ## MediaDevicesInfo | 属性 | 说明 | | --- | --- | | deviceID | 设备ID | | label | 设备的名字 | | kind | 设备的种类 | | groupID | 两个设备groupID相同,说明是同一个物理设备 | ## JavaScript中的Promise Promise -> 肯定执行 handle(resolve, reject) ``` then: on_resolve catch: on_reject ``` ## 代码示例 client.js ``` 'use strict' var audioSource = document.querySelector('select#audioSource') var audioOutput = document.querySelector('select#audioOutput') var videoSource = document.querySelector('select#videoSource') if (!navigator.mediaDevices || !navigator.mediaDevices.enumerateDevices()){ console.log('emdiaDevices is not supported!'); }else { //navigator.mediaDevices.getUserMedia({audio: true, video: true}).then(r => handleError); navigator.mediaDevices.enumerateDevices() .then(gotDevices) .catch(handleError) } function gotDevices(deviceInfos) { deviceInfos.forEach(function (deviceInfo) { console.log(deviceInfo.kind + ": label = " + deviceInfo.label + ": id = " + deviceInfo.deviceId + ": groupId = " + deviceInfo.groupId); var option = document.createElement('option'); option.text = deviceInfo.label; option.value = deviceInfo.deviceId; if (deviceInfo.kind === 'audioinput') { audioSource.appendChild(option) }else if (deviceInfo.kind === 'audiooutput') { audioOutput.appendChild(option) }else if (deviceInfo.kind === 'videoinput') { videoSource.appendChild(option) } }); } function handleError(err) { console.log(err.name + ": " + err.message) } ``` client.html ``` <html> <head> <title> WebRtc get audio and video devices</title> </head> <body> <div> <label> audio input device:</label> <select id="audioSource"></select> </div> <div> <label> audio output device:</label> <select id="audioOutput"></select> </div> <div> <label> video input device:</label> <select id="videoSource"></select> </div> <script src="js/client.js"></script> </body> </html> ```