Я подготовил приложение для потоковой передачи веб-камеры и поэтому предварительно просмотрел веб-камеру пользователя в видеотеге с помощью navigator.mediaDevices.getUserMedia.
После того, как пользователь нажимает кнопку и "RTCmulticonnection" открывает комнату, я хочу добавить предварительную веб-камеру / видео для использования в качестве потока веб-камеры.
У меня просто не получается.
Часть, которую я собираюсь показать вам, начинается после того, как соединение socket.io установлено - метод connection.open также возвращает, что комната была создана и соединение установлено. Итак, сигнализация работает - я просто не знаю, как просто прикрепить свое видео к объекту подключения (RTCmulsiconnection).
Я пытался использовать метод "attachStreams", но безуспешно.
//Get Users Webcam
navigator.mediaDevices.getUserMedia({
audio: true,
video: true
}).then(function(stream) {
$("#mediaPreview").show();
let preview = document.getElementById('mediaPreviewVideo');
preview.srcObject = stream;
preview.volume = 0;
preview.play();
});
//Start stream
$("#btnMediaStreamStart").on('click', function(e) {
//Prevent Default & Hide
e.preventDefault();
//Add Classes
$("#mediaPreviewVideo").addClass('webcam-online');
$("#mediaStreamStatus").show().addClass('bg-success').html('<small><strong>Live</strong></small>');
connection.socketURL = 'localhost:9001/';
let connectionRoom = '123';
connection.open(connectionRoom, function(e) {
if (e === true) {
connection.attachStreams.forEach(function(localStream) {
//How to attach the cam stream? Is my previously created video even part of the "streams"?
});
connection.mediaConstraints = {
audio: {
deviceId: selectAudio
},
video: {
deviceId: selectVideo
}
};
}
});