uni-app實現(xiàn)NFC讀取功能

更新時間：2021年09月18日 11:58:37 作者：Rayong有分享

這篇文章主要為大家詳細介紹了uni-app實現(xiàn)NFC讀取功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下

本文實例為大家分享了uni-app實現(xiàn)NFC讀取功能的具體代碼，供大家參考，具體內容如下

好久沒有寫博客了，今天難得有空重新記錄自己學習的點點滴滴。

1、NFC方法.js

// 包路徑
const package_NdefRecord = 'android.nfc.NdefRecord';
const package_NdefMessage = 'android.nfc.NdefMessage';
const package_TECH_DISCOVERED = 'android.nfc.action.TECH_DISCOVERED';
const package_Intent = 'android.content.Intent';
const package_Activity = 'android.app.Activity';
const package_PendingIntent = 'android.app.PendingIntent';
const package_IntentFilter = 'android.content.IntentFilter';
const package_NfcAdapter = 'android.nfc.NfcAdapter';
const package_Ndef = 'android.nfc.tech.Ndef';
const package_NdefFormatable = 'android.nfc.tech.NdefFormatable';
const package_Parcelable = 'android.os.Parcelable';
const package_String = 'java.lang.String';

let NfcAdapter;
let NdefRecord;
let NdefMessage;
let readyRead = true; //開啟讀
let noNFC = false;
let techListsArray = [
 ['android.nfc.tech.IsoDep'],
 ['android.nfc.tech.NfcA'],
 ['android.nfc.tech.NfcB'],
 ['android.nfc.tech.NfcF'],
 ['android.nfc.tech.Nfcf'],
 ['android.nfc.tech.NfcV'],
 ['android.nfc.tech.NdefFormatable'],
 ['android.nfc.tech.MifareClassi'],
 ['android.nfc.tech.MifareUltralight']
];
// 要寫入的數(shù)據
let text = '{id:8888,name:nfc,stie:wangqin.com}';
let readResult = '';

export default {
 listenNFCStatus: function() {
  console.log("---------listenNFCStatus--------------")
  let that = this;
  try {
   let main = plus.android.runtimeMainActivity();
   let Intent = plus.android.importClass('android.content.Intent');
   let Activity = plus.android.importClass('android.app.Activity');
   let PendingIntent = plus.android.importClass('android.app.PendingIntent');
   let IntentFilter = plus.android.importClass('android.content.IntentFilter');
   NfcAdapter = plus.android.importClass('android.nfc.NfcAdapter');
   let nfcAdapter = NfcAdapter.getDefaultAdapter(main);
   if (nfcAdapter == null) {
    uni.showToast({
     title: '設備不支持NFC！',
     icon: 'none'
    })
    noNFC = true;
    return;
   }
   if (!nfcAdapter.isEnabled()) {
    uni.showToast({
     title: '請在系統(tǒng)設置中先啟用NFC功能！',
     icon: 'none'
    });
    noNFC = true;
    return;
   } else {
    noNFC = false;
   }

   let intent = new Intent(main, main.getClass());
   intent.addFlags(Intent.FLAG_ACTIVITY_SINGLE_TOP);
   let pendingIntent = PendingIntent.getActivity(main, 0, intent, 0);
   let ndef = new IntentFilter("android.nfc.action.TECH_DISCOVERED");
   ndef.addDataType("*/*");
   let intentFiltersArray = [ndef];

   //重點部分代碼
   const promise = new Promise((resolve, reject) => {
    plus.globalEvent.addEventListener('newintent', function() {
     // 輪詢調用 NFC
     // setTimeout(that.nfcRuning(resolve), 1000);
     setTimeout(() => {
         that.nfcRuning(resolve)
     }, 1000);
    });
   })
   
   nfcAdapter.enableForegroundDispatch(main, pendingIntent, intentFiltersArray, techListsArray);
   return promise
  } catch (e) {
  }
 },
 nfcRuning: function(resolve) {
  // console.log("--------------nfcRuning---------------")
  NdefRecord = plus.android.importClass("android.nfc.NdefRecord");
  NdefMessage = plus.android.importClass("android.nfc.NdefMessage");
  let main = plus.android.runtimeMainActivity();
  let intent = main.getIntent();
  let that = this;
  if (package_TECH_DISCOVERED == intent.getAction()) {
    if (readyRead) {
     //這里通過read方法拿到NFC數(shù)據
    const id = that.read(intent);
    // readyRead = false;
    //將數(shù)據返回出去
    resolve(id)
   }
  }
 },
 
 read(intent) {
  // toast('請勿移開標簽正在讀取數(shù)據');
  let that = this;
  // NFC id
  let bytesId = intent.getByteArrayExtra(NfcAdapter.EXTRA_ID);
  let nfc_id = that.byteArrayToHexString(bytesId);

  return nfc_id;
 },
 byteArrayToHexString: function(inarray) { // converts byte arrays to string  
  let i, j, inn;
  let hex = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"];
  let out = "";

  for (j = 0; j < inarray.length; ++j) {
   inn = inarray[j] & 0xff;
   i = (inn >>> 4) & 0x0f;
   out += hex[i];
   i = inn & 0x0f;
   out += hex[i];
  }
  return out;
 },

}

function toast(content) {
 uni.showToast({
  title: content,
  icon: 'none'
 })
}

2、在用NFC的頁面調用方法

<view class="flex nfc-ewm">
  <view class="nfc-ewm-item" style="border-right: 1px solid #ccc;" @click="testNFC">
   <image src="@/assets/images/application/icon-nfc.png" alt=""></image>NFC感應
  </view>
  <view class="nfc-ewm-item" @click="openScanCode">
   <image src="@/assets/images/application/icon-ewm.png" alt=""></image>二維碼掃描
  </view>
</view>


import testtest from "../../../../../components/hexiii-nfc/hexiii-nfc.js"

 methods：{
  async testNFC() {
   //這里用異步獲取讀取到的NFC數(shù)據
   const nfcId = await testtest.listenNFCStatus();
   //console.log(nfcId )

   //以下數(shù)據是我的業(yè)務邏輯代碼，如果只要讀取NFC數(shù)據上面那一行代碼即可了。
   const arr = []
   this.list2.forEach(e => {
    arr.push(e.code)
   })
   if(!nfcId) return
   if ( arr.indexOf(nfcId) === -1) {
    uni.showToast({
     icon: 'none',
     title: '未找到對應巡檢點!',
     duration: 2000
    });
   } else {
    uni.showToast({
     icon: 'none',
     title: '識別成功!',
     duration: 2000
    });
    uni.navigateTo({
     url: `/pages/application/XunJianGuanLi/XunJianRenWu/KaiShiXunJian3/index?id=${this.id}&spotCode=${nfcId}&delta=${this.delta+1}`,
    });
   }
  },
}

3、頁面效果圖