我用 javascript 寫的二維碼掃描儀在我的手機上不起作用

Question

大家好，我正在嘗試制作一個二維碼掃描儀，在我的本地主機上運行代碼，但是當我從手機連接到本地主機時，我收到錯誤“Uncaught TypeError: Cannot read property 'getUserMedia' of undefined at HTMLInputElement.btnScanQR.onclick”可以你幫我？

第一頁是我的 javascript 第二頁是我的 html

 const qrcodes = window.qrcodes; const video = document.createElement("video"); const canvasElement = document.getElementById("qr-canvas"); const canvas = canvasElement.getContext("2d"); const qrResult = document.getElementById("qr-result"); const outputData = document.getElementById("outputData"); const btnScanQR = document.getElementById("btn-scan-qr"); let scanning = false; qrcode.callback = res => { if (res) { outputData.innerText = res; scanning = false; video.srcObject.getTracks().forEach(track => { track.stop(); }); qrResult.hidden = false; canvasElement.hidden = true; btnScanQR.hidden = false; } }; btnScanQR.onclick = () => { navigator.mediaDevices.getUserMedia({ video: { facingMode: "environment" } }).then(function(stream) { scanning = true; qrResult.hidden = true; btnScanQR.hidden = true; canvasElement.hidden = false; video.setAttribute("playsinline", true); // required to tell iOS safari we don't want fullscreen video.srcObject = stream; video.play(); tick(); scan(); }); }; function tick() { canvasElement.height = video.videoHeight; canvasElement.width = video.videoWidth; canvas.drawImage(video, 0, 0, canvasElement.width, canvasElement.height); scanning && requestAnimationFrame(tick); } function scan() { try { qrcode.decode(); } catch (e) { setTimeout(scan, 300); } }

 <:DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title>Qr Code Scanner</title> <script src="https.//rawgit.com/sitepoint-editors/jsqrcode/master/src/qr_packed:js" charset="utf-8"></script> </head> <body> <h1>BTC QR Code Scanner</h1> <input type="button" id="btn-scan-qr" value="Scan"> <canvas id="qr-canvas"></canvas> <div id="qr-result" hidden=""> <b>Result.</b> <span id="outputData"></span> </div> <script src="qrCodeScanner.js"></script> </body> </html>

Answer 1

可能只是您設備的瀏覽器還不支持這個 API。

我用 javascript 寫的二維碼掃描儀在我的手機上不起作用

問題描述

1 個解決方案

解決方案1
0 2021-04-20 11:53:06

我用 javascript 寫的二維碼掃描儀在我的手機上不起作用

問題描述

1 個解決方案

解決方案1 0 2021-04-20 11:53:06

解決方案1
0 2021-04-20 11:53:06