您当前的位置:首页 > 网站建设 > javascript
| php | asp | css | H5 | javascript | Mysql | Dreamweaver | Delphi | 网站维护 | 帝国cms | React | 考试系统 | ajax |

uni-app实现NFC读取功能

51自学网 2022-05-02 21:30:56
  javascript

本文实例为大家分享了uni-app实现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']];// 要写入的数据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: '请在系统设置中先启用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数据    const id = that.read(intent);    // readyRead = false;    //将数据返回出去    resolve(id)   }  } },  read(intent) {  // toast('请勿移开标签正在读取数据');  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数据   const nfcId = await testtest.listenNFCStatus();   //console.log(nfcId )   //以下数据是我的业务逻辑代码,如果只要读取NFC数据上面那一行代码即可了。   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、页面效果图

4、总结

以上就是我读取NFC数据的实现了,根据用户扫描NFC读取的数据自动跳转到对应的签到巡检点。代码还有待完善,请多多指导,第一部分中NFC的方法,因为我只需要读取代码,所以很多多余的、不用的代码已被我删除了,只留下了需要的代码。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持wanshiok.com。


带你理解vue中的v-bind
JavaScript中常用的数组操作方法
51自学网,即我要自学网,自学EXCEL、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。
京ICP备13026421号-1