QR阅读器使用javascript

时间:2014-07-12 21:40:17

标签: javascript html webcam qr-code

我想为完全基于JavaScript的QR阅读器或解码器创建一个chrome附加组件。

QR阅读器应使用用户网络摄像头扫描图像,并应在本地系统中进行解码。

我尝试了scriptcam源代码和其他Github代码,但那些并不起作用。如果您了解QR解码器(离线)代码,请分享。 Scriptcam代码如下所示,但它不起作用,我在哪里找到scriptcam.js

代码:

    <!DOCTYPE html>
    <html>
        <head>
            <script language="JavaScript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
            <script language="JavaScript" src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
            <script language="JavaScript" src="scriptcam.js"></script>
            <script> 
                $(document).ready(function() {
                    $("#webcam").scriptcam({
                        onError:onError,
                        cornerRadius:0,
                        onWebcamReady:onWebcamReady
                    });
                });

                function onError(errorId,errorMsg) {
                    alert(errorMsg);
                }           
                function changeCamera() {
                    $.scriptcam.changeCamera($('#cameraNames').val());
                }
                function onWebcamReady(cameraNames,camera,microphoneNames,microphone,volume) {
                    $.each(cameraNames, function(index, text) {
                        $('#cameraNames').append( $('<option></option>').val(index).html(text) )
                    }); 
                    $('#cameraNames').val(camera);
                }
            </script> 
        </head>
        <body>
            <div style="width:330px;float:left;">
                <div id="webcam">
                </div>
                <div style="margin:5px;">
                    <img src="webcamlogo.png" style="vertical-align:text-top"/>
                    <select id="cameraNames" size="1" onChange="changeCamera()" style="width:245px;font-size:10px;height:25px;">
                    </select>
                </div>
            </div>
            <div style="width:135px;float:left;">
                <p><button class="btn btn-small" id="btn1" onclick="$('#decoded').text($.scriptcam.getBarCode());">Decode image</button></p>
            </div>
            <div style="width:200px;float:left;">
                <p id="decoded"></p>
            </div>
        </body>
    </html>

0 个答案:

没有答案