On iOS error: realtimemediasource selectsettings failed constraint 10

[e1sep0]

Hello! WHen i try to open camera on iOS 14.6 in xCODE i get error: RealtimeMediaSource:selectSettings failed constraint 10 And instead camera view i see black screen (

Help please)

Html5Qrcode.getCameras().then(devices => {
                    if (devices && devices.length) {
                        cameraId = $(devices).get(-1).id;
                        $('#qr-camera-modal').modal();
                        startScan();
                    }
                }).catch(err => {
                    $('#qr-error').show();
                });

function startScan() {
                html5QrCode.start(
                    cameraId,     // retreived in the previous step.
                    {
                        fps: 10,    // sets the framerate to 10 frame per second
                        qrbox: '100%'  // sets only 250 X 250 region of viewfinder to
                                    // scannable, rest shaded.
                    },
                    qrCodeMessage => {
                        if (qrCodeMessage.match("^(register|login)")) {
                            location.href = '/' + qrCodeMessage;
                        }else {
                            console.log(`QR Code detected: ${qrCodeMessage}`);
                        }
                    },
                    errorMessage => {
                        // parse error, ideally ignore it. For example:
                        // console.log(`QR Code no longer in front of camera.`);
                    })
                    .catch(err => {
                        console.log(`Unable to start scanning, error: ${err}`);
                    });
            }

[ROBERT-MCDOWELL]

it seems your camera does not support 10 frames/sec try 15 or 20

[e1sep0]

No, didn`t work( One time i was able to get the camera to work, when added controls to video element in js:

return e.style.width=A+"px",e.muted=!0,e.setAttribute("muted","true"),e.setAttribute("playsinline","true"), e.playsInline=!0,e.controls=!0,e}

But camera works only after pressing on play button and in Fullscreen mode. Error RealtimeMediaSource:selectSettings failed constraint 10 keeps appearing in XCode

[e1sep0]

It seems, that element in iOS doesn`t want take attributes playsInline and autoplay

[e1sep0]

No ideas ?

[ROBERT-MCDOWELL]

it's an xcode issue, you better to ask in xcode forums

[e1sep0]

Why XCode? I think? it problem of navigator.getMediaDevices or problem in video element attributes. Camera works only with controls and in FullScreenMode, but i use attributes playsinline, muted, autoplay

[mebjas]

Does it work, if you remove the faulty attributes?

[e1sep0]

Hello) No, it works only after adding attribute controls. Appears play button, after pressing open full screen camera. Only this way (( No inline playing, no autoplaying unfortunately

[bilal-elchami]

Hello, I had the same issue when using this library with cordova on iOS. The solution was to enable the inline video playing in the cordova configuration:

Edit config.xml and add the following preference: <preference name="AllowInlineMediaPlayback" value="true" />

No need to modify the attributes of the video element defined in src/camera/core-impl.ts.

Reference: Is it possible to play multiple inline videos

[clarklight]

@bilal-elchami I am using Cordova Android, when i click request camera permission on the screen, it is stuck on REQESTING CAMERA PERMISSIONS, but no popup or any other indication, do i need to install another permission plugin to request that? Any pointers? Thanks

[bilal-elchami]

@clarklight I remember having this particular issue on Android as well. Make sure that you have the following permissions in your AndroidManifest.xml.

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />

And I think the issue was that the library couldn't prompt the camera permissions requests in an android context. So a little workaround was opening then closing the camera elsewhere in order to trigger the permission (by calling the cordova camera plugin for example) to make sure that the app has the user's permission to use the camera, then launching the scanner.

Let me know if it worked for you and good luck ✌🏼

[clarklight]

@bilal-elchami Just to update you, i got it to work!!!! SWEET!! I used the permission plugin, and triggered the request, then it worked!! Thanks for the help!!

[bilal-elchami]

@clarklight congrats. @mebjas I think we need to mention this problem in a another issue for future reference and probably make a fix for it.

[lonjack]

Hello, I had the same issue when using this library with cordova on iOS. The solution was to enable the inline video playing in the cordova configuration:

Edit config.xml and add the following preference: <preference name="AllowInlineMediaPlayback" value="true" />

No need to modify the attributes of the video element defined in src/camera/core-impl.ts.

Reference: Is it possible to play multiple inline videos

@bilal-elchami Thank you for solving a problem that has been bothering me for a long time