iPadでQRコードリーダーを呼び出したい

Question

前提・実現したいこと

JavaScriptで特定のリンクを踏んだ時にQRコードリーダーを呼び出したいのですが、QRの読み込みが行えません。実験環境で、PCでの読み込みは成功、iPadでもカメラの起動はできたのですが、QRの読み込み処理が行われません。デモサイトでQR読み込み可能なカメラが起動できたのは確認できたので、機種の問題でもないかと思われます。
JavaScript自体の知識が少ないため、どこを触ればいいのかわかりません。
コードを見ていただいて、どこをどのように触れな良いのか教えていただきたいです。
よろしくお願いいたします。

JavaScript

  function qrParse(video){
            const canvas = new OffscreenCanvas(240, 320);
            const render = canvas.getContext("2d");

            return new Promise((res)=>{
                const loop = setInterval(()=>{
                    render.drawImage(video, 0, 0, canvas.width, canvas.height);

                    const img = render.getImageData(0, 0, canvas.width, canvas.height);
                    const result = jsQR(img.data, img.width, img.height);

                    if(result){
                        clearInterval(loop);
                        return res(result.data);
                    }
                }, 100);
            });
        }

        function qrGenerate(data){
            const canvas = new OffscreenCanvas(1, 1);

            return new Promise((res, rej) => QRCode.toCanvas(canvas, data, {}, err => !err ? res(canvas) : rej(err)));
        }

        document.getElementById("data").addEventListener("change", async({target})=>{
            document.getElementById("canvas").getContext("bitmaprenderer").transferFromImageBitmap((await qrGenerate(target.value)).transferToImageBitmap());
        });

        (async()=>{
            const video = document.getElementById("video");
            video.srcObject = await navigator.mediaDevices.getUserMedia({
                audio: false,
                video: {
                    facingMode: "environment"
                }
            });

            document.getElementById("result").value = await qrParse(video);
            document.key.submit();
        })();

HTML

					<form th:action="@{/tablet-visitor/QrResult}" name="key"
						method="POST">
						<div class="mx-auto" style="width: 500px;">
							<video id="video" width="480" height="480" autoplay></video>
						</div>
						<input type="hidden" id="result" name="key_pass" readonly>

						<canvas id="canvas" width="240" height="240"></canvas>
						<input type="hidden" id="data"></input>
					</form>

				</div>