react-native android 识别读取NFC卡信息

react-native android 识别读取NFC卡信息

最近工作中遇到的新需求：android手机通过识别NFC卡唤醒App并读取NFC卡信息，功能实现后特此记录（本文只记录思路，具体实现可下载Demo查看：NFCDemo链接）。

一、 android原生端代码：

1.在AndroidManifest.xml文件中加入下列代码

添加NFC权限

添加下列代码可通过NFC唤醒App

2.在MainActivity文件中加入添加onNewIntent方法，识别NFC卡后都会触发这个方法，在这个方法里可以获取到NFC信息，并通过sendEvent发送到RN端（NfcReadHelper和sendEvent为自己封装的方法）

@Override
    public void onNewIntent(Intent intent) {
        super.onNewIntent(intent);
        Log.d(TAG, "onNewIntent " + intent);
        switch (flag) {
            //读取卡唯一Id
            case 0:
                readCardId(intent);
                break;
            //读取卡全部数据
            case 1:
                try {
                    readAllData(intent);
                } catch (UnsupportedEncodingException e) {
                    e.printStackTrace();
                }
                break;
            default:
        }
    }


    
    private void readCardId(Intent intent) {
        NfcReadHelper.getInstence(intent)
                .getCardId(new NfcReadHelper.NFCCallback() {
                    @Override
                    public void callBack(Map> data) {

                    }

                    @Override
                    public void callBack(String data) {
                  		// 将获得的信息发送到RN
                        WritableMap event = Arguments.createMap();
                        event.putString("cardId", data);
                        sendEvent("getCardData", event);
                    }

                    @Override
                    public void error() {
                        Log.d(TAG, "onNewIntent " + "读取失败");
                        WritableMap event = Arguments.createMap();
                        event.putString("errMsg", "读取失败");
                        sendEvent("getCardData", event);
                    }
                });
    }

    
    private void readAllData(Intent intent) throws UnsupportedEncodingException {
        NfcReadHelper.getInstence(intent)
                .getAllData(new NfcReadHelper.NFCCallback() {
                    @Override
                    public void callBack(Map> data) {
                        WritableMap event = Arguments.createMap();
                        WritableArray array = Arguments.createArray();
                        String text = "";
                        for (String key : data.keySet()) {
                            WritableArray array2 = Arguments.createArray();
                            List list = data.get(key);
                            for (int i = 0; i < list.size(); i++) {
                                String str = "第" + key + "扇区" + "第" + i + "块内容：n" + list.get(i);
                                text += str + "n";
                                Log.d(TAG, "onNewIntent " + text);

                                array2.pushString(list.get(i).toString());
                            }
                            if (array2.size() != 0) {
                                array.pushArray(array2);
                            }
                        }
						// 将获得的信息发送到RN
                        event.putArray("cardAllData", array);
                        sendEvent("getCardData", event);
                    }

                    @Override
                    public void callBack(String data) {

                    }

                    @Override
                    public void error() {
                        Log.d(TAG, "onNewIntent " + "读取失败");
                        WritableMap event = Arguments.createMap();
                        event.putString("errMsg", "读取失败");
                        sendEvent("getCardData", event);
                    }
                });
    }

二、 react-native端代码：

在RN端接受监听获得NFC卡信息

componentWillMount() {
    //监听事件名为getCardData的事件
    this.listener = DeviceEventEmitter.addListener('getCardData', (cardMsg) => {
      if (!this.isScanned) {
        this.isScanned = true;
        console.log('================cardMsgcardMsg====================');
        console.log(cardMsg);
        console.log('================cardMsgcardMsg====================');

        this.setState({
          msg: JSON.stringify(cardMsg),
        })

        if (cardMsg.errMsg) {
          Toast.show(cardMsg.errMsg, ToastShowTime);
          this.isScanned = false;
          return;
        }
        if (cardMsg.cardId || (cardMsg.cardAllData && cardMsg.cardAllData.length)) {
          setTimeout(() => {
            this.isScanned = false;
          }, 1000)
        }
      }
    });
  }

  componentWillUnmount() {
    this.listener && this.listener.remove();
  }

三、 Demo实现效果：