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

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

  1. 扫一扫
    官方文档中介绍了安装方法:
    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);
    });
    }
    分别实现成功处理和出错处理回调即可。

  2. 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(‘写入成功');
    });
    });
    可以在自己的手机上试试,如果成功的话就可以哈哈哈了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容