react-media-recorder icon indicating copy to clipboard operation
react-media-recorder copied to clipboard

Switch camera and mic

Open ricardobaumann opened this issue 1 year ago • 1 comments

Hello team. I would like to have an example on how to switch between camera and audio devices, in the case of multiple devices.

ricardobaumann avatar Dec 27 '23 11:12 ricardobaumann

You can try

const { error, previewStream, previewAudioStream } = useReactMediaRecorder({
  // Get device id from  navigator.mediaDevices.enumerateDevices
  audio: audioDeviceID ? { deviceId: { exact: audioDeviceID } } : true,
  video: videoDeviceID ? { deviceId: { exact: videoDeviceID } } : true,
  askPermissionOnMount: true
})

Get Audio Devices

const mediaDevices = await navigator.mediaDevices.enumerateDevices()
const audioDevices = mediaDevices
  .filter((device) => device.kind === 'audioinput')
  .map((device) => ({ deviceId: device.deviceId, label: device.label })

Get Video Devices

const mediaDevices = await navigator.mediaDevices.enumerateDevices()
const videoDevices = mediaDevices
  .filter((device) => device.kind === 'videoinput')
  .map((device) => ({ deviceId: device.deviceId, label: device.label }))

scarqin avatar Jun 06 '24 13:06 scarqin