I’ve been working with a lot of developers on WebRTC solutions. One, in particular, needed screensharing for their next-generating proctoring solution, so I built a proof-of-concept (PoC) screensharing app using node-webkit.
A typical video call with Respoke starts with starting a call with another endpoint:
In addition, we need to enable usermedia screen capturing in node-webkit. To do this, we added the following chromium-args to our npm package.json file:
--enable-usermedia-screen-capturing chromium flag replaces the media transmitted with your screen instead of your camera input.
Our Respoke screensharing demo is open source. To use it, head over to our Respoke Screensharing Node-Webkit GitHub repo. Then run the following commands from your terminal:
Give it a try. If you find any issues, we welcome pull requests.
Media Stream Constraints
To make screensharing work, we had to pass a MediaStreamContraint object literal. But, where does all this come from? It all starts with a w3 spec. When specs are not final, vendor implementation typically starts from a draft spec. In this case, the Media Capture and Streams working draft. There is no current consensus on what every constraints should be. The working drafts acts a starting point so vendors like Google can start implementing real examples of how constraints are used.
For example, the working draft specifies constraints like width, height, frameRate and aspectRatio. But the Chromium MediaConstraints source code specifies so much more available constraints like minAspectRatio, maxAspectRatio, minWidth, maxWidth, minHeight, maxHeight, minFrameRate and maxFrameRate:
The Chromium MediaConstraints even go on to define other interesting experimental contraints like echoCancellation, noiseReduction and cpuOveruseDetection:
Of course there is no guarantee that those features will make it to the final Media Capture and Streams spec.
Flags We had to use Chromium command line flags to enable screensharing. Chromium command line flags are another interesting piece of the puzzle.
For one they enable developers to take advantage of features not available to the general public. Another is peeking behind the covers is just really cool to see. Take for example the Chromium flag we used earlier:
It’s source code is defined in Chromium’s content_switches.h header file:
And implemented in Chromium’s content_switches.cc file:
We then use those flags as chromium-args in our node-webkit apps. You can pass chromium flags to chrome directly as well. On Mac OS X, you’d use:
open -a "Google Chrome" --args --enable-usermedia-screen-capturing
On Windows, something like:
chrome.exe --args --enable-usermedia-screen-capturing
I hope you’re as excited about the future of WebRTC as we are. It’s a great time to be a developer. Fork our demo screensharing app using Respoke and Node-Webkit. Play around and if you like it, share it with your friends.