{"id":13838925,"url":"https://github.com/revtel/react-native-nfc-manager","last_synced_at":"2025-05-14T08:06:40.819Z","repository":{"id":37005300,"uuid":"94589657","full_name":"revtel/react-native-nfc-manager","owner":"revtel","description":"React Native NFC module for Android \u0026 iOS","archived":false,"fork":false,"pushed_at":"2025-05-09T02:34:40.000Z","size":2736,"stargazers_count":1478,"open_issues_count":8,"forks_count":327,"subscribers_count":31,"default_branch":"main","last_synced_at":"2025-05-13T02:17:46.976Z","etag":null,"topics":["android","ios","nfc","react-native"],"latest_commit_sha":null,"homepage":"","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/revtel.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2017-06-17T00:05:59.000Z","updated_at":"2025-05-11T11:57:36.000Z","dependencies_parsed_at":"2023-11-15T10:24:39.764Z","dependency_job_id":"6a83be4f-9337-4c99-a009-726c0265efac","html_url":"https://github.com/revtel/react-native-nfc-manager","commit_stats":null,"previous_names":["whitedogg13/react-native-nfc-manager"],"tags_count":58,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/revtel%2Freact-native-nfc-manager","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/revtel%2Freact-native-nfc-manager/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/revtel%2Freact-native-nfc-manager/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/revtel%2Freact-native-nfc-manager/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/revtel","download_url":"https://codeload.github.com/revtel/react-native-nfc-manager/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253856667,"owners_count":21974582,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","ios","nfc","react-native"],"created_at":"2024-08-04T16:00:38.552Z","updated_at":"2025-05-14T08:06:35.808Z","avatar_url":"https://github.com/revtel.png","language":"Java","funding_links":[],"categories":["Components","Java","硬件_其他"],"sub_categories":["Device","资源传输下载"],"readme":"# react-native-nfc-manager\n\n[![npm version](https://img.shields.io/npm/v/react-native-nfc-manager.svg?style=flat)](https://www.npmjs.com/package/react-native-nfc-manager)\n[![build](https://api.travis-ci.org/whitedogg13/react-native-nfc-manager.svg?branch=master)](https://travis-ci.org/whitedogg13/react-native-nfc-manager)\n[![issues](https://img.shields.io/github/issues/whitedogg13/react-native-nfc-manager.svg?style=flat)](https://github.com/whitedogg13/react-native-nfc-manager/issues)\n\nBring NFC feature to React Native. Inspired by [phonegap-nfc](https://github.com/chariotsolutions/phonegap-nfc) and [react-native-ble-manager](https://github.com/innoveit/react-native-ble-manager)\n\nContributions are welcome!\n\nMade with ❤️ by [whitedogg13](https://github.com/whitedogg13) and [revteltech](https://github.com/revtel)\n\n\u003e Special thanks to [javix64](https://github.com/javix64) for restructuring the documentation!\n\n## Table of Contents\n\n1. [Installation](#installation)\n2. [Getting Started](#gettingstarted)\n3. [Setup](#setup)\n4. [Documentation](#docs)\n5. [Nfc compatibility](#nfccompatibility)\n6. [Usage Concept](#usageconcept)\n7. [API](#api)\n8. [App demo](#appdemo)\n9. [Learn](#learn)\n\n## Installation\n\n\u003ca name=\"installation\"\u003e\u003c/a\u003e\n\n```shell\nnpm i --save react-native-nfc-manager\n```\n### iOS\n\nThis library use native-modules, so you will need to do `pod install` for iOS:\n\n```shell\ncd ios \u0026\u0026 pod install \u0026\u0026 cd ..\n```\n### Android\n\nIt should be properly auto-linked, so you don't need to do anything.\n\n## Setup\n\n\u003ca name=\"setup\"\u003e\u003c/a\u003e\n\n### iOS\n\n1. In [apple developer site](https://developer.apple.com/), enable capability for NFC\n\n![enable capability](./images/enable-capability.png \"enable capability\")\n\n2. in Xcode, add `NFCReaderUsageDescription` into your `info.plist`, for example:\n\n```\n\u003ckey\u003eNFCReaderUsageDescription\u003c/key\u003e\n\u003cstring\u003eWe need to use NFC\u003c/string\u003e\n```\n\nMore info on Apple's [doc](https://developer.apple.com/documentation/bundleresources/information_property_list/nfcreaderusagedescription?language=objc)\n\nAdditionally, if writing ISO7816 tags add application identifiers (aid) into your `info.plist` as needed like this.\n```\n\u003ckey\u003ecom.apple.developer.nfc.readersession.iso7816.select-identifiers\u003c/key\u003e\n\u003carray\u003e\n  \u003cstring\u003eD2760000850100\u003c/string\u003e\n  \u003cstring\u003eD2760000850101\u003c/string\u003e\n\u003c/array\u003e\n```\n\nMore info on Apple's [doc](https://developer.apple.com/documentation/corenfc/nfciso7816tag)\n\n**Note:** If you are using `NfcTech.FelicaIOS`, you must also add the following code to your `Info.plist` file, otherwise the library will crash:\n\n```xml\n\u003ckey\u003ecom.apple.developer.nfc.readersession.felica.systemcodes\u003c/key\u003e\n\u003carray\u003e\n  \u003cstring\u003e8005\u003c/string\u003e\n  \u003cstring\u003e8008\u003c/string\u003e\n  \u003cstring\u003e0003\u003c/string\u003e\n  \u003cstring\u003efe00\u003c/string\u003e\n  \u003cstring\u003e90b7\u003c/string\u003e\n  \u003cstring\u003e927a\u003c/string\u003e\n  \u003cstring\u003e12FC\u003c/string\u003e\n  \u003cstring\u003e86a7\u003c/string\u003e\n\u003c/array\u003e\n```\n\nAn incomplete list of aid's can be found here. [Application identifier](https://www.eftlab.com/knowledge-base/complete-list-of-application-identifiers-aid)\n\n3. in Xcode's `Signing \u0026 Capabilities` tab, make sure `Near Field Communication Tag Reading` capability had been added, like this:\n\n![xcode-add-capability](./images/xcode-capability.png \"xcode capability\")\n\nIf this is the first time you toggle the capabilities, the Xcode will generate a `\u003cyour-project\u003e.entitlement` file for you:\n\n![xcode-add-entitlement](./images/xcode-entitlement.png \"xcode entitlement\")\n\n4. in Xcode, review the generated entitlement. It should look like this:\n\n![edit entitlement](./images/edit-entitlement.png \"edit entitlement\")\n\nMore info on Apple's [doc](https://developer.apple.com/documentation/bundleresources/entitlements/com_apple_developer_nfc_readersession_formats?language=objc)\n\n### Android\n\nSimple add `uses-permission` into your `AndroidManifest.xml`:\n\n```xml\n \u003cuses-permission android:name=\"android.permission.NFC\" /\u003e\n```\n\n#### **Support Android 12**\n\nWe start to support Android 12 from `v3.11.1`, and you will need to update `compileSdkVersion` to `31`, otherwise the build will fail:\n\n```\nbuildscript {\n    ext {\n        ...\n        compileSdkVersion = 31\n        ...\n    }\n    ...\n}\n```\n\nThe reason for this is because Android puts new limitation on [PendingIntent](https://developer.android.com/reference/android/app/PendingIntent#FLAG_MUTABLE) which says `Starting with Build.VERSION_CODES.S, it will be required to explicitly specify the mutability of PendingIntents`\n\n\u003e The original issue is [here](https://github.com/revtel/react-native-nfc-manager/issues/469)\n\nIf you don't care about **Android 12** for now, you can use **`v3.11.0`** as a short term solution.\n\n\n## Getting Started\n\n\u003ca name=\"gettingstarted\"\u003e\u003c/a\u003e\n\nThe simplest (and most common) use case for this library is to read `NFC` tags containing `NDEF`, which can be achieved via the following codes:\n\n```javascript\nimport React from 'react';\nimport {View, Text, TouchableOpacity, StyleSheet} from 'react-native';\nimport NfcManager, {NfcTech} from 'react-native-nfc-manager';\n\n// Pre-step, call this before any NFC operations\nNfcManager.start();\n\nfunction App() {\n  async function readNdef() {\n    try {\n      // register for the NFC tag with NDEF in it\n      await NfcManager.requestTechnology(NfcTech.Ndef);\n      // the resolved tag object will contain `ndefMessage` property\n      const tag = await NfcManager.getTag();\n      console.warn('Tag found', tag);\n    } catch (ex) {\n      console.warn('Oops!', ex);\n    } finally {\n      // stop the nfc scanning\n      NfcManager.cancelTechnologyRequest();\n    }\n  }\n\n  return (\n    \u003cView style={styles.wrapper}\u003e\n      \u003cTouchableOpacity onPress={readNdef}\u003e\n        \u003cText\u003eScan a Tag\u003c/Text\u003e\n      \u003c/TouchableOpacity\u003e\n    \u003c/View\u003e\n  );\n}\n\nconst styles = StyleSheet.create({\n  wrapper: {\n    flex: 1,\n    justifyContent: 'center',\n    alignItems: 'center',\n  },\n});\n\nexport default App;\n```\n\n\n\n## DOCUMENTATION\n\n\u003ca name=\"docs\"\u003e\u003c/a\u003e\n\nCheck the full documentation that contains `examples`, `faq` and other topics like `Expo` in our [Wiki](https://github.com/revtel/react-native-nfc-manager/wiki)\n\n## Nfc Compatibility\n\n\u003ca name=\"nfccompatibility\"\u003e\u003c/a\u003e\n\n|NFC Technologies   | Android | iOS  |\n|---                |---      |---   |\n| `Ndef`            | ✅      | ✅   |\n| `NfcA`            | ✅      | ✅   |\n| `IsoDep`          | ✅      | ✅   |\n| `NfcB`            | ✅      | ❌   |\n| `NfcF`            | ✅      | ❌   |\n| `NfcV`            | ✅      | ❌   |\n| `MifareClassic`   | ✅      | ❌   |\n| `MifareUltralight`| ✅      | ❌   |\n| `MifareIOS`       | ❌      | ✅   |\n| `Iso15693IOS`     | ❌      | ✅   |\n| `FelicaIOS`       | ❌      | ✅   |\n\n## Usage concept\n\n\u003ca name=\"usageconcept\"\u003e\u003c/a\u003e\n\nIn higher level, there're 4 steps to use this library:\n\n0. (Recommended but not necessary) Before all next steps, use `NfcManager.start()` to start listen a tag.\n\n\n1. Request your particular NFC technologies through `NfcManager.requestTechnology`. Let's request `Ndef` techonogy.\n\n```javascript\nNfcManager.requestTechnology(NfcTech.Ndef);\n```\n\n2. Select the proper NFC technology handler, which is implemented as getter in main `NfcManager` object.\n\n```javascript\nNfcManager.ndefHandler\n```\n\n3. Call specific methods on the NFC technology handler.\n\n```javascript\nNfcManager.ndefHandler.getNdefMessage()\n```\n\n4. Clean up your tech registration through:\n\n```javascript\nNfcManager.cancelTechnologyRequest()\n```\n\n\n## API\n\n\u003ca name=\"api\"\u003e\u003c/a\u003e\n\nThe following table shows the handler for each technology, so if you need to use a technology, go to [index.d.ts](index.d.ts) and search for it.\n\n|NFC Technologies   | Handlers |\n|---                |---      |\n| `Ndef`            | `NdefHandler` |\n| `NfcA`            | `NfcAHandler` |\n| `IsoDep`          | `IsoDepHandler` |\n| `NfcB`            | - |\n| `NfcF`            | - |\n| `NfcV`            | `NfcVHandler` |\n| `MifareClassic`   | `MifareClassicHandlerAndroid` |\n| `MifareUltralight`| `MifareUltralightHandlerAndroid` |\n| `MifareIOS`       | - |\n| `Iso15693IOS`     | `Iso15693HandlerIOS` |\n| `FelicaIOS`       | - |\n\n\n## App Demo - NfcOpenReWriter\n\n\u003ca name=\"appdemo\"\u003e\u003c/a\u003e\n\nWe have a full featured NFC utility app using this library available for download. The source code is here: [**React Native NFC ReWriter App**](https://github.com/revtel/react-native-nfc-rewriter)\n\n\u003ca href='https://apps.apple.com/tw/app/nfc-rewriter/id1551243964' target='_blank'\u003e\n\u003cimg alt=\"react-native-nfc-rewriter\" src=\"./images/Apple-App-Store-Icon.png\" width=\"250\"\u003e\n\u003c/a\u003e\n\n\u003c/br\u003e\n\n\u003ca href='https://play.google.com/store/apps/details?id=com.washow.nfcopenrewriter' target='_blank'\u003e\n\u003cimg alt=\"react-native-nfc-rewriter\" src=\"./images/google-play-icon.jpeg\" width=\"250\"\u003e\n\u003c/a\u003e\n\n## Learn\n\n\u003ca name=\"learn\"\u003e\u003c/a\u003e\n\nWe have published a React Native NFC course with [newline.co](https://www.newline.co/), check it out!\n- Free course (1 hour) about basic NFC setup and concept [here](https://www.youtube.com/watch?v=rAS-DvNUFck)\n- Full course (3 hours) for more (NDEF, Deep Linking, NTAG password protection, signature with UID) [here](https://www.newline.co/courses/newline-guide-to-nfcs-with-react-native)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frevtel%2Freact-native-nfc-manager","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frevtel%2Freact-native-nfc-manager","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frevtel%2Freact-native-nfc-manager/lists"}