jsQR库 jsQR是一个纯粹的JavaScript二维码阅读库。 该库接收原始图像,并将定位、提取和解析其中找到的任何二维码。 安装使用 在 npm 上可用。可以在 Node.js 程序中使用,也可以与模块捆绑器(如 Webpack 或 Browserify)一起使用。 npm install jsqr --save// ES6 import import jsQR from "jsqr"; // CommonJS require const jsQR = require("jsqr"); jsQR(...);浏览器 或者对于前端使用 jsQR.js可以包含在脚本标记中 关于网络摄像头的说明 jsQR 被设计为一个完全独立的库,用于扫描 QR 码。根据设计,它不包含任何特定于平台的代码。这使其能够轻松扫描前端网络摄像头流、用户上传的图像或用作后端 Node.js 过程的一部分。 如果要使用 jsQR 扫描网络摄像头流,则需要从视频流中提取图像数据。然后可以将其传递给 jsQR。jsQR 演示包含网络摄像头扫描的准系统实现,可用作起点并根据您的需求进行定制。对于更高级的问题,您可以参考getUserMedia文档或相当全面的webRTC示例代码,这两者都是使用网络摄像头流的重要资源。 用法 jsQR 导出一个方法,该方法接受 3 个参数,表示您要解码的图像数据。此外,还可以采用选项对象来进一步配置扫描行为。 const code = jsQR(imageData, width, height, options?); if (code) { console.log("Found QR code", code); }参数imageData- 形式的 RGBA 像素值。 因此,此数组的长度应为 。 此数据与 ImageData 接口的形式相同,并且通常也由节点模块返回以读取图像。Uint8ClampedArray[r0, g0, b0, a0, r1, g1, b1, a1, ...]4 * width * height width- 您要解码的图像的宽度。 height- 您要解码的图像的高度。 options(可选)- 其他选项:inversionAttempts - (attemptBoth (默认值), dontInvert, onlyInvert, invertFirst) 返回值 如果 QR 能够解码,则库将返回具有以下键的对象。 binaryData - Uint8ClampedArray- 二维码的原始字节。 data- 二维码数据的字符串版本。 chunks- 二维码块。 version- 二维码版本。 location- 带有描述二维码关键点的钥匙的对象。每个键都是形式的一个点。 具有以下位置的积分。{x: number, y: number}角落-topRightCorner/topLeftCorner/bottomRightCorner/bottomLeftCorner;查找器模式 -topRightFinderPattern/topLeftFinderPattern/bottomLeftFinderPattern也可能有一个点,假设存在并且可以定位。bottomRightAlignmentPattern 由于库是用 typescript编写的,因此您还可以查看类型定义以了解 API。 实现h5调用摄像头扫码识别二维码 完整代码:jsQR Demo jsQR Demo
Pure JavaScript QR code decoding library. Unable to access video stream (please make sure you have a webcam enabled) No QR code detected. Data: 扫码效果 扫码识别结果识别图片二维码 参考上面代码,只要取到图片base64数据传给jsQR的方法即可。