webrtc / FirebaseRTC

Codelab for building a WebRTC Video chat application using Firebase Cloudstore.
https://webrtc.org
492 stars 343 forks source link

how to share screen to other user #39

Open jamesctl opened 3 years ago

jamesctl commented 3 years ago

I down load the source code and try to share screen on meeting, but I only see my screen, other user can not see. this is code: when user click on button share screen

<button class="mdc-button mdc-button--raised"  id="startButton">
        <i class="material-icons mdc-button__icon" aria-hidden="true">close</i>
        <span class="mdc-button__label">sharing</span>
    </button>
<video id="sharing-video" autoplay playsinline muted></video>
<script>
const videoShareScreen = document.querySelector('video');
startButton.addEventListener('click', () => {
 navigator.mediaDevices.getDisplayMedia({ screen: true,screenAudio: true}).then(handleSuccess, handleError);
})
function handleSuccess(stream) {
  startButton.disabled = true;

  // demonstrates how to detect that the user has stopped
  // sharing the screen via the browser UI.

    videoShareScreen.srcObject = stream;

  stream.getVideoTracks()[0].addEventListener('ended', () => {
    errorMsg('The user has ended sharing the screen');
    startButton.disabled = false;
  });
}
function handleError(error) {
  errorMsg(`getDisplayMedia error: ${error.name}`, error);
}
</script>