• navigator.mediaDevices.getUserMedia()
  • navigator.mediaDevices.enumerateDevices()
  • navigator.mediaDevices.getDisPlayMedia()

1. Get media streams

navigator.mediaDevices.getUserMedia(constraints)

The constraints argument is an object and returns a promise: Stream

video:Boolean || Object
auido:Boolean || Object

constraints = {
    video
    audio
}
Copy the code

Video – Indicates whether a video track is required

Audio – Indicates whether an audio track is required

Simple configuration

video = true || false
audio = true || false
Copy the code

More configuration

video = { frameRate: Number || Object deviceId: Null || String width: Number || Object height: Number | | Object facingMode: audio = {String} deviceId: Null | | String sampleRate: Number sampleSize: Number/volume: Number echoCancellation: Boolean autoGainControl: Boolean noiseSuppression: Boolean latency: Number channelCount: Number || Object }Copy the code

# frameRate: frameRate

# deviceId: Null the default parameter, which can also specify a specific deviceId

# width, height: more parameters (min, Max,exact)

#facingMode: mobile parameters, optional “front”, “rear”, user (front camera), environment (rear camera)

Erate: specify a desired sampleRate such as 44,000 samples/s or 44kHz for a CD.

# sampleSize: number of bits per sample point (CD sample size is 16 bits/sample)

# volume: 0-1

# echoCancellation: whether to use echoCancellation to try to remove audio that is passed back to the speaker via the microphone

# autoGainControl: Whether to modify the microphone input volume

# noiseSuppression: Whether to attempt to remove background noise from the audio signal

Latency: Controls the time, in seconds, between the start of sound processing and the next step in which data can be used

# channelCount: Mono 1, stereo 2. You can also configure it in object form

2. Obtain the device list

navigator.mediaDevices.enumerateDevices()

The return value is a promise: Array includes all device information: audio input, audio output, video input

DeviceId: device ID, groupId: group ID kind: device type - audioinput audiooutput, videoinput label: device nameCopy the code

GroupId: Audio or video files with the same ID belong to the same device

3. Get the window stream

navigator.mediaDevices.getDisPlayMedia(constraints)

The constraints argument is an object and returns a promise: Stream

Simple configuration

video = true || false
audio = true || false
Copy the code

More configuration

video = {
    frameRate: Number || Object
    width: Number || Object
    height: Number || Object
}
Copy the code

Ps: electron obtains the screen flow mode

navigator.mediaDevices.getUserMedia({
	audio: false,
	video: {
		mandatory: {
			chromeMediaSource: 'desktop',
			chromeMediaSourceId: source.id
		}
	}
}).then(stream => {
	console.log(stream)
})
Copy the code