Front camera not opening in iOS OS version 16.4

[bharthik]

The camera automatically switches to the rear camera in iOS 16.4

[wuiyang]

This is caused by invalid media track constraints used to get front facing camera.

AFrame: https://github.com/hiukim/mind-ar-js/blob/41e3e264c6861c45512364d724c620412cc67180/src/face-target/aframe.js#L105

ThreeJS: https://github.com/hiukim/mind-ar-js/blob/41e3e264c6861c45512364d724c620412cc67180/src/face-target/three.js#L107

Should use 'user' instead of 'face'

Reference: https://developer.mozilla.org/en-US/docs/Web/API/MediaTrackConstraints/facingMode

[sharimken]

any solution for this? I tried modifying to "user" in "mindar-facec-aframe.prod.js" but still no luck on iPad with 16.4.1.

Edited, my temporary fix: There was a typo mistake in "," which causing a bug of always using "environment" cam instead of "face" or "user" cam in iOS 16.4.1 go to src, edit aframe.js and find below lines: original: navigator.mediaDevices.getUserMedia({audio: false, video: { facingMode: (this.shouldFaceUser? 'face': 'environment'), }}).then((stream) => {

fixed: navigator.mediaDevices.getUserMedia({audio: false, video: { facingMode: (this.shouldFaceUser? 'user': 'environment') }}).then((stream) => {

[hiukim]

really? I don't think that "," has any effect. It's a valid syntax.

You have error running the code with ","?

[sharimken]

really? I don't think that "," has any effect. It's a valid syntax.

You have error running the code with ","?

I don’t see any error, but seems likely only iOS16.4 or later will trigger this bug. My last modification only fixed safari, not Google Chrome.

*The facingMode does trigger this bug on the latest iOS, I remembered that I tried removing facing mode completely, it seems fixing Google Chrome bug too. I will verify it again later tonight.

Updates & Edited: My temporary solution is removing facingMode complete for front camera. Then it will work on iOS 16.4.1 Chrome too.

if(this.shouldFaceUser)
{
  navigator.mediaDevices.getUserMedia({audio: false, video: { }}).then((stream) => {
    this.video.addEventListener( 'loadedmetadata', async () => {
      this.video.setAttribute('width', this.video.videoWidth);
      this.video.setAttribute('height', this.video.videoHeight);
      await this._setupAR();
this._processVideo();
this.ui.hideLoading();
    });
    this.video.srcObject = stream;
  }).catch((err) => {
    console.log("getUserMedia error", err);
    this.el.emit("arError", {error: 'VIDEO_FAIL'});
  });
}
else
{
  navigator.mediaDevices.getUserMedia({audio: false, video: {
    facingMode: 'environment'
  }}).then((stream) => {
    this.video.addEventListener( 'loadedmetadata', async () => {
      this.video.setAttribute('width', this.video.videoWidth);
      this.video.setAttribute('height', this.video.videoHeight);
      await this._setupAR();
this._processVideo();
this.ui.hideLoading();
    });
    this.video.srcObject = stream;
  }).catch((err) => {
    console.log("getUserMedia error", err);
    this.el.emit("arError", {error: 'VIDEO_FAIL'});
  });
}

[sanriomisintaro]

I'm struggling with this problem, but this is my solution,.

in mindar-face-aframe.prod.js file instead of using face or user. I change both, so I don't use face or environment default: 'face': 'environment' solution: 'user': 'user'

[Makio64]

really? I don't think that "," has any effect. It's a valid syntax.

You have error running the code with ","?

the answer confuse me too, @wuiyang means

Change From : facingMode: (this.shouldFaceUser ? 'face' : 'environment'),

To : facingMode: (this.shouldFaceUser ? 'user' : 'environment'),

in mind-ar-js/src/face-target/aframe.js & mind-ar-js/src/face-target/three.js

[hiukim]

fixed in v1.2.2. thx