react-native-nfc-manager 3.11.0 → 3.11.4

package/README.md

@@ -8,7 +8,7 @@ Bring NFC feature to React Native. Inspired by [phonegap-nfc](https://github.com
 
 Contributions are welcome!
 
-> We also have a slack channel, you're welcome to chat with us for any issue or idea! [join us here](https://join.slack.com/t/reactnativenf-ewh2625/shared_invite/zt-puz9y22v-3rkORO6_zQe4FmaWm6ku_w)
+Made with ❤️ by [whitedogg13](https://github.com/whitedogg13) and [revteltech](https://github.com/revtel)
 
 ## Install
 
@@ -32,51 +32,121 @@ For Android, it should be properly auto-linked, so you don't need to do anything
 
 Please see [here](setup.md)
 
-## Also See
+### **Android 12**
 
-### [Demo App] NfcOpenReWriter
+We start to support Android 12 from `v3.11.1`, and you will need to update `compileSdkVersion` to `31`, otherwise the build will fail:
 
-We have a full featured NFC utility app available for download.
+```
+buildscript {
+    ext {
+        ...
+        compileSdkVersion = 31
+        ...
+    }
+    ...
+}
+```
+
+The 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`
+
+> The original issue is [here](https://github.com/revtel/react-native-nfc-manager/issues/469)
+
+BTW, if you don't care about **Android 12** for now, you can use **`v3.11.0`** as a short term solution.
+
+### **[Demo App] NfcOpenReWriter**
+
+We have a full featured NFC utility app using this library available for download.
 
 <a href='https://apps.apple.com/tw/app/nfc-rewriter/id1551243964' target='_blank'>
 <img alt="react-native-nfc-rewriter" src="./images/Apple-App-Store-Icon.png" width="250">
 </a>
-<br/>
 
-It also open sourced in this repo: [React Native NFC ReWriter App](https://github.com/revtel/react-native-nfc-rewriter)
-
-### [Bonus] Reconnect.js
+</br>
 
-Super useful library to help you share states between `sibling` and `nested` React components.
+<a href='https://play.google.com/store/apps/details?id=com.washow.nfcopenrewriter' target='_blank'>
+<img alt="react-native-nfc-rewriter" src="./images/google-play-icon.jpeg" width="250">
+</a>
 
-[Check it out!](https://github.com/revtel/reconnect.js)
+It also open sourced in this repo: [React Native NFC ReWriter App](https://github.com/revtel/react-native-nfc-rewriter)
 
-## Basic Usage
+## Usage 
 
-If all you want to do is to read `NDEF` data, you can use this example:
+The simplest (and most common) use case for this library is to read `NFC` tags containing `NDEF`, which can be achieved via the following codes:
 
 ```javascript
-import NfcManager, {NfcEvents} from 'react-native-nfc-manager';
+import React from 'react';
+import {View, Text, TouchableOpacity, StyleSheet} from 'react-native';
+import NfcManager, {NfcTech} from 'react-native-nfc-manager';
 
 // Pre-step, call this before any NFC operations
-async function initNfc() {
-  await NfcManager.start();
+NfcManager.start();
+
+function App() {
+  async function readNdef() {
+    try {
+      // register for the NFC tag with NDEF in it
+      await NfcManager.requestTechnology(NfcTech.Ndef);
+      // the resolved tag object will contain `ndefMessage` property
+      const tag = await NfcManager.getTag();
+      console.warn('Tag found', tag);
+    } catch (ex) {
+      console.warn('Oops!', ex);
+    } finally {
+      // stop the nfc scanning
+      NfcManager.cancelTechnologyRequest();
+    }
+  }
+
+  return (
+    <View style={styles.wrapper}>
+      <TouchableOpacity onPress={readNdef}>
+        <Text>Scan a Tag</Text>
+      </TouchableOpacity>
+    </View>
+  );
 }
 
-function readNdef() {
+const styles = StyleSheet.create({
+  wrapper: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+});
+
+export default App;
+```
+
+Pleaes notice when running above codes, iOS and Android has different behaviors:
+- iOS will pop up a system scanning UI
+- Android provides **NO** system scanning UI
+
+Regarding the system scannning UI, both platforms should be able to scan your NFC tags succesfully and print out its content.
+
+### Old Style (registerTagEvent) To Scan NFC Tags
+
+There's an alterntaive style to scan NFC tags through `NfcManager.registerTagEvent`, like this:
+
+```javascript
+import NfcManager, {NfcTech} from 'react-native-nfc-manager';
+
+// The following function resolves to a NFC Tag object using old event listener approach. 
+// You can call it like this:
+//    `const nfcTag = await listenToNfcEventOnce()`
+
+function listenToNfcEventOnce() {
   const cleanUp = () => {
     NfcManager.setEventListener(NfcEvents.DiscoverTag, null);
     NfcManager.setEventListener(NfcEvents.SessionClosed, null);
   };
 
-  return new Promise((resolve) => {
+  return new Promise(resolve => {
     let tagFound = null;
 
-    NfcManager.setEventListener(NfcEvents.DiscoverTag, (tag) => {
+    NfcManager.setEventListener(NfcEvents.DiscoverTag, tag => {
       tagFound = tag;
       resolve(tagFound);
-      NfcManager.setAlertMessageIOS('NDEF tag found');
-      NfcManager.unregisterTagEvent().catch(() => 0);
+      NfcManager.unregisterTagEvent();
     });
 
     NfcManager.setEventListener(NfcEvents.SessionClosed, () => {
@@ -91,113 +161,103 @@ function readNdef() {
 }
 ```
 
-Anything else, ex: write NDEF, send custom command, please read next section.
+As you can see, the above approach is more verbose and hard-to-read, so we recommend using `NfcManager.requestTechnology` instead of `NfcManager.registerTagEvent` in your application.
+
+## Advanced Usage Concept
+
+In higher level, there're 4 steps to use this library:
 
-## Advanced Usage
+1. request your particular NFC technologies through `NfcManager.requestTechnology`, for example:
+   - `Ndef`
+   - `NfcA`
+   - `NfcB` (Android-only)
+   - `NfcF` (Android-only)
+   - `NfcV` (Android-only)
+   - `IsoDep`
+   - `MifareClassic` (Android-only)
+   - `MifareUltralight` (Android-only)
+   - `MifareIOS` (ios-only)
+   - `Iso15693IOS` (ios-only)
+   - `FelicaIOS` (ios-only)
 
-In high level, there're 3 steps to perform advanced NFC operations:
+2. select the proper NFC technology handler, which is implemented as getter in main `NfcManager` object, for example:
+   - `ndefHandler` (for `Ndef` tech)
+   - `nfcAHandler` (for `NfcA` tech)
+   - `isoDepHandler` (for `IsoDep` tech)
+   - `iso15693HandlerIOS` (for `Iso15693IOS` tech)
+   - `mifareClassicHandlerAndroid` (for `mifareClassic` tech)
+   - `mifareUltralightHandlerAndroid` (for `mifareUltralight` tech)
+   - ... and so on
 
-1. request your specific NFC technology
-2. select the proper NFC technology handler, which is implemented as getter in main `NfcManager` object, including:
-   - ndefHandler
-   - nfcAHandler
-   - isoDepHandler
-   - iso15693HandlerIOS
-   - mifareClassicHandlerAndroid
-   - mifareUltralightHandlerAndroid
-3. call specific methods on the NFC technology handler
-4. clean up your tech registration
+3. call specific methods on the NFC technology handler (for example `NfcManager.ndefHandler.writeNdefMessage`). To view all available methods for some tech handler, check out the [API List]((index.d.ts))
+
+4. clean up your tech registration through `NfcManager.cancelTechnology`
+
+## Advanced Usage Example: NDEF-Writing
 
 For example, here's an example to write NDEF:
 
 ```javascript
 import NfcManager, {NfcTech, Ndef} from 'react-native-nfc-manager';
 
-// Pre-step, call this before any NFC operations
-async function initNfc() {
-  await NfcManager.start();
-}
-
 async function writeNdef({type, value}) {
   let result = false;
 
   try {
-    // Step 1
-    await NfcManager.requestTechnology(NfcTech.Ndef, {
-      alertMessage: 'Ready to write some NDEF',
-    });
+    // STEP 1
+    await NfcManager.requestTechnology(NfcTech.Ndef);
 
     const bytes = Ndef.encodeMessage([Ndef.textRecord('Hello NFC')]);
 
     if (bytes) {
-      await NfcManager.ndefHandler // Step2
-        .writeNdefMessage(bytes); // Step3
-
-      if (Platform.OS === 'ios') {
-        await NfcManager.setAlertMessageIOS('Successfully write NDEF');
-      }
+      await NfcManager
+        .ndefHandler // STEP 2
+        .writeNdefMessage(bytes); // STEP 3
+      result = true;
     }
-
-    result = true;
   } catch (ex) {
     console.warn(ex);
+  } finally {
+    // STEP 4
+    NfcManager.cancelTechnologyRequest();
   }
 
-  // Step 4
-  NfcManager.cancelTechnologyRequest().catch(() => 0);
   return result;
 }
 ```
 
-## Advanced: Mifare Ultralight usage
+## Advanced Usage Example: Mifare Ultralight
 
-Here's an example to read a Mifare Ultralight tag:
+Here's another example to read a Mifare Ultralight tag:
 
 ```javascript
-import NfcManager, {NfcTech} from 'react-native-nfc-manager';
-
-// Pre-step, call this before any NFC operations
-async function initNfc() {
-  await NfcManager.start();
-}
-
 async function readMifare() {
+  let mifarePages = [];
+
   try {
-      // 0. Request Mifare technology
-      let reqMifare = await NfcManager.requestTechnology(NfcTech.MifareUltralight);
-      if (reqMifare !== 'MifareUltralight') {
-          throw new Error('[NFC Read] [ERR] Mifare technology could not be requested');
-      };
-
-      // 1. Get NFC Tag information
-      const nfcTag = await NfcManager.getTag()
-      console.log('[NFC Read] [INFO] Tag: ', nfcTag);
-
-      // 2. Read pages
-      const readLength = 60;
-      let mifarePages = [];
-      const mifarePagesRead = await Promise.all([...Array(readLength).keys()].map(async (_, i) => {
-          const pageOffset = i * 4; // 4 Pages are read at once, so offset should be in steps with length 4
-          let pages = await NfcManager.mifareUltralightHandlerAndroid.mifareUltralightReadPages(pageOffset);
-          mifarePages.push(pages);
-          console.log(`[NFC Read] [INFO] Mifare Page: ${pageOffset}`, pages);
-          //await wait(500); // If Mifare Chip is to slow
-      }));
-
-      // 3. Success
-      console.log('[NFC Read] [INFO] Success reading Mifare');
-
-      // 4. Cleanup
-      _cleanup();
+    // STEP 1
+    let reqMifare = await NfcManager.requestTechnology(
+      NfcTech.MifareUltralight,
+    );
+
+    const readLength = 60;
+    const mifarePagesRead = await Promise.all(
+      [...Array(readLength).keys()].map(async (_, i) => {
+        const pages = await NfcManager
+          .mifareUltralightHandlerAndroid // STEP 2
+          .mifareUltralightReadPages(i * 4); // STEP 3
+        mifarePages.push(pages);
+      }),
+    );
   } catch (ex) {
-      console.warn('[NFC Read] [ERR] Failed Reading Mifare: ', ex);
-      _cleanup();
+    console.warn(ex);
+  } finally {
+    // STEP 4
+    NfcManager.cancelTechnologyRequest();
   }
-};
 
-function _cleanup() {
-    NfcManager.cancelTechnologyRequest().catch(() => 0);
-};
+  return mifarePages;
+}
 ```
 
 To see more examples, please see [React Native NFC ReWriter App](https://github.com/revtel/react-native-nfc-rewriter)
@@ -252,3 +312,4 @@ The plugin provides props for extra customization. Every time you change the pro
   }
 }
 ```
+

package/android/build.gradle

@@ -14,7 +14,7 @@ buildscript {
 apply plugin: 'com.android.library'
 
 android {
-	compileSdkVersion safeExtGet('compileSdkVersion', 27)
+	compileSdkVersion safeExtGet('compileSdkVersion', 31)
 	defaultConfig {
 		minSdkVersion safeExtGet('minSdkVersion', 16)
     	//noinspection OldTargetApi

package/android/src/main/java/community/revteltech/nfc/NfcManager.java

@@ -987,6 +987,16 @@ class NfcManager extends ReactContextBaseJavaModule implements ActivityEventList
         callback.invoke(null, isForegroundEnabled);
     }
 
+    @ReactMethod
+    public void addListener(String eventName) {
+        // Keep: Required for RN built in Event Emitter Calls.
+    }
+
+    @ReactMethod
+    public void removeListeners(Integer count) {
+        // Keep: Required for RN built in Event Emitter Calls.
+    }
+
     @Override
     public void onHostResume() {
         Log.d(LOG_TAG, "onResume");
@@ -1064,7 +1074,12 @@ class NfcManager extends ReactContextBaseJavaModule implements ActivityEventList
         Activity activity = getCurrentActivity();
         Intent intent = new Intent(activity, activity.getClass());
         intent.addFlags(Intent.FLAG_ACTIVITY_SINGLE_TOP | Intent.FLAG_ACTIVITY_CLEAR_TOP);
-        return PendingIntent.getActivity(activity, 0, intent, 0);
+
+        int flag = 0;
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
+          flag = PendingIntent.FLAG_MUTABLE;
+        }
+        return PendingIntent.getActivity(activity, 0, intent, flag);
     }
 
     private IntentFilter[] getIntentFilters() {

package/index.d.ts

@@ -63,7 +63,7 @@ declare module 'react-native-nfc-manager' {
     maxSize?: number;
     type?: string;
     techTypes?: string[];
-    id?: number[];
+    id?: string;
   }
 
   export interface RegisterTagEventOpts {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-nfc-manager",
-  "version": "3.11.0",
+  "version": "3.11.4",
   "description": "A NFC module for react native.",
   "main": "src/index.js",
   "repository": {

package/CHANGELOG.md

@@ -1,98 +0,0 @@
-## [3.0.2](https://github.com/whitedogg13/react-native-nfc-manager/compare/v3.0.1...v3.0.2) (2021-02-22)
-
-
-### Features
-
-* **android:** allow requestTechnology resolves to tags even when tech ([8b7f862](https://github.com/whitedogg13/react-native-nfc-manager/commit/8b7f8629a8e46304f2a68d62f01e745047fe01dc))
-
-
-
-## [3.0.1](https://github.com/whitedogg13/react-native-nfc-manager/compare/v3.0.0...v3.0.1) (2021-02-20)
-
-
-### Bug Fixes
-
-* [#371](https://github.com/whitedogg13/react-native-nfc-manager/issues/371) missing MIFARE_BLOCK_SIZE for mifareClassicHandlerAndroid ([b136419](https://github.com/whitedogg13/react-native-nfc-manager/commit/b1364197c80ab16542bbb823483a2079a896e169))
-
-
-
-# [3.0.0](https://github.com/whitedogg13/react-native-nfc-manager/compare/v3.0.0-0...v3.0.0) (2021-02-18)
-
-
-### Features
-
-* expose RTD_URI_PROTOCOLS ([26516a7](https://github.com/whitedogg13/react-native-nfc-manager/commit/26516a7ce8309ade21464df13a8e5c799c0e417c))
-
-
-
-# [3.0.0-0](https://github.com/whitedogg13/react-native-nfc-manager/compare/v2.0.0-beta.1...v3.0.0-0) (2021-02-10)
-
-
-### Bug Fixes
-
-* disable 18092 polling (cause iOS freeze) ([64115f8](https://github.com/whitedogg13/react-native-nfc-manager/commit/64115f80f8cd93ed5ef3b01987d6c628a5a9127b))
-* **ios:** add polling for iso18092 ([b7984a5](https://github.com/whitedogg13/react-native-nfc-manager/commit/b7984a59ea27076d7fd34a2614592f468c80f5e1))
-* add callback type null possible ([1371533](https://github.com/whitedogg13/react-native-nfc-manager/commit/13715334ea908b89654b42eba4ec902bcc6f4229))
-* cancelTechnology might cause exception if there's a connected tag ([af2f1f9](https://github.com/whitedogg13/react-native-nfc-manager/commit/af2f1f92bbd7bfcf8c604db48b790289c3ca4946))
-* cancelTechnology might cause exception if there's a connected tag ([dcb26b8](https://github.com/whitedogg13/react-native-nfc-manager/commit/dcb26b85a955ce17ae633e00f6f189a895e8adcb))
-* getNdefMessage should use the same structure for platforms ([73859fb](https://github.com/whitedogg13/react-native-nfc-manager/commit/73859fbac8939277f1e7fc2ad13ececee8c9d4c7))
-* import NfcManager from new location ([c95cc76](https://github.com/whitedogg13/react-native-nfc-manager/commit/c95cc76a0a3b52c751c1a0f00895cf1b34b66b28))
-* ios isSupported ([adcc966](https://github.com/whitedogg13/react-native-nfc-manager/commit/adcc966c8ed4a565c2800fabc5e5a0cad07ea376))
-* promise won't be rejected when calling cancelTechnologyRequest in ([64c9cbd](https://github.com/whitedogg13/react-native-nfc-manager/commit/64c9cbd05e34e975fa4744727859efd08ea610bf))
-* reject tech request promise when native iOS cancel button is pressed ([7915b98](https://github.com/whitedogg13/react-native-nfc-manager/commit/7915b98132cf5c6f86eb96dfe242b67bef32e8a7))
-* remove getNdefMessage's parameter declaration ([6fc257e](https://github.com/whitedogg13/react-native-nfc-manager/commit/6fc257e61e1da5600a7aac44d9a8a97a7ecc988c))
-
-
-### Features
-
-* extract more NfcTech handlers ([0032408](https://github.com/whitedogg13/react-native-nfc-manager/commit/0032408af21cafa3f5f92c16083f914325450524))
-* **android:** getNdefStatus ([4cc68ce](https://github.com/whitedogg13/react-native-nfc-manager/commit/4cc68ce233d81c03760b791fc2f568fe4b8415c4))
-* **ios:** enhance didDetectTags and add queryNDEFStatus / makeReadOnly ([32dd3be](https://github.com/whitedogg13/react-native-nfc-manager/commit/32dd3be2968abbe095ae42fd12793a9a8c0725c6))
-* invalidateSessionWithErrorIOS ([c631110](https://github.com/whitedogg13/react-native-nfc-manager/commit/c631110b6454c08821607014a28b8dffb20fe8b0))
-* ios 13 ndef read and write ([31a3ae6](https://github.com/whitedogg13/react-native-nfc-manager/commit/31a3ae6e141e41f3f36a102d5c2bb5ce04ba78a5))
-* requestTechnology support multi-techs ([65e8f02](https://github.com/whitedogg13/react-native-nfc-manager/commit/65e8f02b83820cb72e65c8443a607b6dca2c8fae))
-
-
-
-# [2.0.0-beta.1](https://github.com/whitedogg13/react-native-nfc-manager/compare/0.0.9...v2.0.0-beta.1) (2019-07-13)
-
-
-### Bug Fixes
-
-* call the correct method `mifareUltralightReadPages` (notice the tailing s) ([60feee8](https://github.com/whitedogg13/react-native-nfc-manager/commit/60feee88c2d20bc18af23b3abb6d8cb22fe17e16))
-* ios crash on registerTagEvent ([e654d93](https://github.com/whitedogg13/react-native-nfc-manager/commit/e654d9359751327284d20b3bee1139c78657dcb4))
-* MifareClassic should also support `transceive` ([dd4a902](https://github.com/whitedogg13/react-native-nfc-manager/commit/dd4a902257a402e5d6d3eae8bd43f9d37c03928b))
-* use non-cached ndef for getNdefMessage API ([49f8541](https://github.com/whitedogg13/react-native-nfc-manager/commit/49f85415a5bc6d0218992dc6ba2b9303cee8e3ac))
-
-
-### Features
-
-* mifareultralight support ([4a53a13](https://github.com/whitedogg13/react-native-nfc-manager/commit/4a53a135c594ef340927ae053dfc142ebfd0b9b6))
-* support `getMaxTransceiveLength` and `setTimeout` ([e759c39](https://github.com/whitedogg13/react-native-nfc-manager/commit/e759c399008e9060ae6f5fe23d7b31a61b1f8037))
-
-
-
-## [0.0.9](https://github.com/whitedogg13/react-native-nfc-manager/compare/0.0.8...0.0.9) (2018-01-02)
-
-
-
-## [0.0.8](https://github.com/whitedogg13/react-native-nfc-manager/compare/0.0.7...0.0.8) (2017-12-09)
-
-
-
-## [0.0.7](https://github.com/whitedogg13/react-native-nfc-manager/compare/0.0.6...0.0.7) (2017-12-04)
-
-
-
-## [0.0.6](https://github.com/whitedogg13/react-native-nfc-manager/compare/0.0.3...0.0.6) (2017-11-17)
-
-
-
-## [0.0.3](https://github.com/whitedogg13/react-native-nfc-manager/compare/0.0.2...0.0.3) (2017-09-27)
-
-
-
-## 0.0.2 (2017-08-01)
-
-
-