Tag is found but getting Possible Promise Rejection (id: 4) Error: "Not even registered"

[gracejansen227]

I am trying to make a testing app that will write to NFC chips and then be able to read that NFC tag (that I have written a hard coded URL to) and open the URL.

On read, I get WARN Tag found {"id": "04A7545A215980", "ndefMessage": [{"id": [Array], "payload": [Array], "tnf": 1, "type": [Array]}], "tech": "mifare"} LOG [TypeError: undefined is not a function] WARN Possible Unhandled Promise Rejection (id: 1): Error: Not even registered Error: Not even registered

It seems to have the URL payload correctly though because I have tested it using an NFC app to the App Store and that app is able to read the tag I wrote using my code.

Here is my App.tsx:

import {View, Text, TouchableOpacity, StyleSheet, Linking} from 'react-native';
import { RootSiblingParent } from 'react-native-root-siblings';
import Toast from 'react-native-root-toast';
import NfcManager, {NfcTech, Ndef, TagEvent} from 'react-native-nfc-manager';
import { writeNdef } from './writeNdef'

// Pre-step, call this before any NFC operations
NfcManager.start();

function App() {

  async function parseUri(tag: TagEvent | null){
    try {
      if (tag){
        return Ndef.uri.decodePayload(tag.ndefMessage[0].payload[0]);
      }

  } catch (e) {
      console.log(e);
  }
  return null;
  }

  async function readNdef() {
    try {
      // register for the NFC tag with NDEF in it
      await NfcManager.requestTechnology(NfcTech.MifareIOS);
      // await NfcManager.registerTagEvent();
      // the resolved tag object will contain `ndefMessage` property
      const tag = await NfcManager.getTag();
      console.warn('Tag found', tag);
      let url = await parseUri(tag);
      if (url){
        Linking.openURL(url).catch((error: any) => console.warn(error))
      }
      let toast = Toast.show(`this is the tag${tag}`, {
        duration: Toast.durations.LONG,
      });
      // await NfcManager.registerTagEvent();
    } catch (ex) {
      console.warn('Oops!', ex);
      Toast.show(`this is the error: ${ex}`, {
        duration: Toast.durations.LONG,
        position: Toast.positions.TOP
      });
      NfcManager.cancelTechnologyRequest();
    } finally {
      // stop the nfc scanning
      NfcManager.cancelTechnologyRequest();
      NfcManager.unregisterTagEvent();
    }
  }

  async function clearTag(){
    await NfcManager.clearBackgroundTag()
  }

  return (
    <RootSiblingParent>
    <View style={styles.wrapper}>
      <TouchableOpacity onPress={readNdef} style={{padding: 10, backgroundColor:"pink", borderRadius: 5, marginBottom: 10}}>
        <Text>Scan a Tag</Text>
      </TouchableOpacity>
      <TouchableOpacity onPress={writeNdef} style={{padding: 10, backgroundColor:"cyan", borderRadius: 5, marginBottom: 10}}>
        <Text>Write NDEF</Text>
      </TouchableOpacity>
      <TouchableOpacity onPress={clearTag} style={{padding: 10, backgroundColor:"yellow", borderRadius: 5}}>
        <Text>Clear Tag</Text>
      </TouchableOpacity>
    </View>
    </RootSiblingParent>
  );
}

const styles = StyleSheet.create({
  wrapper: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: "white"
  },
});

export default App;

And my writeDef.ts is:

import Toast from 'react-native-root-toast';

function buildUrlpayload(value: string){
    return Ndef.encodeMessage([
        Ndef.uriRecord(value)
    ])
}

export async function writeNdef() {
    let result = false;

    try {
      // STEP 1
      let resp = await NfcManager.requestTechnology(NfcTech.Ndef, {
        alertMessage: 'Ready to write some shit bruh'
      });
      let ndef = await NfcManager.ndefHandler.getNdefMessage();

      let bytes = buildUrlpayload('https://www.linkedin.com/in/gracejansen/');

      await NfcManager.ndefHandler.writeNdefMessage(bytes);
    //   await NfcManager.mifareClassicHandlerAndroid.mifareClassicWriteBlock(bytes, ["idk whast this is upposed so be"]);
      await NfcManager.setAlertMessageIOS("I got your tag!")
    //   await NfcManager.ndefHandler // STEP 2
    //         .writeNdefMessage(bytes); // STEP 3
    } catch (ex) {
      NfcManager.cancelTechnologyRequest().catch(() => 0);
    } finally {
      // STEP 4
      NfcManager.cancelTechnologyRequest().catch(() => 0);
    }

    return result;
  }

I am using the lastest version of the package and was trying to follow this tutorial (though it is outdated):https://www.youtube.com/watch?v=Kx22B6OH3Oc&t=453s

[wordisthebird]

any update on this?

[erdenebayrd]

I think NfcManager.unregisterTagEvent(); this line in finally block is not even useful. Just call cancelTechnologyRequest() is enough

[github-actions[bot]]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[github-actions[bot]]

This issue was closed because it has been stalled for 5 days with no activity.