如何使用Cordova生成和扫描二维码

本文概述

  • 要求
  • 读取QR码
如何使用Cordova生成和扫描二维码

文章图片
QR码是当今使用的最受欢迎的条形码类型之一, 能够对多达4296个字符进行编码。
如上图所示, 二维码是二维码。典型的QR码应用程序包括产品跟踪, 项目标识, 时间跟踪, 文档管理, 常规营销, URL共享, 包裹跟踪等等。
要求 为了创建QR代码, 我们将使用jQuery.qrcode插件, 该插件可让你通过画布将生成的qrcode添加到DOM。我们之前写过一篇有关如何使用jQuery创建二维码以及如何将其附加到dom的文章, 请在此处阅读全文。如果你不喜欢jQuery, 则可以使用不需要jQuery的qrcode.js库。
jquery.qrcode.js是用于纯浏览器qrcode生成的jquery插件。它使你可以轻松地将qrcode添加到你的网页。它是独立的, minify + gzip后不到4k, 没有图像下载。它不依赖于打开或关闭的外部服务, 也不会增加加载时的延迟。它基于一个以各种语言构建qrcode的库。
我们需要访问相机才能使用手机扫描二维码, 所幸的是, 已经有了一个可以为你完成所有工作的插件。要进行扫描, 我们将依赖phonegap-plugin-barcodescanner, 它使你可以使用相机扫描二维码。使用以下命令在你的项目上安装插件:
cordova plugin add phonegap-plugin-barcodescanner

Phonegap条码扫描器插件(在此处阅读文档)将处理我们的二维码。插件支持以下所有平台:
  • 安卓系统
  • iOS
  • Windows(Windows / Windows Phone 8.1和Windows 10)
  • Windows Phone 8
  • 黑莓10
  • 浏览器
你就可以开始工作了!
读取QR码 请记住, 此插件不仅仅支持qr代码, 还可以使用以下代码来获取有关扫描代码的信息:
cordova.plugins.barcodeScanner.scan( function (result) { alert("A barcode has been scanned \n" + "Result: " + result.text + "\n" + "Format: " + result.format + "\n" + "Cancelled: " + result.cancelled); }, function (error) { alert("Scanning failed: " + error); } );

为了使用javascript处理扫描, 我们将使用以下代码:
cordova.plugins.barcodeScanner.scan( function (result) { if(!result.cancelled){                               // In this case we only want to process QR Codes if(result.format == "QR_CODE"){ var value = http://www.srcmini.com/result.text; // This is the retrieved content of the qr code console.log(value); }else{ alert("Sorry, only qr codes this time ; )");                               } }else{                     alert("The user has dismissed the scan");                 } },     function (error) { alert("An error ocurred: " + error); } );

将此代码附加到功能上(单击按钮)后, 条形码扫描仪应启动并显示如下内容:
如何使用Cordova生成和扫描二维码

文章图片
谢谢队长明显…
如何使用Cordova生成和扫描二维码

文章图片
【如何使用Cordova生成和扫描二维码】玩得开心 !

    推荐阅读