Ionic 使用 NFC

哎喲喂，因為項目需要使用 Ionic 調用手機 NFC 功能，踩了好多坑，真的是，不過終於不負眾望拿到了id。現在就記錄一下我的步驟和踩過的坑！

步驟

我裝的Ionic可能是最新的，然后用到的調用NFC的插件是phonegap-nfc。
首先就是正常的創建項目，對了，我用的Angular 。

給一下ionic官網是怎么說的，但是我覺得這個官網作用不大，但是還是貼一下吧
https://ionicframework.com/docs/v3/native/nfc/

然后項目創建完成起來了之后去安裝插件。
用下面兩條命令安裝插件：

ionic cordova plugin add phonegap-nfc

npm install @ionic-native/nfc

安裝完成需要在項目里面注入依賴，首先是 app.module.ts 文件里面，引入插件

import {NFC, Ndef} from '@ionic-native/nfc/ngx';

然后在 @NgModule 里面的 providers 里面加入 NFC 和 Ndef，就像這個樣子：

providers: [
        ···
        NFC,
        Ndef,
        ···
    ],

然后在需要調用的頁面里面引入插件，注入一下依賴：

import {NFC, Ndef} from '@ionic-native/nfc/ngx';

在構造函數里面加點東西：

constructor(private nfc: NFC, private ndef: Ndef) {}

最后監聽 NFC 就可以了，可以寫一個方法，都行，開心就好。

	    this.nfc.addTagDiscoveredListener(() => {
            console.log('successfully attached ndef listener');
            alert('啟動監聽nfc');
        }, (err) => {
            alert('監聽nfc失敗' + err);
            console.log('error attaching ndef listener', err);
        }).subscribe((event) => {
            this.tag = event.tag;
            this.id = this.nfc.bytesToHexString(event.tag.id);
        });

這樣子的話，打一個包，直接生成apk文件，找一個有 NFC 的手機就可以測試一下了，NFC的權限不用管，默認都給了，不用額外加權限。

還有 addTagDiscoveredListener 方法是 為匹配任何標簽類型的標簽注冊一個事件偵聽器。
如果需要其他的監聽類型可以修改，下面是官方的文檔，有很多類型根據自己的需要改吧！
https://github.com/chariotsolutions/phonegap-nfc#nfcaddndeflistener

應該沒問題！

踩過的坑

首先我沒在 app.module.ts 文件里面注入依賴

其次我最開是根據 ionic NFC 官網寫的 ，但是官網寫的監聽事件是 addNdefListener ：為任何NDEF標簽注冊一個事件監聽器。，巧就巧在我直接找了張卡去讀，結果顯示監聽是沒問題的，但是卡貼上手機就是不走回調，就看github，然后改了個監聽的方式，換成了 addTagDiscoveredListener：為匹配任何標簽類型的標簽注冊一個事件偵聽器 來監聽，就OK了，所以說根據實際的需求，去github也就是上邊那個鏈接選擇自己合適的監聽事件來監聽NFC的消息。就是這樣。

結束！