2015-09-03 3 views
2

Я хочу создать расширение для совместного использования экрана. Я пробовал некоторые примеры, которые предоставил Muas Khan на GitHub, но его сложно реализовать в вашем коде, если вы новичок в WebRTC. Могу ли я добиться совместного использования экрана с использованием navigator.getUserMedia? Имейте в виду, что я использую Firefox, и я не хочу использовать свою веб-камеру, поскольку я использую только свой экран. Могу ли я написать приведенный ниже код?Как использовать совместное использование экрана в Firefox с помощью navigator.getUserMedia?

window.navigator = window.navigator || {}; 
navigator.getUserMedia = navigator.getUserMedia || 
         navigator.webkitGetUserMedia || 
         navigator.mozGetUserMedia || 
         null; 

if (navigator.getUserMedia === null) { 
    // document.getElementById('gum-unsupported').classList.remove('hidden'); 
    document.getElementById('videorecorderplay-button- recorder').setAttribute('disabled', 'disabled'); 
    document.getElementById('videorecorderstop-button-recorder').setAttribute('disabled', 'disabled'); 
} else { 
    // Opera <= 12.16 accepts the direct stream. 
    // More on this here: http://dev.opera.com/articles/view/playing-with-html5-video-and-getusermedia-support/ 
    var createSrc = window.URL ? window.URL.createObjectURL : function (stream) { return stream; }; 

    // Opera <= 12.16 support video only. 
    var audioContext = window.AudioContext || 
         window.webkitAudioContext || 
         null; 
    if (audioContext === null) { 
     document.getElementById('gum-partially-supported').classList.remove('hidden'); 
    } 

    document.getElementById('videorecorderplay-button-recorder').addEventListener('click', function() { 
     debugger; 
     // Capture user's audio and video source 
     navigator.getUserMedia({ 
      video: {mandatory:{chromemediasource:'screen'} 
    }, 
      audio: true 
     }, 
     function (stream) { 
      videoStream = stream; 
      // Stream the data 
      video.src = createSrc(stream); 
      video.play(); 
     }, 
     function (error) { 
      console.log("Video capture error: ", error.code); 
     }); 
    }); 
    document.getElementById('videorecorderstop-button-recorder').addEventListener('click', function() { 
     // Pause the video 
     video.pause(); 
     // Stop the stream 
     videoStream.stop(); 
    }); 

Его фактически не работает для меня. Где мне не хватает?

+0

'chromemediasource' не будет работать в Firefox. Перейдите на страницу https://mozilla.github.io/webrtc-landing/gum_test.html, нажмите «Экран» и следуйте инструкциям на экране, чтобы включить необходимые префикс в about: config и заставить его работать. Затем посмотрите на источник и сделайте свой собственный. Не забудьте сохранить белый список в домене, так как совместное использование экрана опасно для безопасности. – jib

ответ

1

ограничения совместного использования экрана отличаются в хроме и светлячок, в Firefox, это:

navigator.getUserMedia({ video: { 
    mediaSource: "window"  // options are 'screen' ‘window‘ or ‘application‘ 
}}).then(stream => ...) 

также убедитесь, что в about:config указанные ниже флаги установлены правильно:

  • media.getusermedia.screensharing.allowed_domains список включает в себя домена вашего приложения.
  • media.getusermedia.screensharing.enabled устанавливается как истинный
Смежные вопросы