Click here to Skip to main content
15,446,510 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
I am making a kind of proctoring website and for it I needed access to the user's screen and display it as a video to the proctor, so that he can monitor it. here is my code:

<div id="userscreen"></div>
document.getElementById('userscreen').innerHTML =
'<video src="' + navigator.mediaDevices.getDisplayMedia({cursor:true}); + '" autoplay>video not available</video>';
I have also tried to use the following approach:

<video id="userscreen" autoplay></video>
document.getElementById('userscreen').innerHTML = navigator.mediaDevices.getDisplayMedia({cursor:true});
What I want is to:

1- start capturing the user's screen(done)
2- display the screen as a video in the video tag

I am not able to do the second step. I have tried to do this in many ways, but none of them are working. I am able to capture the screen and display it as a video after the recording stops, but I want the live video to upload it side by side. this method should have worked according to me (I have used it for adding photos from camera to a webpage), but its not working for videos maybe. I have tried this on all browsers, its not working on any.

So please tell me what is wrong in my code or some other way in which it can be done.

What I have tried:

i have tried everything i could think of
Updated 20-Nov-20 9:39am
Amarnath S 20-Nov-20 10:10am    
Maybe the server is not started. Start the server and see. If you use VS Code, you can start the app using Live Server.

1 solution

I think it's a security issue. JS is in a sandbox. If it worked for you before, it was because you weren't in the sandbox. You need the "user" to start an asynch upload.
Share this answer

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900