WebRTC/WebSocket屏幕錄製

在我的用例中，我想記錄屏幕活動並將其發送到服務器[不活動]。我查看了一些博客/示例演示。但我找不到與此相關的任何內容。我可以找到很多直播音頻/視頻，但不能進行屏幕錄製。WebRTC/WebSocket屏幕錄製

我有與此相關的下列問題，

哪一個將是有效的WebRTC /的WebSockets這個用例？
瀏覽器支持WebRTC/Websockets？
有沒有其他的方法來實現這個用例？

我對WebRTC/Websockets相當新，如果我沒有發佈足夠的信息請評論。我會加。

有人可以幫助我嗎？任何引用URL /任何與此用例相關的相關信息都會非常有用。

2016-03-08 Dany

以下是如何記錄屏幕在Firefox（更新：嘗試在this fiddle）：

var constraints = { video: { mediaSource: "screen", width: 320, height: 200 } }; 
 

 
var start = ms => navigator.mediaDevices.getUserMedia(constraints) 
 
    .then(stream => record(stream, ms) 
 
    .then(recording => { 
 
     stop(stream); 
 
     video.src = link.href = URL.createObjectURL(new Blob(recording)); 
 
     link.download = "recording.blob"; 
 
     link.innerHTML = "Download blob"; 
 
     log("Playing "+ recording[0].type +" recording:"); 
 
    }) 
 
    .catch(log).then(() => stop(stream))) 
 
    .catch(log); 
 

 
var record = (stream, ms) => { 
 
    var rec = new MediaRecorder(stream), data = []; 
 
    rec.ondataavailable = e => data.push(e.data); 
 
    rec.start(); 
 
    log(rec.state + " for "+ (ms/1000) +" seconds..."); 
 
    var stopped = new Promise((r, e) => (rec.onstop = r, rec.onerror = e)); 
 
    return Promise.all([stopped, wait(ms).then(() => rec.stop())]) 
 
    .then(() => data); 
 
}; 
 

 
var stop = stream => stream.getTracks().forEach(track => track.stop()); 
 
var wait = ms => new Promise(resolve => setTimeout(resolve, ms)); 
 
var log = msg => div.innerHTML += "<br>" + msg;

<button onclick="start(5000)">Record screen!</button> 
 
<div id="div"></div><br> 
 
<video id="video" height="120" width="160" autoplay></video> 
 
<a id="link"></a>

警告：在網絡上分享您的瀏覽器窗口中涉及的安全隱患！閱讀關於它here！

一旦你有了blob，你可以使用普通的網絡套接字（未顯示）上傳它。

mediaRecorder位也應該在Chrome中運行，但不幸的是，屏幕共享仍然沒有完全標準化，工作方式不同，需要在Chrome中進行擴展。

來源

2016-04-07 18:46:14 jib

它有很大的幫助。是否有可能在localhost中測試這個我的意思是沒有https？ – Dany

@Dany，是的，但只有當您將'，localhost'添加到域列表中，並且在* about：config *中將'media.navigator.permission.disabled'設置爲'true'時纔是如此。後者關閉所有getUserMedia權限，因此您可能希望在測試後將其設置回去。 – jib

由於某種原因，此相機記錄 –

該解決方案可以分爲三個部分：

獲取畫面mediastream的保持使用getUserMedia，這個瀑布下的WebRTC的範疇，因爲你正在共享屏幕，您的網站是要去必須https和您的用戶可能會需要使用擴展（Firefox和鉻），你可以尋找演示here
錄製mediastream，火狐一直支持這一段時間通過MediaRecorder並聽取鉻開始從支持它47.所以使用mediarecorder，您可以獲得記錄文件的斑點。
如何將這個blob發佈到服務器完全取決於您，您可以使用任何通道：websockets，http post等。您可以使服務器成爲WebRTC客戶端，並通過RTCDataChannel發送它，但猜測會對你的用例來說太過分了。

來源

2016-03-08 01:22:38 mido

謝謝。這真的很有幫助。 – Dany

如何記錄整個屏幕不僅意味着Firefox或任何其他的瀏覽器窗口，我想記錄最終用戶的整個屏幕。 – vaishali

@vaishali你檢查了鏈接演示（在第一點） – mido

正如@mido建議的那樣，在客戶端我會使用MediaRecorder API。另一種選擇是在服務器端進行記錄。對於後一種選擇，您可以使用一些開源媒體服務器，如[Kurento]（http://www.kurento.org/）。

來源

2016-03-12 00:47:49 AndresEC

謝謝。有沒有其他的服務器端錄音工具？我只想找到最好的一個。我對這個領域相當陌生。 – Dany

@DineshAppavoo，你也可以試試[Janus]（https://janus.conf.meetecho.com/recordplaytest.html），另一個開源項目，順便說一下，在[Github存儲庫中有重要的活動]（https://github.com/meetecho/janus-gateway） – AndresEC

WebRTC/WebSocket屏幕錄製

回答

相關問題