使用Phonegap和JavaScript解码二维码

6

我正在使用PhoneGap展示一个打开相机的按钮:

document.addEventListener("deviceready", loaded, false);
function loaded() {
    pictureSource = navigator.camera.PictureSourceType;
    destinationType = navigator.camera.DestinationType;
}

function capturePhoto() {
    navigator.camera.getPicture(getPhoto, onFail, {
        quality : 50
    });
}
function getPhoto(imageData) {
    alert(imageData);
    var smallImage = document.getElementById('cameraPic');
    smallImage.style.display = 'block';
    smallImage.src = "data:image/jpeg;base64," + imageData;
}
function onFail(message) {
    alert('Failed because: ' + message);
}
   <body>
<div id="camera">
    <button class="camera-control" onclick="capturePhoto();">CapturePhoto</button>
    <div style="text-align: center; margin: 20px;">
    <img id="cameraPic" src="" style="width: auto; height: 120px;">     <img>
    </div></div>
  </body>

当点击按钮时,我希望能够解码QR代码并在我的页面上显示解码后的值。我想仅使用JavaScript和PhoneGap来实现这一点,而不想使用任何本地代码。

2个回答

8

1
@DavidW。看起来没问题:https://github.com/phonegap-build/BarcodeScanner - Travis Watson

7
这里有一个 JavaScript 解码 QR 码的库,我曾使用过:https://github.com/LazarSoft/jsqrcode。由于它是纯 JavaScript 实现的,所以在 phonegap 上也可以使用。
这里有一个在线演示:http://webqr.com/。jsqrcode 支持 Data-URIs,因此你可以像这样使用它:
qrcode.decode("data:image/jpeg;base64," + imageData);

在你的代码中:
function getPhoto(imageData) {
        alert(imageData);
        var smallImage = document.getElementById('cameraPic');
        smallImage.style.display = 'block';
        qrcode.callback=function(){alert('Decoded:'+this.result)};
        qrcode.decode("data:image/jpeg;base64," + imageData);
    }

是的,我已经查看了链接,但我想知道当用户使用PhoneGap打开相机时应该何时调用qrcode.decode()方法。 - user2549538
如果getUserMedia在移动iOS/Android上得到支持,我将举行一次派对。 - Jorre

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接