ionic扫一扫与NFC功能开发要点

2022-01-03

使用ionic2开发原生跨平台原生应用时，扫一扫和NFC是两个很重要的功能。很重要并不代表很难，分别依赖的是@ionic-native/barcode-scanner的BarcodeScanner和@ionic-native/nfc中的nfc, def，以下分别介绍。

【ionic扫一扫与NFC功能开发要点】扫一扫
官方文档中介绍了安装方法：
ionic cordova plugin add phonegap-plugin-barcodescanner
npm install --save @ionic-native/barcode-scanner
然后根据指引，添加插件到app.module.ts即完成添加。
使用时，可参考以下的方法：
ionViewDidLoad() {
this.barcodeScanner.scan().then((barcodeData) => {
this.handleCode(barcodeData.text);
}, (err) => {
this.handleBarcodeError(err);
});
}
分别实现成功处理和出错处理回调即可。
NFC
官方文档中介绍了安装方法：
ionic cordova plugin add phonegap-nfc
npm install --save @ionic-native/nfc
然后根据指引，添加插件到app.module.ts即完成添加。
使用时，主要包括读和写两个部分，这里分别贴两个代码示例：
//读NFC事件监听
this.nfc.addNdefListener()
.subscribe(data => {
if (data && data.tag && data.tag.id) {
let payload = data.tag.ndefMessage[0]["payload"];
let langLength = payload[0] & 63;
//删除语言标记
let tagContent = this.nfc.bytesToString(payload).slice(langLength + 1);
console.log('成功扫描到NFC标签内容：' + tagContent);
//开始处理验证逻辑...
}
});
//写NFC事件监听
this.nfc.addNdefListener()
.subscribe( data => {
let message = this.ndef.textRecord('iamtestucode');
console.log('You are gona write!');
this.nfc.write([message]).then( d => {
//console.log(‘写入成功');
});
});
可以在自己的手机上试试，如果成功的话就可以哈哈哈了。

推荐阅读

上一篇：以爱育人，此生无怨

下一篇：20171102工作总结