5

I'm trying to share my screen with Kurento WebRtc server. But getting this error:

NavigatorUserMediaError {name: "ScreenCaptureError", message: "", constraintName: ""}

There is no errors in Firefox with same code. Constraints using for webrtc:

    var constraints = {
        audio: true,
        video: {
            mandatory : {
                chromeMediaSource: 'screen',
                maxWidth: 1920,
                maxHeight: 1080,
                maxFrameRate: 30,
                minFrameRate: 15,
                minAspectRatio: 1.6
            },
            optional: []
        }
    }

    var options = {
           localVideo : video,
           onicecandidate : onIceCandidate,
           mediaConstraints : constraints
    }
    webRtcPeer = new kurentoUtils.WebRtcPeer.WebRtcPeerSendonly(options,function(error) {
       if (error) {
           return console.error(error);
       }
       webRtcPeer.generateOffer(onOfferPresenter);
    });

How do I share my screen using chrome and kurento?

morozRed
  • 176
  • 4
  • 14

1 Answers1

9

Sharing a screen with Kurento through WebRTC, is exactly the same as sharing the webcam: get the stream from the client and negotiate the endpoint. The tricky part when doing screenshare is to get the stream. The kurento-utils-js library will give you a little help on that, as you can create the WebRtcPeer object, in the client, indicating that you want to share your screen or a window. You just need to make sure that you

  • have an extension installed to do screen-sharing in Chrome. In FF, it's enough to add the domain to the whitelist. Check this extension.
  • pass a valid sendSource value (screen or window) in the options bag when creating the kurentoUtils.WebRtcPeer object
  • have a getScreenConstraints method in your window object, as it will be used here. getScreenConstraints should return a valid set of constraints, depending on the browser. YOu can check an implementation of that function here

I think that should be enough. We are doing screen sharing with the library, using our own getScreenConstrains and extension, and it works fine. Once you have that, doing screen sharing with the kurento-utils-js library is quite easy. Just need to pass the sendSource value when creating the peer like so

 var constraints = {
   audio: false,
   video: true
 }

 var options = {
   localVideo: videoInput, //if you want to see what you are sharing
   onicecandidate: onIceCandidate,
   mediaConstraints: constraints,
   sendSource: 'screen'
 }

 webRtcPeerScreencast = kurentoUtils.WebRtcPeer.WebRtcPeerSendrecv(options, function(error) {
   if (error) return onError(error) //You'll need to use whatever you use for handling errors

   this.generateOffer(onOffer)
 });

The value of sendSource is a string, and it depends on what you want to share

  • 'screen': will let you share the whole screen. If you have more than one, you can choose which one to share
  • 'window': lets you choose between all open windows
  • [ 'screen', 'window' ]: WARNING! Only accepted by Chrome, this will let the user choose between full screens or windows.
  • 'webcam': this is the default value of you don't specify anything here. Guess what'll happen ;-)
igracia
  • 3,543
  • 1
  • 18
  • 23
  • 1
    Thanks for your answer @igracia, it was helpful. I fixed the problem by using [this hack](https://github.com/muaz-khan/getScreenId) – morozRed Apr 08 '16 at 17:02
  • @Moroz_Grigory You are welcome! `getScreenId.js` is equivalent to our `getScreenConstraints` function :-) – igracia Apr 09 '16 at 07:26
  • I really appreciate this post helping me out get the required pieces of code for screen sharing....but when whenever I share my screen...my shared window is visible to me as local video, but the person who has joined the room still sees my webcam stream... any idea why??? – Karthik May 08 '17 at 06:43
  • Further, how do I renegotiate my endpoint so that the others can see the shared screen? @Moroz_Grigory how did u carry this out? – Karthik May 09 '17 at 01:35
  • @Karthik you should double check mediaConstraints in your code to prevent sharing your screen (share your sources if it's possible). About renegotiation: You have to store all viewers/presenters. On connection you will ask your server about all presenters in room and then you'll connect to them using sessionID and local offer. – morozRed May 11 '17 at 12:21