Is it possible to read the hardware information (at least the name) of the (in-build) microphone while a user is recording an audio file on my website?

Is that possible with JavaScript or is there another way to solve this problem? I searched the web but could only find scripts for recording with JavaScript.

Is it possible to read the hardware information (at least the name) of the (in-build) microphone while a user is recording an audio file on my website?

Is that possible with JavaScript or is there another way to solve this problem? I searched the web but could only find scripts for recording with JavaScript.

• javascript
• web
• microphone

2 Answers 2

Newer version: Available in Firefox, MS Edge, and Chrome 45 with experimental flag.

Using the standard navigator.mediaDevices.enumerateDevices(), you can get a list of available sources. Each source has a kind property, as well as a label.

var stream;
navigator.mediaDevices.getUserMedia({ audio:true })
.then(s => (stream = s), e => console.log(e.message))
.then(() => navigator.mediaDevices.enumerateDevices())
.then(devices => {
  stream && stream.stop();
  console.log(devices.length + " devices.");
  devices.forEach(d => console.log(d.kind + ": " + d.label));
})
.catch(e => console.log(e));

var console = { log: msg => div.innerHTML += msg + "<br>" };

<div id="div"></div>

Documentation & Related

• navigator.mediaDevices on MDN - https://developer.mozilla/en-US/docs/Web/API/MediaDevices
• The "Media Capture and Streams" specification - http://w3c.github.io/mediacapture-main/getusermedia.html#mediadevices
• Demo of selecting input source by Sam Dutton - https://webrtc.github.io/samples/src/content/devices/input-output/

The last demo works in regular Chrome thanks to the adapter.js polyfill.

Outdated API

This answer uses an API that is non-standard, with limited browser support. It works in current Chrome as of writing, but will not be adopted in future versions of other browsers, and may be going away in Chrome. For a solution with more widespread support, see: https://stackoverflow./a/31758598/610573

Using MediaStreamTrack.getSources(), you can get a list of available sources. Each source has a kind property, as well as a label.

MediaStreamTrack.getSources(function(sourceInfos) {
    for (var i = 0; i != sourceInfos.length; ++i) {
        var thisSource = sourceInfos[i];
        console.log('stream type: '+thisSource.kind+', label: '+thisSource.label); 
        // example: stream type: audio, label: internal microphone
    }
});

Documentation & Related

• MediaStreamTrack on MDN - https://developer.mozilla/en-US/docs/Web/API/MediaStreamTrack
• "Capturing Audio & Video in HTML5" on HTML5Rocks. - http://www.html5rocks./en/tutorials/getusermedia/intro/
• Demo of selecting input source by Sam Dutton - https://simpl.info/getusermedia/sources/