#javascript #video-streaming #html5-video #getusermedia
#javascript #потоковое видео #html5-видео #getusermedia
Вопрос:
Я пытался разработать приложение для видеоконференцсвязи, и в качестве первого шага я попытался заставить видео, вводимое пользователем, работать локально. просто используя простой HTML-тег и javascript getUserMedia() API.
Видео с веб-камеры работает отлично, но когда я пытаюсь получить аудиопоток, он начинается с визгливого звука, а затем продолжает иметь эхо и шум.
Я перепробовал много способов, может кто-нибудь, пожалуйста, предложить решение с помощью кода. и, если возможно, объясните, почему возникает эта проблема. Спасибо.
Это HTML-код.
<html>
<head>
<title>Hi - Here</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="container">
<div>
<video autoplay="true" id="videoElement" ></video>
</div>
</div>
</body>
<script src="webcam.js"></script>
</html>
Это javascript.
var videoConstrains = {
audio: true ,
video:
{
width: {min: 650 , ideal: 1280 , max: 1920},
height: {min: 480 , ideal: 720 , max: 1080},
}
};
let video = document.getElementById('videoElement')
if(navigator.mediaDevices amp;amp; navigator.mediaDevices.getUserMedia){
navigator.mediaDevices.getUserMedia(videoConstrains)
.then((stream)=>{
video.srcObject = stream
})
}
Ответ №1:
закройте цикл воспроизведения звука: отключите микрофон или используйте гарнитуру, это проблема не с GUM, а с вашей настройкой.
Ваш микрофон может слышать ваши динамики. Это то же самое, что иногда происходит в аудиториях. Микрофон улавливает динамики, и динамики издают громкий неприятный вой. Это аналоговая проблема.
Приглушите микрофон. Или когда вы «заставляете видео, вводимое пользователем, работать локально», используйте гарнитуру, а не динамики и микрофон вашего ноутбука.
Комментарии:
1. не могли бы вы более подробно рассказать о решении? это действительно помогло бы мне.
Ответ №2:
Извлеките поток видеодорожки, игнорируя поток аудиодорожки.
const videoTracks = stream?.getVideoTracks() || [];
const selectedVideoTrack = videoTracks[0];
const newStream = new MediaStream();
newStream.addTrack(selectedVideoTrack);
video.srcObject = newStream
Другой способ:
В приведенном выше коде вы можете игнорировать создание нового медиапотока, но тогда вам нужно удалить звуковую дорожку из существующего потока или создать поток без {audio: true} .