用QRCode.js制作二维码解析器（qrcode.decode方法解析二维码）

由于近期公司要求制作一个移动端的‘长按识别二维码’的功能，但是该功能最本质的就是解析二维码，在网上找了很多，发现效果是有了，就是没有那种可以直接用的，后来在根据网上的资料，自己研究了一下，发现二维码解析部分的功能挺简单的，最主要就是利用了qrcode.js这个插件的qrcode.decode和qrcode.callback，就能对二维码进行解析，同时对解析结果进行返回。

注意：

qrcode.decode方法需要传入解析图片的路劲；

qrcode.callback返回的imgMsg就是解析图片后获取的信息！

1，引入二维码解析的js插件llqrcode.js

下载地址

代码语言：javascript

复制

<script src="llqrcode.js" type="text/javascript" charset="utf-8"></script>

2，解析的图片，这里采取的是上传图片解析（可以采用扫一扫输出的图片解析）

代码语言：javascript

复制

//获取图片路径 let getObjectURL = function(file){ let url = null ; if (window.createObjectURL!=undefined) { // basic url = window.createObjectURL(file) ; } else if (window.URL!=undefined) { // mozilla(firefox) url = window.URL.createObjectURL(file) ; } else if (window.webkitURL!=undefined) { // webkit or chrome url = window.webkitURL.createObjectURL(file) ; } return url ; }

3，获取解析图片

代码语言：javascript

复制

url = getObjectURL(elem.files[0]);

4，通过qrcode.decode()方法去解析改图片的内容

代码语言：javascript

复制

qrcode.decode(url);

5，通过qrcode.callback将解析的结果返回处理

代码语言：javascript

复制

qrcode.callback = function(imgMsg){fn(imgMsg,url); }

注意：此处的imgMsg就是解析的图片结果，在此处不论是（直接重定向window.kk = imgMsg,还是elem.innerHTML = imgMsg。） 效果demo：

https://rattenking.github.io/demo/15/index.html

下载demo：

http://download.csdn.net/download/m0_38082783/9985096

http://www.jq22.com/jquery-info15973

效果图：

本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2017/09/19 ，

如有侵权请联系 cloudcommunity@tencent.com 删除

相关知识

公众号二维码制作
怎么制作表白二维码
花瓶二维码制作教程，花瓶二维码制作生成技巧
文件二维码制作教程
二维码标签在线制作
如何用手机快速制作好看的二维码
二维码美化
如何制作防伪二维码标签？详细步骤及防伪二维码标签的设计技巧
微信支付二维码源码
八木屋二维码生成器

网址: 用QRCode.js制作二维码解析器（qrcode.decode方法解析二维码） https://www.huajiangbk.com/newsview2599932.html