如何在navigator.getUserMedia的幫助下使用Firefox中的屏幕共享？

我想創建一個屏幕共享擴展。我嘗試過一些由GasHub上的Muas Khan提供的例子，但如果你是WebRTC的新手，那麼很難在你的代碼中實現它們。我可以使用navigator.getUserMedia實現屏幕共享嗎？請記住，我使用的是Firefox，我不想使用我的攝像頭，因爲我只是共享我的屏幕。我可以寫下面的代碼嗎？如何在navigator.getUserMedia的幫助下使用Firefox中的屏幕共享？

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(); 
    });

它實際上不適合我。我錯過了什麼？

來源

2015-09-03 Yash

'chromemediasource'不會工作在Firefox。轉到https://mozilla.github.io/webrtc-landing/gum_test.html，按下'Screen'並按照屏幕上的說明在about：config中啓用必要的前綴並使其工作。然後看看源代碼並製作你自己的。不要忘記將您的域名列入白名單，因爲屏幕共享存在安全風險。 – jib

屏幕共享限制在Chrome和Firefox不同，在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被設置爲真

來源

2016-05-12 09:12:36 mido

如何在navigator.getUserMedia的幫助下使用Firefox中的屏幕共享？

回答

相關問題