文章介绍
这里使用了jsQR和zxing两种方式，分别在普通的H5和vue中使用，文章附上完整demo和一些注意事项
注意事项
这里H5也好，vue也好，如果想要部署到服务器上，需要用https协议，否则无法使用。本地启动项目的时候，很多人在vue中无法实现该效果，那是因为需要我们从localhost路径打开，否则也无法使用摄像头
vue 或 H5，使用jsQR
使用jsQR这个JS库
这里附上这个库的地址：https://s3.gendome.net/activity/js/jsQR.js
先把上面这个JS文件下载下来，比如我这里命名为jsQR.js，使用我这样的写法
H5中
vue中
优点：
jsQR是一个完全独立的javascript脚本库，可以用于扫描QR码。
它不限制于任何平添，可以轻松地扫描前端网络摄像头流、用户上传的图像。
如果使用jsQR扫描网络摄像头流，则需要从视频流中提取图像数据。接着可以将其传递给jsQR。
VUE中，使用zxing库
zxing 是一款由用 Typescript 编写的一维/二维条码图像处理库，即条形码与二维码，它是由 Java 版本 ZXing 库移植而来的。
git地址：https://github.com/zxing-js/library
在线案例：ZXing TypeScript | Demo & Examples
首先安装：
npm install @zxing/library -S
vue文件中：
识别到的信息：{{ message }}
收尾
在调用摄像头的时候，当前页面或者组件销毁时，一定要记得关闭摄像头，否则在某些设备上，摄像头会一直保持开启状态，如果后面我发现了更好用，更方便的组件，我也会继续补充到当前文章中