Web应用中同时只能有一个应用使用扫描仪或摄像头,直接使用TScan调用摄像头。
扫描图像预览:
示例代码
<div class="layui-row layui-col-space5 layui-border"> <div class="layui-col-md4"> <div class="layui-form"> <div class="layui-form-item"> <label class="layui-form-label">二维码识别</label> <div class="layui-input-block"> <input type="checkbox" id="cbo_ewm" lay-skin="switch" lay-text="识别|不识别"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">连续抓拍</label> <div class="layui-input-block"> <input type="checkbox" id="cbo_multi" lay-skin="switch" lay-text="连续|单次"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" id="btnScan">摄像头抓拍</button> </div> </div> </div> </div> <div class="layui-col-md8"> <blockquote class="layui-elem-quote layui-quote-nm"> 抓拍图像预览: </blockquote> <div class="layui-upload-list layui-border" style="padding:5px 0 5px 0;min-height:200px;" id="scanFileList"> </div> <div class="layui-form layui-form-pane"> <div class="layui-form-item layui-form-text"> <label class="layui-form-label">二维码识别结果</label> <div class="layui-input-block"> <textarea id="qrResult" placeholder="二维码识别结果" class="layui-textarea"></textarea> </div> </div></div> </div> </div> <script src="/files/TCTRL.min.js"></script> <script> var $ = layui.jquery; //注册控件 TScan.Register("bffb93e0e3b268b7a37f8122f05f16d11695f302317dd5b7ed2c4ff3a73a709b24f40c2c1592dac9d11418f9d22515d5"); var scanidx = 0; TScan.OnDataIn = function (dat) { if (dat.STAT == 2) { //扫描成功 if (dat.QRCODE != "") $("#qrResult").val($("#qrResult").val() + JSON.stringify(dat.QRCODE) + "\r\n");//alert("二维码识别结果:" + JSON.stringify(dat.QRCODE)); //上传图像 if (dat.CIMG != "") { //添加到列表 dat.GI_IDX 当前图像编号,每次扫描从0开始 0,1,2,3,可以根据编号防止重复保存 $("#scanFileList").append("<img src=\"data:image/jpeg;base64," + dat.CIMG + "\" style=\"width: 90px; height: 90px;\" /> "); //上传图像 //$.post("/demos/FileScan.html", { img: dat.CIMG, id: scanidx }, function (dat2) { // $("#f_" + dat2.id + " img").attr("src", dat2.src); // $("#f_" + dat2.id + " a").attr("href", dat2.src); //}, "json"); } scanidx++; } else if (dat.STAT == 3) { console.log('用户取消操作'); } else if (dat.STAT == -1) { console.log('扫描仪扫描失败'); } } $("#btnScan").click(function () { TScan.Scan({ MODE: 3, //1单张扫描 2连续扫描 3摄像头抓拍 QRCODE: $("#cbo_ewm").is(":checked"), //是否识别图片中的条码或二维码 摄像头抓拍时不返回图像 SSET: false, RESOLUTION: 200, SSI: 0, IsMulti: $("#cbo_multi").is(":checked") //是否连续从摄像头获取图像 }, function (dat) { if (dat.STAT == 11) { } if (dat.STAT == -99) { if (confirm("您还没有安装扫描插件\\n\\n现在下载安装吗?")) { location = "http://d.iyanhong.com/files/TCtrls.exe"; } } if (dat.STAT == 12) { alert("注册失败!"); } }); }); </script>