這是一個用來掃描二維碼的cordova外掛，在做專案的時候想實現類似於微信的掃一掃功能，就想到了cordova的$cordovaBarcodeScanner外掛，用很少量的程式碼就可以實現了，下面來看一下具體的實現步驟：

一、掃描二維碼：

1、首先需要有一個簡單的專案,然後在命令列輸入新增外掛的命令:

cordova plugin add https://github.com/phonegap/phonegap-plugin-barcodescanner.git

<div class="card">
  <div class="item">
    <button class="button button-block button-positive" ng-click="scanStart()">
      <i class="icon ion-qr-scanner"></i>
      Scan Now
    </button>
  </div>
</div>
<div class="card">
  <div class="item item-divider">Scan Results</div>
  <div class="item item-text-wrap">
    {{barcodeData}}
  </div>
</div>
 

$scope.scanStart = function () {

  $cordovaBarcodeScanner
    .scan()
    .then(function (barcodeData) {
      alert(barcodeData);
      $scope.barcodeData = barcodeData;
      // Success! Barcode data is here
    }, function (error) {
      alert('失敗')
      // An error occurred
    });
};
 

4、這樣子就可以執行到手機上來掃描了，但是在實現了掃描的功能之後還有一個問題，如果是類似於微信的掃描的話，還需要生成屬於自己的二維碼，這個我看了下ngCordova的官方文件（http://ngcordova.com/docs/plugins/barcodeScanner/），文件中有這個功能的程式碼，但是現在似乎是不完善，所以用不了！！因此，我就找了一些用js生成二維碼的方法。

二、生成二維碼：

1、需要下載qrcode.js和jquery.js,可以到網上隨便找有很多，這裡提供一下可以下載的地方（https://github.com/davidshimjs/qrcodejs/），下載到本地之後引入到專案中

2、相關HTML的程式碼如下：

<div id="qrcode">
</div>

var qrcode = new QRCode(document.getElementById("qrcode"), {
  width: 96,//設定寬高
  height: 96
});
qrcode.makeCode("http://www.baidu.com");