switch camera not working
Opened this issue · 3 comments
i am using this code in my project:
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
const [availableDeviceIds, setAvailableDeviceIds] = useState([]);
const [counter, setCounter] = useState(0);
useEffect(() => {
navigator.mediaDevices.enumerateDevices().then(mediaDevices => {
const videoDevices = mediaDevices.filter(x => x.kind === 'videoinput');
videoDevices.map((x: any, index) => {
setAvailableDeviceIds(x.deviceId);
});
});
}, [availableDeviceIds]);
const handleSwitchCamera = () => {
console.log('availableDeviceIds', availableDeviceIds);
if (onSwitchCamera) {
onSwitchCamera();
}
if (availableDeviceIds?.lenght > 0) {
if (counter === 0) {
setCounter(1);
} else if (counter === 1) {
setCounter(0);
}
} else {
setCounter(0);
}
stream && stream.getTracks().forEach(stream => stream.stop());
if (availableDeviceIds?.lenght > 0) {
turnOnCamera(availableDeviceIds[counter]);
} else {
turnOnCamera(availableDeviceIds[0]);
}
};
const turnOnCamera = (deviceId: any) => {
if (onTurnOnCamera) {
onTurnOnCamera();
}
navigator.mediaDevices.enumerateDevices().then(mediaDevices => {
const fallbackContraints = {
audio: true,
video: true,
};
let currentConstraints: any;
if (availableDeviceIds?.lenght > 0) {
currentConstraints = merge(
{
video: {
deviceId: {
exact: availableDeviceIds[counter],
},
},
},
constraints,
);
} else {
currentConstraints = merge(
{
video: {
deviceId: {
exact: availableDeviceIds[0],
},
},
},
constraints,
);
}
navigator.mediaDevices
.getUserMedia(currentConstraints)
.catch(err => {
if (
err.name === 'NotReadableError' ||
err.name === 'OverconstrainedError'
) {
console.warn(
`Got ${err.name}, trying getUserMedia again with fallback constraints`,
);
return navigator.mediaDevices.getUserMedia(fallbackContraints);
}
throw err;
})
.then(handleSuccess);
});
};
const handleSuccess = stream => {
setStream(stream);
if (onCameraOn) {
onCameraOn();
}
// setSrc(stream);
// onTurnOnCamera();
};
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
and my videoRecorder is:
<VideoRecorder
constraints={{
audio: true,
video: true,
}}
src={src}
stream={stream}
/>
And after clicking on the button that calls the handleSwitchCamera function, the screen turns black.
Facing the same issue too, the camera switch does not seem to be working.
I'm seeing same issue, reverted to 3.18.4 and it works
3.18.4 is working but not turn on the flash light on iPhone.