Guide to Using NFC on Your Phone

Have you heard about NFC (Near-Field Communication) but aren’t sure how to use it? With its ability to connect quickly and securely, NFC is becoming increasingly popular in applications such as mobile payments, data sharing, and device unlocking. Check out this guide by Coming to learn how to use NFC on your phone!

Introduction to NFC

What is NFC?

NFC (Near-Field Communication) is a short-range wireless communication technology that enables two electronic devices to interact when placed close to each other, typically within 4 cm.

NFC vs. RFID:

NFC operates on a fixed frequency of 13.56 MHz, while RFID can operate across multiple frequencies (125 KHz, 13.56 MHz, UHF).
NFC is considered a subset of RFID, inheriting many of its advantages.

How does NFC work?

Short range: Works when devices are close together, often touching.
Fast communication: Establishes a connection quickly with minimal configuration.
Secure: Its limited range enhances security.

Applications of NFC

NFC is widely used in daily life for:

Mobile payments: Tap your phone on a scanner to make payments.
Data sharing: Quickly transfer contacts, images, videos, or URLs.
Accessory connection: Pair Bluetooth headphones or smartwatches.
Unlocking devices: Some devices use NFC for unlocking.
E-tickets: Store and validate tickets for public transport or events.

Advantages of Using NFC on Your Phone

Ease of use: Simply tap the devices together.
Speed: Instant connection.
Security: The short range minimizes the risk of data breaches.

Disadvantages of NFC

Limited range: Works only at short distances.
Device compatibility: Not all devices support NFC.

Setting Up and Using NFC on Your Phone

Preparing Your Environment for NFC

Requirements:

Use an NFC tag with a frequency of 13.56 MHz (e.g., NTAG215).
Install the library (React Native):

bashCopy codenpm i --save react-native-nfc-manager  
yarn add react-native-nfc-manager  
cd ios && pod install && cd ..

Configuration for iOS

Enable NFC capabilities:
- Open the project in Xcode.
- Navigate to Targets > Signing & Capabilities > + Capability.
- Search and add Near Field Communication Tag Reading.
Modify info.plist:

xmlCopy code<key>NFCReaderUsageDescription</key>
<string>We need to use NFC</string>

Update on Apple Developer:
- Log in to Apple Developer.
- Navigate to Certificates, Identifiers & Profiles.
- Create an Identifier and select NFC Tag Reading.

Configuration for Android

Add permissions to AndroidManifest.xml:

xmlCopy code<uses-permission android:name="android.permission.NFC" />

Note: NFC cannot be used simultaneously with the camera on Android.

Examples of Using NFC

Activate NFC:

javascriptCopy codeNfcManager.start();

Register NFC scan event (Android):

javascriptCopy codeuseEffect(() => {
  if (Platform.OS === 'android') {
    NfcManager.registerTagEvent()
      .then(() => console.log('Register TAG success!'))
      .catch(e => console.log('Register TAG error', e));

    NfcManager.setEventListener(NfcEvents.StateChanged, async () => {});
    NfcManager.setEventListener(NfcEvents.DiscoverTag, async (tag) => {
      const code = await Ndef.text.decodePayload(tag?.ndefMessage[0]?.payload);
      const dataDecode = JSON.parse(code);
      console.log('Data decoded:', dataDecode);
    });
  }

  return () => {
    NfcManager.setEventListener(NfcEvents.DiscoverTag, null);
    NfcManager.setEventListener(NfcEvents.StateChanged, null);
  };
}, []);

Writing Content to an NFC Tag

Note:
- NFC NTAG215 has about 504 bytes of storage.
- NFC chip location:
  - iPhone: Near the camera.
  - Android: Near the camera or under the screen (varies by model).
Write function:

javascriptCopy codeasync function writeNdef() {
  try {
    await NfcManager.requestTechnology(NfcTech.Ndef);

    const bytes = Ndef.encodeMessage([
      Ndef.textRecord(`{"id":"${Math.floor(Math.random() * 10)}","title":"${inputNfc}"}`)
    ]);

    if (bytes) {
      await NfcManager.ndefHandler.writeNdefMessage(bytes);
      console.log('Write success!');
    }
  } catch (error) {
    console.warn('Error writing NFC:', error);
  } finally {
    NfcManager.cancelTechnologyRequest();
  }
}

Reading Content from an NFC Tag

javascriptCopy codeasync function readNdef() {
  try {
    await NfcManager.requestTechnology(NfcTech.Ndef);
    const tagRead = await NfcManager.getTag();
    if (tagRead) {
      const code = Ndef.text.decodePayload(tagRead?.ndefMessage[0]?.payload);
      const dataRead = JSON.parse(code);
      console.log('Data read:', dataRead);
    }
  } catch (error) {
    console.warn('Error reading NFC:', error);
  } finally {
    NfcManager.cancelTechnologyRequest();
  }
}

Conclusion

We hope this guide helps you successfully utilize NFC on your phone to scan NFC tags. Enjoy leveraging this powerful technology in your projects!