Accomplish screen sharing using WebRTC

Question

I need to implement screen sharing using WebRTC. I know that WebRTC supports sharing of tab content but I need to share the whole screen. A solution I am thinking of is to frequently take screenshots and using WebRTC data channel transfer the image to other party. The other party will then update the image each time a new image is received.

Is this possible to accomplish? Particularly I am wondering if it is possible to transfer image using WebRTC data channel?

Thank you in advance.

You could transfer an image via the DataChannel but the bigger problem will be to capture the screen from inside of the JavaScript sandbox. I suspect that's just not possible without some kind of browser extension. — Makkes, Jul 09 '13 at 13:46

Sam Dutton · Answer 1 · 2013-07-11T07:18:37.930

9

getUserMedia supports screensharing of the whole screen, not just the tab content.

I've done a screen capture demo (using the mandatory constraint chromeMediaSource: 'screen') which pipes the stream into an RTCPeerConnection: https://simpl.info/screencapture.

The chrome.tabCapture API gets tab content, but of course that's not what you want: example here (though the code is now broken).

EDIT: added HTTPS to links: this is required for screencapture.

edited Jul 11 '13 at 07:18

answered Jul 10 '13 at 16:11

Sam Dutton

14,775
6
54
64

Thanks for the answer. getUserMedia is really what I need. But in order to test it locally seems I'll have to install some HTTPS server right? – mkd156 Jul 11 '13 at 13:39
1

Is it possible to get 60FPS with this method? I tried but seems far from ideal. – wonglik Feb 19 '14 at 18:33
Is there a way to get screen sharing now as chrome doesn't have the flag that enables screen sharing in the latest version. – Bilbo Baggins Jan 16 '17 at 06:52
Screen capture is now available for Chrome on Android behind a flag. See the demo at https://simpl.info/sc, and Paul Kinlan's article at https://paul.kinlan.me/screen-recording-with-getUserMedia-and-WebRTC/. – Sam Dutton Jan 16 '17 at 22:38

score 7 · Answer 2 · edited May 23 '17 at 12:10

7

Screensharing is available via an experimental getUserMedia constraint in Chrome (not yet available in Firefox).

You'll need to first enable the flag called Enable screen capture support in getUserMedia() in chrome://flags.

There's a nice example of how to capture the screen here: https://html5-demos.appspot.com/static/getusermedia/screenshare.html.

edited May 23 '17 at 12:10

Community

1
1

answered Jul 09 '13 at 14:52

tomtheengineer

4,127
1
17
15

1

Thanks, good example. But when I copy the html content to my local html file it doesn't work. Seems I'll need to install HTTPS server. – mkd156 Jul 11 '13 at 13:40
Not anymore, it seems: https://groups.google.com/forum/#!topic/discuss-webrtc/TPQVKZnsF5g – Max Nov 09 '14 at 02:08
1

`Enable screen capture support` flag is removed from Chrome – Reza Aug 08 '16 at 20:56
Is there a newer way introduced for Screen capturing ? – Bilbo Baggins Jan 16 '17 at 06:50
Anyone know if there's a replacement flag or how to enable screen capture via getUserMedia() ? – lukenofurther May 02 '17 at 22:56

score -1 · Answer 3 · answered Nov 24 '14 at 14:55

-1

Take a look at this Chrome Extension, it has implemented desktop sharing and it's pretty good. https://www.webrtc-experiment.com/Pluginfree-Screen-Sharing/

answered Nov 24 '14 at 14:55

Gábor Imre

5,899
2
35
48

Accomplish screen sharing using WebRTC

3 Answers3