带有lazarsoft的Qrcode阅读器

时间:2017-03-01 17:36:11

标签: javascript qr-code getusermedia

Ciao我正在使用https://github.com/LazarSoft/jsqrcode,但我无法通过相机解码qrcode。 我想要做的只是解读阅读qrcode

这是我的代码

HTML

 <video autoplay></video>
 <canvas id="qr-canvas"></canvas>

JS

        var video = document.querySelector('video');
        var constraints = 
        {
            audio: false,
            video: 
            {
              facingMode: { exact: "environment" },
              width: { min: 100, ideal: 400, max: 450 },
              height: { min: 100, ideal: 400, max: 450 }
            }
        }

        navigator.mediaDevices.getUserMedia(constraints)
        .then(function(mediaStream) 
        {

          video.srcObject = mediaStream;
          video.onloadedmetadata = function(e) 
          {
            video.play();
          };

        }).catch(function(err) 
        { 
            console.log(err.name + ": " + err.message);
        });

        var qr_canvas = 
        document.getElementById('qr-canvas').getContext('2d');
        qr_canvas.drawImage(video, 0, 0, 400, 400);
        qrcode.decode();


        function readQR(a)
        {
            alert(a);
        }

        qrcode.callback = readQR;

古拉爵

1 个答案:

答案 0 :(得分:1)

Chrome不再支持navigator.mediaDevices.getUserMedia。请使用navigator.mediaDevices.enumerateDevices().then(function(MediaDeviceInfo) { ... })进行开发,您可以在github上引用我的projecthttps://github.com/licaomeng/js-qrcode-scanner