I use this qr code scanner:
I use this code to scan qr code:
function onScanSuccess(decodedText, decodedResult) {
// handle the scanned code as you like, for example:
document.getElementById('text').value = decodedText;
console.log(`Code matched = ${decodedText}`, decodedResult);
}
function onScanFailure(error) {
// handle scan failure, usually better to ignore and keep scanning.
// for example:
console.warn(`Code scan error = ${error}`);
}
let html5QrcodeScanner = new Html5QrcodeScanner(
"reader", { fps: 10, qrbox: 250 }, /* verbose= */ false);
html5QrcodeScanner.render(onScanSuccess, onScanFailure);
It is possible to set default camera to back smartfone camera. I want to run scanner with setted back camera on startup. Thanks, for some help.
I use this qr code scanner: https://github./mebjas/html5-qrcode
I use this code to scan qr code:
function onScanSuccess(decodedText, decodedResult) {
// handle the scanned code as you like, for example:
document.getElementById('text').value = decodedText;
console.log(`Code matched = ${decodedText}`, decodedResult);
}
function onScanFailure(error) {
// handle scan failure, usually better to ignore and keep scanning.
// for example:
console.warn(`Code scan error = ${error}`);
}
let html5QrcodeScanner = new Html5QrcodeScanner(
"reader", { fps: 10, qrbox: 250 }, /* verbose= */ false);
html5QrcodeScanner.render(onScanSuccess, onScanFailure);
It is possible to set default camera to back smartfone camera. I want to run scanner with setted back camera on startup. Thanks, for some help.
Share Improve this question asked Aug 17, 2021 at 6:45 MariuszMariusz 651 gold badge1 silver badge6 bronze badges 4- you'll probably need to use navigator.mediaDevices.enumerateDevices – Bravo Commented Aug 17, 2021 at 6:48
- How to use that ? – Mariusz Commented Aug 17, 2021 at 7:04
- Does this answer your question? Accessing device camera using javascript – Dhana D. Commented Aug 17, 2021 at 7:20
- Did you notice it was a link to documentation, and in that documentation there are examples and other very helpful links to all the information you could ever want to research – Bravo Commented Aug 17, 2021 at 7:35
3 Answers
Reset to default 6I acplish it using this bit of code when I launch the scanner:
facingMode: { exact: "environment"}
Maybe this will help point you in the right direction. Below is the way the setting is used when I launch the scanner:
/** load scanner using back camera **/
html5QrCode.start({ facingMode: { exact: "environment"} }, config, qrCodeSuccessCallback);
const scanner = new Html5QrcodeScanner('reader', {
qrbox: {
width: 200,
height: 200,
},
fps: 5,
videoConstraints: {
facingMode: { exact: "environment" },
},
},
false)
scanner.render(success, error);
There is no config for this. But I did manage to find the id of the select element.
And here's a dirty workaround to remove all "front" cameras and leave the back ones. So that the user will always default to a back facing camera.
//remove front cameras
setInterval(() => {
const selectElement = document.getElementById('html5-qrcode-select-camera');
if (selectElement) {
document.querySelectorAll("#html5-qrcode-select-camera option").forEach(option => {
if (option.textContent.includes("front")) {
option.remove();
}
});
selectElement.selectedIndex = 0;
clearInterval(this);
}
}, 1000);