Kurento屏幕在房間共享

我目前正面臨一些問題與我加入的任何Kurento房間共享我的屏幕。現在我正在使用回購（https://github.com/TribeMedia/kurento-group-call-1）並對代碼進行修改，以幫助將屏幕共享conept附加到應用程序。Kurento屏幕在房間共享

目前，我能夠做到以下幾點：

添加的頁面（超級簡單）
上的共享屏幕按鈕獲取點擊共享屏幕按鈕時接觸屏幕/窗口彈出（使用muaz khan的getScreenId.js（https://github.com/muaz-khan/getScreenId））
選擇所需的應用程序/窗口後，顯示爲用戶的本地流（實際查看共享內容），然後重新創建rtc連接。

，我現在面臨的問題是，當其他同行加入了房間，我得到的首批參與者的房間裏的攝像頭流，而不是屏幕共享。在執行過程中是否存在缺少的內容？如果有人能幫助我，我們真的會很有幫助！

以下是我已經實現的代碼片段：

index.html中： <button id="sharescreen" disabled="disabled" onClick="shareScreen()">Share Screen</button>

在客戶端的js代碼： ```

function shareScreen(){ 
    var audioConstraints = { 
     audio: false, 
     video: true, 
    }; 
    navigator.getUserMedia(audioConstraints, function(stream) { 
     initiateScreenSharing(stream); 
    }, function(error) { 
     console.error("Could not get audio stream! " + error); 
    }); 
} 

function initiateScreenSharing(audioStream){ 
    getScreenId(function (error, sourceId, screen_constraints) { 
     console.log("screen_constraints"); 
     console.log(screen_constraints); 
     navigator.getUserMedia = navigator.mozGetUserMedia || navigator.webkitGetUserMedia; 
     navigator.getUserMedia(screen_constraints, function (stream) { 
      console.log(stream); 

      var constraints = { 
       audio: true, 
       video: { 
        frameRate: { 
         min: 1, ideal: 15, max: 30 
        }, 
        width: { 
         min: 32, ideal: 50, max: 320 
        }, 
        height: { 
         min: 32, ideal: 50, max: 320 
        } 
       } 
      }; 

      var localParticipant = new Participant(sessionId); 
      participants[sessionId] = localParticipant; 
      localVideo = document.getElementById("local_video"); 
      var video = localVideo; 

      var options = { 
       localVideo: video, 
       videoStream: stream, 
       mediaConstraints: constraints, 
       onicecandidate: localParticipant.onIceCandidate.bind(localParticipant), 
       sendSource: 'desktop' 
      }; 


      localParticipant.rtcPeer = new kurentoUtils.WebRtcPeer.WebRtcPeerSendrecv(options, function (error) { 
       if (error) { 
        return console.error(error); 
       } 

       // Set localVideo to new object if on IE/Safari 
       localVideo = document.getElementById("local_video"); 

       // initial main video to local first 
       localVideoCurrentId = sessionId; 
       //localVideo.src = localParticipant.rtcPeer.localVideo.src; 
       localVideo.muted = true; 

       console.log("local participant id : " + sessionId); 
       this.generateOffer(localParticipant.offerToReceiveVideo.bind(localParticipant)); 
      }); 

     }, function (error) { 
      console.error(error); 
     }); 
    }); 
}

`` `

例如：

如果PeerA加入房間1st並共享桌面，並且PeerB加入同一個房間，則PeerB將看到PeerA的網絡攝像頭流，而不是桌面（已共享）。 P.S. PeerA實際上能夠看到桌面被共享，出於某種原因，發送到PeerB的流是網絡攝像頭而不是共享屏幕。

來源

2017-05-08 Karthik

您是如何設法共享屏幕的？它是否適用於最新版本的瀏覽器，如Chrome和Firefox？ –

好的。所以事實證明，你在屏幕分享中所需要做的就是使用流媒體。

這是怎麼一回事呢：

客戶端：

做就是getUserMedia（）的調用來首先獲得音頻（使用音頻約束N通話）
下一個ü需要調用getScreenId（），該函數將返回「屏幕」流。該函數返回屏幕約束。
現在使用這些約束，使「選項變量ANS通」sendSource「稱爲」屏幕「
執行調用以：

new kurentoUtils.WebRtcPeer.WebRtcPeerSendrecv(options, function (error)

該函數的回調函數必須調用generateOffer（它將提供」offer「）。

作出WebSocket的通話

服務器端所需的信息：

現在在服務器端，首先「釋放」當前userSession的傳出端點：

userSession.outgoingMedia.release();

然後，你將需要刪除PPL的其餘部分的「進入端點」在房間爲：

爲（VAR i的usersInRoom）{ VAR用戶= usersInRoom [I]; //從這個釋放查看器if（user.id == userSession.id）{ continue; } user.incomingMedia [userSession.id] .release（）; delete user.incomingMedia [userSession.id]; }
現在做一個新的端點，並將其設置爲當前usersessions的傳出端點
在此之後做需要做的步驟，將您當前的視頻和接收其他視頻

注意：記得在顯示流時，確保html頁面上的「div」元素不存在重複。這會導致一些衝突，並且您不會在其他屏幕上收到屏幕共享

來源

2017-06-06 01:39:05 Karthik

你可以在Github的要點中分享你的代碼嗎？謝謝 – Antoine

Kurento屏幕在房間共享

回答

相關問題