CODEWITHSUNDEEP
javascript
Mo Sadeghi
Mo Sadeghi

Reputation: 519

Record browser tab with javascript

Is it possible to record the current tab of the browser using just javascript and nothing else? I don't want to use chrome or firefox extension. What I want to do is that the presenter would like to record his current tab and share it with others. If it's possible what is the best way to do this?

Upvotes: 2

Views: 5690

Answers (2)

Kaiido
Kaiido

Reputation: 136856

There is... something that is in the process of being defined: MediaCapture Screen Share API.

This will allow to create a MediaStream from different sources such as the user's screen, or one of their apps' window, or some unclear-to-me "browser" thing.
From this MediaStream, it is easy to record it with the MediaRecorder API.

Currently, no browser has really implemented what is being defined there, but you can get some experimental implementations in Firefox, and, only from extension in Chrome.

This API doesn't really define a way to choose the current tab by default though, so your users will have to select this tab themselves from a prompt.

Live Example that will currently work only in Firefox.

And mandatory code block to be able to link to the fiddle, even though this code will not work anywhere for now!

navigator.getDisplayMedia({ video: true })
  .then(stream => {
    // we have a stream, we can record it
    const chunks = [];
    const recorder = new MediaRecorder(stream);
    recorder.ondataavailable = e => chunks.push(e.data);
    recorder.onstop = e => exportVid(new Blob(chunks));
    recorder.start();
    // defineWhenWeStopRecorder(recorder)
  }, error => {
    console.log("Unable to acquire screen capture", error);
  });

Upvotes: 4

hashed_name
hashed_name

Reputation: 551

I have not worked on recorder yet. But found this post that may help. It is an API.

https://hacks.mozilla.org/2016/04/record-almost-everything-in-the-browser-with-mediarecorder/

Upvotes: 1

Related Questions