介绍
naanal-qrcode-reader 是一款基于 JavaScript 的开源 QR 二维码扫描器库，通过调用现代浏览器的 WebRTC 功能，可以读取摄像头中的二维码并进行解析。该库可以被用于多种场景，例如网页应用、移动应用等。
安装
naanal-qrcode-reader 是通过 npm 发布的，可以通过以下命令进行安装：
npm install naanal-qrcode-reader --save
使用
在 HTML 页面引入 naanal-qrcode-reader 以及另一个库 jsqrcode 解码库：
<script src="path/to/naanal-qrcode-reader.js"></script> <script src="path/to/jsqrcode.js"></script>
使用 JavaScript 代码调用 naanal-qrcode-reader：
-- -------------------- ---- -------
----- ----- - --------------------------------
-------------- - -----
----------- - -----
----------------- - -----
------------------------------------- ------ - ----------- -------------- --
---------------------- -
--------------- - -------
----- --------- - --- ------------------------- -------- -------- -
--------------------
---
---首先创建一个 video 元素，然后请求摄像头权限，播放摄像头流并将其赋值给视频元素。最后将视频元素和一个回调函数传递给 naanal-qrcode-reader 的构造函数，回调函数会在每次扫描到二维码时触发。
示例代码
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------- ---- ------ ------------
-------
------
------ ---------- -------- --------------------
------- -----------------------------------------------
------- -----------------------------------
--------
----- ----- - ---------------------------------
------------------------------------- ------ - ----------- -------------- --
---------------------- -
--------------- - -------
----- --------- - --- ------------------------- -------- -------- -
--------------------
---
---
---------
-------
-------指导意义
通过学习该库的使用，我们可以了解到 WebRTC 在读取设备摄像头的应用，同时了解了基于 JavaScript 的二维码扫码功能实现原理。在实际开发中，我们可以使用该库实现二维码支付等功能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600672eb0520b171f02e1ed0