How To scan QR code in Phonegap

10,605

Have tried this QR code scanning in my cordova app a while back. Hope it should work fine. The code is as follows:

index.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="msapplication-tap-highlight" content="no" />
        <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <title>QR Scanner</title>
    </head>
    <body>        
        <script type="text/javascript" src="cordova.js"></script>   
        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript" src="js/app.js"></script>
        Click scan button to scan the QR code: <input type="button" value="scan" name = "scan" id="scan"/>
    </body>
</html>

app.js

$(document).ready(function() {
    document.addEventListener("deviceready", onDeviceReady, false);
});

function onDeviceReady() {      
     $('#scan').click( function() 
        {
          cordova.plugins.barcodeScanner.scan(
          function (result) {
              alert("We got a barcode\n" +
                    "Result: " + result.text + "\n" +
                    "Format: " + result.format + "\n" +
                    "Cancelled: " + result.cancelled);            
          }, 
          function (error) {
              alert("Scanning failed: " + error);
          });
        }
     );
}

Ensure to add jquery library js file and QR code scanner plugin from phonegap-plugin-barcodescanner link to try out this sample.

10,605

Author by

Anuj Kumar

Updated on August 27, 2022

Comments

Anuj Kumar over 1 year

I am starting phonegap and I learn many plugins in phonegap but I am getting stuck when I want to use QR scanner in phonegap. Give me any solution if there is