Блог веб разработки

Блог веб-разработки статьи | видеообзоры | исходный код

Интерфейс MediaDevicesInfo в javascript

Всем привет! В сегодняшней статье я покажу вам как с помощью javascript получить информацию из браузера о подключенных устройствах ввода и вывода мультимедиа. Итак, поехали!

Для получения информации об устройствах нам необходимо просто воспользоваться методом enumerateDevices() объекта mediaDevices.

Но прежде всего необходимо проверить его поддержку в браузере.

if (!navigator.mediaDevices || !navigator.mediaDevices.enumerateDevices) {
  console.log("Ваш браузере не поддерживает mediaDevices и/или numerateDevices");
}else{
console.log("Все гуд")
}

Если у вас все гуд, идем дальше. В принципе данных интерфейс поддерживается во всех современных браузерах, кроме IE.

Получаем информацию об устройствах мультимедиа.

navigator.mediaDevices.enumerateDevices()
.then(function(devices) {
  devices.forEach(function(device) {
    console.log(device.kind + ": " + device.label +
                " id = " + device.deviceId);
  });
})

На выходе мы получаем объект promise который прогоняем циклом forEach(). В результате нам в консоль выводится:

device.kind - функция устройства(ввод или вывод информации)

device.label - краткое описание устройства(микрофон, вебкамера, динамики и т. д)

device.deviceId - идентификатор устройства

Также мы можем через свойство groupId просмотреть групповой идентификатор.

device.groupId - групповой идентификатор может быть общим у устройств принадлежащих одному физическому устройству. Например, вебкамера со встроенным микрофоном и динамиками.

Используя данные параметры я думаю в ближайшем будущем мы сможем через браузер работать с устройствами ввода и вывода. В принципе с некоторыми устройствами такими как микрофон и вебкамера можно уже работать через метод getUserMedia(). А пока по большей части интерфейс MediaDevicesInfo служит для справочной информации с помощью которой вы можете показать пользователю какие устройства ввода и вывода он может использовать в браузере.

На этом данная статья подошла к концу. Если у вапоявились вопросы, пишите их в комментариях или группе

ВК

На этом у меня все. Желаю вам успехов и удачи! Пока.

Оцените статью

Еще статьи

Javascript окна

Сanvas

Функции для исследования классов в PHP

Три полезных метода для работы с объектами в javaScript

JavaScript куки

Работа с ветками git

Javascript json методы

Fetch API в HTML5

Модуль requests в python3

Комментарии

Проверочный код

В данном разделе пока нет комментариев!

История

    ПОДПИСКА

    • Подпишись и получай информацию о выходе новых статей на почту! Просто введите свою почту, нажмите кнопку подписаться. На почту должно будет прийти сообщение с потверждением подписки. Если сообщение не пришло проверьте раздел спам или попробуйте другую почту. Также по всем техническим проблемам вы можете написать в поддержку

    НОВОСТИ

    • Всем привет! Запустил новый сервис для поиска и бесплатного скачивания, прослушивания аудиокниг. Здесь вы можете найти множество литературы и прослушать ее. Вскоре возобновлю написание статей.