Accomplish Screen Share functionality using JavaScript

Sangam Pokharel
2 min readFeb 14, 2021

Recently, there have been a new feature added by top tech companies like facebook , skype, zoom etc which is an Screen Share feature. So today in this article we’ll try to achieve such feature using JavaScript and is really simple.so lets get started…

I simply created a button with the id “shareBtn” in index.html file. Now we move on to JavaScript file because all the logic is packed in index.js file.

IN order add the button click functionality we need to take the reference of button at line 1 in index.js file after that we listen to the click event. So as soon as the user click the button the second param function gets triggered. The function is asynchronous because we are using the webapi of browser and wrap it in the try Catch block if incase we get the error. The window has navigator object in which mediaDevices is nested which gets access to getDisplayMedia Function it allows us to share the screen. That’s it !

--

--

Sangam Pokharel

I am Full stack web/mobile application developer. I basically work in tech like React(Web) / React Native (mobile app) / Node js (Server)