Quagga.js库

Quagga.js

Quagga.js库主要用于扫描条形码，不多说废话，直接进入主题…

我们可以通过npm安装或者CDN的方式来使用Quagga。

本文章使用CDN的方式引入Quagga.js

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>test</title><script src="https://cdn.bootcdn.net/ajax/libs/quagga/0.12.1/quagga.min.js"></script>
</head>
<body><!-- 摄像头展示区域 --><div id="canvanCode"></div><script>//Quagga库Quagga.init({inputStream : {name : "Live",type : "LiveStream",target: document.querySelector('#canvanCode')},decoder : {readers : ["ean_reader",'code_39_reader'],debug: {drawBoundingBox: false,showFrequency: false,drawScanline: false,showPattern: false,},multiple: false}}, ()=>{//打开摄像头Quagga.start();Quagga.onDetected(function(data){console.log(data.codeResult.code);//data.codeResult.code就是摄像头扫描出的商品条形码//Tip:只要摄像头一识别到条形码就会显示在控制台，有时候一识别就显示十几行条形码，所以我们可以使用节流，减少扫码的次数。});});</script>
</body>
</html>

遇到浏览器不显示摄像头的情况下，可以看看浏览器的摄像头是否允许开启。（小编的是谷歌浏览器）

Tip:扫描的条形码最好不要使用比较小，难看清的，最好是白底黑字的条形码，例如烟盒上的条形码。

Quagga.js库相关推荐

Quagga.js条形码识别的调用过程
断断续续花了半个月测试Quagga.js,把测试过程中的一些记录分享到这里来,给有需要的人. Quagga.js这个库有些过人之处,它可以识别倾斜的条码,但是对图片的要求还是比较苛刻,实际运用中图片很 ...
JS+库+框架+工具
JS+库+框架+工具要做WEB前端,就需要知道前端到底是什么,需要学习那些知识:前端至少要懂的三个部分:HTML,CSS,JavaScript(简称JS),那首先先明确这三个概念: HTML负责结构 ...
模糊选择器 js_5个很棒的 React.js 库，值得你亲手试试！
React在过去几年变得越来越受欢迎.随之而来的是越来越多的库的发布,给我们带来了新的可能性,但最重要的是让开发这工作变得越来越简单. 在本文中,介绍 5 个 React 库,希望能给你带来一些帮助. ...
百度js库tangram开源
百度js库tangram宣布开源,Tangram是一套简单可依赖的Javascript库,它的特点: * 体积小巧,性能优良,使用简单. * 模块化架构,方便定制与扩展. * ...
babel import语法 js_搭建开发JS库的运行环境
1.npm 首先在自定义的目录下打开终端执行 npm init : 根据对应的步骤生成相应的package.json 文件 . 2.Eslint (代码检查工具) 安装eslint:npm insta ...
移动开发框架，第【二】弹：Hammer.js 移动设备触摸手势js库
hammer.js是一个多点触摸手势库,能够为网页加入Tap.Double Tap.Swipe.Hold.Pinch.Drag等多点触摸事件,免去自己监听底层touchstart.touchmove. ...
jQuery避免$符和其他JS库冲突的方法对比
jQuery避免$符和其他JS库冲突的方法对比 1.如果jquery库在第三方库之后引用.这个时候jquery库会占用$. 解决办法:剔除$符号的使用权. <script type=" ...
MV* 框架与 DOM操作为主 JS库的案例对比
最近分别使用 Zepto 和 Avalon框架写了个 SPA项目,贴出来讨论下 JS DOM操作为主 JS库与 MV* 框架的对比案例(MV* 框架与 DOM操作 JS库实例对比) 购物车页面 ...
自己写js库，怎么支持AMD
最近我打算把之前做项目写的一些工具集成到一个js库中,但是库既要在普通环境正常运行,又要在AMD环境下不暴露全局变量.一时间挺头疼的.随即我参考了一些现在流行的库的源码.学着写了一下,感觉还不错. 既 ...

Quagga.js库

Quagga.js

Quagga.js库相关推荐

最新文章

热门文章