voxeet / dolby.io가 여러 회의를 생성

Aug 17 2020

dolby.io를 사용 하고 있습니다

지금까지 회의 참가, 회의 나가기, 비디오 시작 및 중지, 녹화 시작 및 중지, 화면 공유 시작 및 중지를 구현했습니다. 내가 직면 한 문제는 여러 회의에 관한 것입니다. 고유 한 회의 ID로 여러 회의를 구현하여 관련 회의에 지정된 모든 사용자가 자신의 회의에 참가할 수 있도록하고 싶습니다. 공식 문서에서 어떤 아이디어도 얻지 못했습니다.

여기 내 코드입니다

const initUI = () => {
  const nameMessage = document.getElementById('name-message');
  const joinButton = document.getElementById('join-btn');
  const conferenceAliasInput = document.getElementById('alias-input');
  const leaveButton = document.getElementById('leave-btn');
  const startVideoBtn = document.getElementById('start-video-btn');
  const stopVideoBtn = document.getElementById('stop-video-btn');
  const startScreenShareBtn = document.getElementById('start-screenshare-btn');
  const stopScreenShareBtn = document.getElementById('stop-screenshare-btn');
  const startRecordingBtn = document.getElementById('start-recording-btn');
  const stopRecordingBtn = document.getElementById('stop-recording-btn');
  //const mute_unmute = document.getElementById('mute');
  //oxeetSDK.conference.mute(VoxeetSDK.session.participant, VoxeetSDK.session.participant.isMuted);
  //let isMuted = VoxeetSDK.conference.toggleMute(VoxeetSDK.session.participant);
  nameMessage.innerHTML = `${randomName}`; joinButton.disabled = false; joinButton.onclick = () => { let conferenceAlias = conferenceAliasInput.value; /* 1. Create a conference room with an alias 2. Join the conference with its id */ VoxeetSDK.conference.create({ alias: conferenceAlias }) .then((conference) => VoxeetSDK.conference.join(conference, {})) .then(() => { joinButton.disabled = true; leaveButton.disabled = false; startVideoBtn.disabled = false; startScreenShareBtn.disabled = false; startRecordingBtn.disabled = false; }) .catch((e) => console.log('Something wrong happened : ' + e)) }; leaveButton.onclick = () => { VoxeetSDK.conference.leave() .then(() => { joinButton.disabled = false; leaveButton.disabled = true; startScreenShareBtn.disabled = true; stopScreenShareBtn.disabled = true; }) .catch((err) => { console.log(err); }); }; startVideoBtn.onclick = () => { VoxeetSDK.conference.startVideo(VoxeetSDK.session.participant) .then(() => { startVideoBtn.disabled = true; stopVideoBtn.disabled = false; }); }; stopVideoBtn.onclick = () => { VoxeetSDK.conference.stopVideo(VoxeetSDK.session.participant) .then(() => { stopVideoBtn.disabled = true; startVideoBtn.disabled = false; }); }; startScreenShareBtn.onclick = () => { VoxeetSDK.conference.startScreenShare() .then(() => { startScreenShareBtn.disabled = true; stopScreenShareBtn.disabled = false; }) .catch((e) => console.log(e)) }; stopScreenShareBtn.onclick = () => { VoxeetSDK.conference.stopScreenShare() .then(() => { startScreenShareBtn.disabled = false; stopScreenShareBtn.disabled = true; }) .catch((e) => console.log(e)) }; startRecordingBtn.onclick = () => { let recordStatus = document.getElementById('record-status'); VoxeetSDK.recording.start() .then(() => { recordStatus.innerText = 'Recording...'; startRecordingBtn.disabled = true; stopRecordingBtn.disabled = false; }) .catch((err) => { console.log(err); }) }; stopRecordingBtn.onclick = () => { let recordStatus = document.getElementById('record-status'); VoxeetSDK.recording.stop() .then(() => { recordStatus.innerText = ''; startRecordingBtn.disabled = false; stopRecordingBtn.disabled = true; }) .catch((err) => { console.log(err); }) }; }; const addVideoNode = (participant, stream) => { const videoContainer = document.getElementById('video-container'); let videoNode = document.getElementById('video-' + participant.id); if(!videoNode) { videoNode = document.createElement('video'); videoNode.setAttribute('id', 'video-' + participant.id); videoNode.setAttribute('controls', true); //VoxeetSDK.conference.mute(VoxeetSDK.session.participant, VoxeetSDK.session.participant.isMuted); //let isMuted = VoxeetSDK.conference.toggleMute(VoxeetSDK.session.participant); //console.log(isMuted); //videoNode.setAttribute('height', 240); //videoNode.setAttribute('width', 720); videoContainer.appendChild(videoNode); videoNode.autoplay = 'autoplay'; videoNode.muted = true; } navigator.attachMediaStream(videoNode, stream); }; const removeVideoNode = (participant) => { let videoNode = document.getElementById('video-' + participant.id); if (videoNode) { videoNode.parentNode.removeChild(videoNode); } }; const addParticipantNode = (participant) => { //const members_count++; const participantsList = document.getElementById('participants-list'); // if the participant is the current session user, don't add himself to the list if (participant.id === VoxeetSDK.session.participant.id) return; // let participantNode = document.createElement('li'); // participantNode.setAttribute('id', 'participant-' + participant.id); // participantNode.innerText = `${participant.info.name}`;
  //alert(VoxeetSDK.session.participant);

  //document.getElementById('members_count').innerText=participant.id;
  let participantNode = document.createElement('div');
  participantNode.setAttribute('class', 'tabcnt-item');
  participantNode.setAttribute('id', 'participant-' + participant.id);

  //document.getElementById('members_count').innerText = document.getElementById('members_count').innerText + 1;
  //document.getElementById('members_count').innerText = members_count;

  participantNode.innerText = `${participant.info.name}`; const send_html = "<div class='tabcnt-item'><div class='row align-items-center'><div class='col-md-8'><div class='media'><img src='images/pp.png' alt=''><div class='media-body'><h3>'"+`${participant.info.name}`+"'</h3><p>[email protected]</p></div></div></div><div class='col-md-4'><ul><li><a href='#'><i class='fas fa-video'></i></a></li><li><a href='#'><i class='fas fa-microphone'></i></a></li></ul></div></div></div>";
  
  participantNode.innerHTML = send_html;

  participantsList.appendChild(participantNode);
  document.getElementById('members_count').innerText= $('.tab-cnt').length; }; const removeParticipantNode = (participant) => { let participantNode = document.getElementById('participant-' + participant.id); if (participantNode) { participantNode.parentNode.removeChild(participantNode); document.getElementById('members_count').innerText= $('.tab-cnt').length;
  }
};

const addScreenShareNode = (stream) => {
  const screenShareContainer = document.getElementById('screenshare-container');
  let screenShareNode = document.getElementById('screenshare');

  if (screenShareNode) return alert('There is already a participant sharing his screen !');

  screenShareNode = document.createElement('video');
  screenShareNode.setAttribute('id', 'screenshare');
  screenShareNode.autoplay = 'autoplay';
  navigator.attachMediaStream(screenShareNode, stream);

  screenShareContainer.appendChild(screenShareNode);
}

const removeScreenShareNode = () => {
  let screenShareNode = document.getElementById('screenshare');

  if (screenShareNode) {
      screenShareNode.parentNode.removeChild(screenShareNode);
  }
}

나는 지치고 인터넷 검색에 지쳤습니다. 좀 더 정교한 문서화를 안내하거나 방향을 제시 할 수 있다면 큰 도움이 될 것입니다. 나는 돌비 문서의 모든 부분을 읽었습니다. 읽어 주셔서 감사합니다

답변

j12y Aug 25 2020 at 16:19

전화를 걸면 create()귀하의 계정에 맞는 GUID 인 새 회의 ID가 생성됩니다. get_id () 를 호출 하여 찾을 수 있습니다. 주어진 시간에 여러 회의가 활성화되어있을 때 가독성을 높이기 위해 별칭 을 지정할 수도 있습니다.

여러 회의를 원하면 create()여러 번 전화해야합니다 . 즉, 일반적인 앱은 단일 회의 만 초기화하지만 각각 자체 회의가 있거나 다른 사람을 기존 회의에 초대하기 위해 실행중인 인스턴스가 여러 개있는 것으로 예상됩니다. 웹앱의 경우 배포 된 별도의 모바일 애플리케이션이 아닌 별도의 사용자 세션 일 수 있습니다. 자신의 서비스에서 각 사용자에 대해 생성되는 ID에 대해 일부 책을 보관할 수 있습니다.

배포 된 앱을 테스트하거나 모니터링하는 동안 언제든지 계정에서 활성화 된 모든 회의를 찾을 수 있습니다. Monitor API getConferences 를 사용하여 해당 목록을 가져올 수 있습니다 .

추가 질문이있는 경우 Dolby.io 지원 을 사용 하여보다 개인적인 답변과 안내를 받는 것이 가장 좋습니다 .