hanzhengyi
/
wxapp2


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <title>Web QrCode Test</title>
    <script type="text/javascript" src="jsqrcode-master/src/jquery.min.js" charset="utf-8"></script>

    <script type="text/javascript" src="jsqrcode-master/src/grid.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/version.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/detector.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/formatinf.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/errorlevel.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/bitmat.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/datablock.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/bmparser.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/datamask.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/rsdecoder.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/gf256poly.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/gf256.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/decoder.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/qrcode.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/findpat.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/alignpat.js" charset="utf-8"></script>
    <script type="text/javascript" src="jsqrcode-master/src/databr.js" charset="utf-8"></script>
</head>
<body>
<div class="booth">
    <video id="video" width="400" height="400"></video>
    <canvas id='canvas' width='400' height='400'></canvas>
</div>

<!--<div id="mmm"></div>-->

<!--<canvas id="qr-canvas" width="400" height="400"></canvas>-->
<script>


    //初始化媒体对象
    var c=0;
    var video = document.getElementById('video'),
        canvas = document.getElementById('canvas'),
        // img = document.getElementById('img'),
        vendorUrl = window.URL || window.webkitURL;

    //媒体对象
    navigator.getMedia = navigator.getUserMedia ||
        navagator.webkitGetUserMedia ||
        navigator.mozGetUserMedia ||
        navigator.msGetUserMedia;
    navigator.getMedia({
        video: { facingMode: { exact: "environment" } }, //使用摄像头对象
        audio: false  //不适用音频
    }, function(strem){
        console.log(strem);
        video.src = vendorUrl.createObjectURL(strem);
        // alert(video.src);
        video.play();
    }, function(error) {
        //error.code
        console.log(error);
    });

    //启动定时器
    setTimeout("actionP(null)","5000");

    //定时器
    function actionP(data){
        // alert(data);
        // alert(1);
        if(data==null){
            Screenshot()

        }else{
            if(data!=null & data!="error decoding QR Code"){//识别出数据
                // if(data.indexOf("http")!=-1){
                //     window.location.href=data;
                // }else
                // document.write("<div style='font-size: 40pt;'>"+data+"</div>");
                    alert(data);
            }else{//没有数据循环十次
                c++;
                if(c<10){
                    setTimeout("actionP(null)","5000");
                }

            }
        }

    }


    function Screenshot(){//截取图像
        // var imgData = getContext('2d').drawImage(video, 0, 0, 400, 400).toDataURL("image/png");
        canvas.getContext('2d').drawImage(video, 0, 0, 400, 400);
        var imgData = canvas.toDataURL("image/png");
        load(imgData);
        // img.src=imgData;

    }
    ////////////////////////////////////////识别二维码////////////////////////////////////////////

    function dragenter(e) {
        e.stopPropagation();
        e.preventDefault();
    }

    function dragover(e) {
        e.stopPropagation();
        e.preventDefault();
    }
    function drop(e) {
        e.stopPropagation();
        e.preventDefault();

        var dt = e.dataTransfer;
        var files = dt.files;


    }


    function load(name)
    {
        // initCanvas(400,400);
        //识别二维码并回调方法
        qrcode.callback = actionP;
        qrcode.decode(name);
    }

    function initCanvas(ww,hh)//创建画板
    {
        gCanvas = document.getElementById("qr-canvas");
        gCanvas.addEventListener("dragenter", dragenter, false);
        gCanvas.addEventListener("dragover", dragover, false);
        gCanvas.addEventListener("drop", drop, false);
        var w = ww;
        var h = hh;
        gCanvas.style.width = w + "px";
        gCanvas.style.height = h + "px";
        gCanvas.width = w;
        gCanvas.height = h;
        gCtx = gCanvas.getContext("2d");
        gCtx.clearRect(0, 0, w, h);
        imageData = gCtx.getImageData( 0,0,400,400);
    }


</script>
</body>
</html>