Using Quagga.js, we are working on barcode recognition in web view. It works fine on the mobile web, but it happens on the APP. The problem is two things below.
- The target div provided by Quagga does not contain the camera, but switches to the full screen. Problem 1 Image
- After barcode recognition, the camera remains in the Blackscreen state, not off. Problem 1 Image
Already unpacked permissions from info.plist.
- Privacy - Camera Usage Description
- Privacy - Photo Library Additions Usage Description
Below is my code.
openItem.addEventListener("click", () => {
document.querySelector(".barcode_Camera").style.bottom = "0px";
/* Barcode Scan Script */
Quagga.init({
inputStream: {
type : "LiveStream",
target: document.querySelector('#camera_Area'), // Or '#yourElement' (optional)
constraints: {
width: {min: 1280},
height: {min: 480},
facingMode: "environment",
aspectRatio: {min: 1, max: 2}
}
},
locator: {
patchSize: "small",
halfSample: true
},
numOfWorkers: 4,
frequency: 10,
decoder: {
readers : [{
format: "code_93_reader",
config: {}
}],
debug: {
drawBoundingBox: false,
showFrequency: false,
drawScanline: false,
showPattern: false
},
multiple: false
},
}, function (err) {
if (err) {
console.log(err);
return
}
console.log("Initialization finished. Ready to start");
Quagga.start();
});
}); /*Close*/
Quagga.onProcessed(function (result) {
let drawingCtx = Quagga.canvas.ctx.overlay,
drawingCanvas = Quagga.canvas.dom.overlay;
if (result) {
if (result.boxes) {
drawingCtx.clearRect(0, 0, parseInt(drawingCanvas.getAttribute("width")),
parseInt(drawingCanvas.getAttribute("height")));
result.boxes.filter(function (box) {
return box !== result.box;
}).forEach(function (box) {
Quagga.ImageDebug.drawPath(box, {x: 0, y: 1}, drawingCtx, {color: "#88d147", lineWidth: 2});
});
}
}
});
Quagga.onDetected(function (data) {
document.querySelector('#barcode').value = data.codeResult.code;
let closeTarget = closeItem.closest(".barcode_Camera");
document.querySelector(".barcode_Camera").style.bottom = "-100%";
Quagga.stop();
});
I would like to ask for your help if there is anything else I need to do in the info.plist or how I can solve the problem.