前言

最近在公司的一个WebH5项目中，有个生成二维码 和 识别二维码的需求（要脱离微信环境、微信JS-SDK，微信小程序、微信受权，[就是可以在普通的浏览器中运行]），要求可以在PC端、移动端。

关于二维码生成：相信大家做过，直接用的 qrcode.js、vue-qr 等前端库就可以实现比较简单。

关于二维码识别：之前都是在微信环境中开发的，一旦脱离微信环境就用不了，所以现在正好项目有这个需求，经过一翻折腾实现了在PC端，移动端的二维码识别解析功能。

该Demo功能共分为：HTML版 和 Vue版 两个版本，可满足在不同的项目需求场景中使用，Demo原代码已推到GitHub上了，有需要的小伙伴可以看看。

纯前端 HTML / Vue ：二维码：生成、扫描、识别、解析、扫一扫

该Demo功能共分为：HTML版 和 Vue版 两个版本！

不依赖任何关于微信环境、微信JS-SDK，微信小程序、微信受权等！

支持二维码生成，实时动态生成和渲染！

支持扫一扫识别，从相册选择二维码识别！

支持PC端，手机移动端等！

HTML版 Demo实例效果：

Vue.js版 实例效果：

实例效果

Demo：https://demo.muguilin.com/二维码生成与识别

实例代码

GitHub：https://github.com/MuGuiLin/QRCode

---