CODEWITHSUNDEEP
javascripthtmlwebex
Danish Ghazi
Danish Ghazi

Reputation: 61

NotReadableError: Could not start video source

I have a web app that lets user toggle camera view similar to a video call app. But everytime I press the switch camera view button I get the error: "NotReadableError: Could not start video source". Im fairly new to camera functions in javascript so Im not sure why I keep triggering this error. Its worth mentioning that Im using Webex to integrate the video calling functions. Any help would be greatly appreciated. Thanks in advance.

Code for switching camera view:

//Switching camera view:
(() => {
  const videoElm = document.querySelector('#self-view');
  var camSwitch = document.getElementById('but1');

  // const supports = navigator.mediaDevices.getSupportedConstraints();

  if (navigator.mediaDevices && navigator.mediaDevices.getSupportedConstraints) {
    const supports = navigator.mediaDevices.getSupportedConstraints();
    if (!supports['facingMode']) {
      alert('Browser Not supported!');
      return;
    }

    let stream;

    const capture = async facingMode => {
      const options = {
        audio: false,
        video: {
          facingMode,
        },
      };

      try {
        if (stream) {
          const tracks = stream.getTracks();
          tracks.forEach(track => track.stop());
        }
        stream = await navigator.mediaDevices.getUserMedia(options);
      }
      catch (e) {
        alert(e);
        return;
      }

      // Get active deviceID
      const videoTrack = stream.getTracks()?.find(track => track.kind === "video");
      devID = videoTrack.getSettings().deviceId;

      console.log('VideoID:' + devID);
      setVideoInputDevice();
    }

    if (camSwitch) {
      camSwitch.addEventListener('click', () => {
        if (document.getElementById('but1').value == 'front') {
          capture('environment');
          document.getElementById('but1').value = 'back';
        }
        else {
          capture('user');
          document.getElementById('but1').value = 'front';
        }
      });
    }
  }
  else {
    console.error('navigator.mediaDevices or getSupportedConstraints is not supported in this browser');
  }
})();

function setVideoInputDevice() {
  console.log("Function: SetVideoInputDevice")
  var meeting = activeMeeting;
  const { video } = getAudioVideoInput();
  var videoID = devID;

  if (meeting) {
    const mediaSettings = {
      receiveVideo: true, // set receiveVideo to false to only receive audio
      receiveAudio: true,
      receiveShare: false,
      sendShare: false,
      sendVideo: true, // set sendVideo to false to only send audio
      sendAudio: true
    };

    stopMediaTrack('video');
    meeting.getMediaStreams(mediaSettings, { video })
      .then((mediaStreams) => {
        const [localStream, localShare] = mediaStreams;
        meeting.updateVideo({
          sendVideo: true,
          receiveVideo: true,
          stream: localStream
        });
      })
      .catch((error) => {
        console.log('MeetingControls#setVideoInputDevice :: Unable to set video input device');
        console.error(error);
      });
  }
  else {
    console.log('MeetingControls#getMediaDevices() :: no valid meeting object!');
  }
}

function getAudioVideoInput() {
  const deviceId = (id) => ({ deviceId: { exact: id } });
  const audioInput = 'default';
  const videoInput = devID;

  return { audio: deviceId(audioInput), video: deviceId(videoInput) };
}


function stopMediaTrack(type) {
  console.log("Function: stopMediaTrack");
  const meeting = activeMeeting;

  if (!meeting) return;
  const { audioTrack, videoTrack, shareTrack } = meeting.mediaProperties;

  // Note: sometimes we are adding new track so the old track might not be present
  // eslint-disable-next-line default-case
  switch (type) {
    case 'audio':
      audioTrack?.stop();
      break;
    case 'video':
      videoTrack?.stop();
      break;
    case 'share':
      shareTrack?.stop();
      break;
  }
}

Upvotes: 1

Views: 398

Answers (1)

dream
dream

Reputation: 13

I also encountered this problem, but I restarted my computer and everything returned to normal. Can you check if the built-in camera in the Windows 10 system can turn on the camera normally?

Upvotes: 0

Related Questions