Stack Overflow
Stack Overflow

Questions tagged [get-display-media]

Method to programmatically prompt the user to select and grant permission to capture the contents of a display or portion thereof (such as a window or screen) as a MediaStream.

getDisplayMedia provides access to video (and optionally audio) streams rendered on the user's device, allowing to capture part or all of a screen for streaming, recording, or sharing. It is used from Javascript running in a user's web browser.

Support varies from browser to browser. See MDN Browser Compat Data for up-to-date information.

getDisplayMedia forms part of browser-resident WebRTC support (see ). It can be used by itself without establishing WebRTC connections.

It can also be used in conjunction with MediaRecorder; see . It completes getUserMedia that allows to capture streams from a camera or a microphone.

Further references:

72 questions
2
votes
1 answer

Why does screen recording of the entire screen vs a window vs a single tab result in significantly different file sizes?

I'm working on integrating screen capturing in a framework I'm expanding. I'm requesting the MediaStream of the screen through the getDisplayMedia method and recording it using the RecordRTC library. Both Firefox and Chrome allow the user specify…
user15175033
  • 23
  • 4
2
votes
2 answers

Screen recordings in JavaScript with navigator.mediaDevices.getDisplayMedia aren't seekable

We are trying to Record the Screen in ReatJS with navigator.mediaDevices.getDisplayMedia API and downloading the video locally after converting the Stream into Blob. To download the video I am converting the Stream into Blob and then used…
Kashif Ali
  • 91
  • 5
2
votes
0 answers

interaction between requestfullscreen and getDisplayMedia in chrome

Using chrome, it seems like getDisplayMedia and requestFullscreen don't play well together when (1) a tab is selected for capture, and (2) an element on that tab requests fullscreen. At this point chrome will display this weird windowed version of…
T Jones
  • 21
  • 1
2
votes
0 answers

getDisplayMedia (get the list of available options)

I'm trying to get the list of available stream sources which are shown on native chrome pickup screen, when calling getDisplayMedia. Is there an callback which returns an array of available options, I want to customize this native pickup…
sd Born
  • 61
  • 5
2
votes
0 answers

Simultaneously record screen and preview camera in a web app works bad on Chrome/macOS setup

The goal is to preview a stream of the computer's web camera in a html video element and at the same time record audio and the Chrome tab showing another video and the preview using the MediaRecorder API, navigator.mediaDevices.getDisplayMedia and…
raols
  • 21
  • 5
2
votes
0 answers

getDisplayMedia "could not start audio source"

I have chrome, version info: Google Chrome 80.0.3987.149 (Official Build) (64-bit) (cohort: Stable) Revision 5f4eb224680e5d7dca88504586e9fd951840cac6-refs/branch-heads/3987_137@{#16} OS Windows 7 Service Pack 1 (Build 7601.24544) And when…
B''H Bi'ezras -- Boruch Hashem
  • 3,665
  • 3
  • 33
  • 83
2
votes
0 answers

getDisplayMedia application window with audio?

Currently the new getDisplayMedia() API only allows you to capture audio if using Desktop Capture or Chrome Window Capture. Application window capture does not capture audio. Is there a way to capture the full desktop audio when using Application…
Vans S
  • 1,743
  • 3
  • 21
  • 36
2
votes
4 answers

navigator.getDisplayMedia is not a function in angular 6

I am trying to share user screen and need to use getDisplayMedia but getting error during project compile time Property 'getDisplayMedia' does not exist on type 'Navigator' Here is the code let stream = await navigator.getDisplayMedia({ video:…
WasiF
  • 26,101
  • 16
  • 120
  • 128
2
votes
2 answers

Screensharing in Angular 6 in Firefox

I'm making an Angular application and I need to be able to share the users screen. I'm using adapter.js version 6.4.8 and testing it in Firefox Developer 64.0b11 & Firefox 63.0.3, I know there are a lot of differences in implementations between…
RobbeV
  • 23
  • 1
  • 4
1
vote
0 answers

Can I allow only fullscreen with getDisplayMedia?

I am writing code for which is supposed to make screenshots of user monitor. I am using getDisplayMedia function to capture user screen and then making image from current frame in some intervals. I call for getDisplayMedia with function: await…
BobiDaHombre
  • 193
  • 1
  • 4
  • 19
1
vote
0 answers

How do I remove the top bar that appears when sharing a tab using getDisplayMedia on Chrome?

when sharing a tab on Chrome using the getDisplayMedia function it will push the webpage down to display a bar indicating you are sharing one of your tabs in all of your tabs. This is shown below: Shared tab: Tab used to share: Random Tab: How do…
Naitzirch
  • 45
  • 1
  • 2
  • 6
1
vote
0 answers

getDisplayMedia is giving "DOMException: The associated Track is in an invalid state"

I have written a code that will take the screenshot after some time interval. The code is: function captureScreenshot() { if (screenStream) { screenStream.getTracks().forEach(track => { track.stop(); }); } …
Syed Toheed Gillani
  • 11
  • 2
1
vote
1 answer

Chromium Embedded Framework cannot access system audio with getDisplayMedia

Is it possible to capture system screen & audio with chromium embedded framework using getUserMedia or getDisplayMedia? I've managed to get a video only stream of the system so far, but i cannot get audio capture to work. In standard Chrome you can…
NickG
  • 550
  • 4
  • 18
1
vote
1 answer

Screen Recording Portion of Screen with JavaScript

I am attempting to implement a screen recorder in JavaScript that records a video feed rather than the entire screen. My question is whether or not this is possible using getDisplayMedia or if there is a library to achieve this. This is my current…
Myles Jefferson
  • 115
  • 1
  • 1
  • 5
1
vote
1 answer

Check primary monitor in JavaScript with navigator.mediaDevices.getUserMedia

I want to capture the main monitor by the browser. I'm trying to do it like this: navigator.mediaDevices.getDisplayMedia({ video: { displaySurface: 'monitor', logicalSurface: true, cursor: 'always', frameRate:…
Антон Баралгинович
  • 45
  • 7
1 2
3
4 5