revtel / react-native-nfc-manager

React Native NFC module for Android & iOS
MIT License
1.33k stars 317 forks source link

getBackgroundTag not being fired #656

Closed sajadghawami closed 7 months ago

sajadghawami commented 1 year ago

Hey there,

i wrote the following hook:

import React from "react";
import NfcManager, { NfcEvents } from "react-native-nfc-manager";

NfcManager.start();

const useNFCTest = () => {
  const onBackgroundTag = async (tag: any) => {
    console.log("onBackgroundTag", tag);
  };

  React.useEffect(() => {
    const initalizeBackgroundTag = async () => {
      const bgTag = await NfcManager.getBackgroundTag();
      onBackgroundTag(bgTag);

      // listen to other background tags after the app launched
      NfcManager.setEventListener(
        NfcEvents.DiscoverBackgroundTag,
        onBackgroundTag
      );
    };
    initalizeBackgroundTag();
  }, []);
};

export default useNFCTest;

Here is what happens:

Environment:

I also checked react-native-nfc-rewriter how it is implemented (here) but could not find a proper difference.

My questions

Thank you.

phuocnh01 commented 1 year ago

Hi! I faced the same issue and after move NfcManager.start() into initalizeBackgroundTag() everything work as expected. Hope this will work to you

sajadghawami commented 1 year ago

hey!

thank you for your reply. I also tried it like the following, but unfortunately that did not work:

import React from "react";
import NfcManager, { NfcEvents } from "react-native-nfc-manager";

const useNFCTest = () => {
  const onBackgroundTag = async (tag: any) => {
    console.log("onBackgroundTag", tag);
  };

  React.useEffect(() => {
    const initalizeBackgroundTag = async () => {
      // changed
      await NfcManager.start();

      const bgTag = await NfcManager.getBackgroundTag();
      onBackgroundTag(bgTag);

      // listen to other background tags after the app launched
      NfcManager.setEventListener(
        NfcEvents.DiscoverBackgroundTag,
        onBackgroundTag
      );
    };
    initalizeBackgroundTag();
  }, []);
};

export default useNFCTest;
phuocnh01 commented 1 year ago

sorry! I forgot i also downgraded to "react-native-nfc-manager": "3.13.5" Here are my source:


const [isEnable, setIsEnable] = useState(false);
 const [message, setMessage] = useState<any>();

async function initNfc() {
    try {
      const supported = await NfcManager.isSupported();
      if (supported) {
        await NfcManager.start();
      }

      const getEnable = await NfcManager.isEnabled()
      setIsEnable(getEnable)

      const bgTag: TagEvent | null = await NfcManager.getBackgroundTag()
      if (bgTag) {
        const msg = Ndef.text.decodePayload(new Uint8Array(bgTag.ndefMessage[1].payload))
        setMessage(msg)
      }
    } catch (error) { }
  }

  useEffect(() => {
    initNfc()
  }, [])
sajadghawami commented 1 year ago

@phuocnh01

Thank you for clarifying!

Are you using the eventListener somewhere:

      NfcManager.setEventListener(
        NfcEvents.DiscoverBackgroundTag,
        onBackgroundTag
      );

Because reading the nfc and then opening the app does work, but the background listener seems not to work... So iOS is actually showing the toast/popup that a nfc chip has been read, but in my application it will not be logged or triggered

sajadghawami commented 11 months ago

hey @whitedogg13,

sorry for tagging you directly, but i am not able to fix this... not sure if this is a bug or my implementation.

thank you!

wordisthebird commented 10 months ago

@sajadghawami did you make any progress with this?

sajadghawami commented 10 months ago

@wordisthebird

unfortunately not

wordisthebird commented 10 months ago

@wordisthebird

unfortunately not

no worries :) let me know if you do!

github-actions[bot] commented 7 months ago

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] commented 7 months ago

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