I’m trying to open cameras in portrait mode (vertically). It works fine in my development PCs (two desktops and a notebook) + chrome browser, but I’m failing to do the same in a debug android phone + chrome mobile.
I’m writing a vuejs2.x app, but this camera part is pure html+js:
const testAspectRatio = this.isLandscape() ? 1920/1080 : 1080/1920
const cameraConstraints = {
video: {
deviceId: deviceId,
aspectRatio: testAspectRatio,
// width: { ideal: this.isLandscape() ? 1920 : 1080 },//this.height,
// height: { ideal: this.isLandscape() ? 1080 : 1920 } //this.width
}
}
navigator.mediaDevices.getUserMedia(this.cameraConstraints).then(stream => {
//...
What am I doing? In desktop browser both approaches seem to work fine: I can either ask for a desired aspect ratio
or try to suggest ideal width
and height
. In mobile I can see in debug logs that I asked for vertical stream, like 1080 width X 1920 height, and the browser’s api gives me a regular landscape (horizontal) stream.
How can I fix this behavior? What am I doing wrong?
Test phone is a poco x5 pro. Will try more phones (and emulated android) today =)