💳NFC

minimum version is v2.10.0

Before reading this page, please make sure you've set up you've enabled NFC.

💳NFC

• Bubble.io Plugin

• JavaScript SDK

NFC Bubble Examples:

1. NFC - https://bubble.io/page?type=page&name=nfc&id=nativelyqa&tab=tabs-1

🧋 Bubble.io Plugin

[Element] Natively - NFC

Fields:

• Read Alert Message

• Write Alert Message

• Read Detected Message

• Write Detected Message

• nfcresponse - it's a predefined (by plugin) bubble type that needs to be selected (Natively - NFCResponse type)

Events:

• NFC Read Failed

• NFC Write Failed

• NFC Write Success

• NFC Read Success

• NFC Ready To Use - mean you've received 'NFC Is Available' state (Usable for Android)

States:

• Error

• Result

• NFC Tag ID

• NFC Tag Type

• NFC Is Available - yes/no (For Android, you need to ask the user to enable it in device settings)

Actions:

• Read Data

• Write Data

  • Record Data - text (can be url or just text)To open app with card you can use your bundle id (Like this: com.bundle.id://open?url={url you wanna open}

  • Record ID - text (better to use a shorter ID, for now, it's not usable, so you can hardcode it to some value, but in the future Natively will allow to Write/Read more than 1 data)

How to use?

1. Make sure you've set up NFC for your app
2. (Do not forget to rebuild app)

3. Add Natively - NFC element on the page

4. Fill element fields (Alert messages, etc.)

5. The Banner will set up automatically on the page load

6. Call Read or Write actions

🛠 JavaScript SDK

NativelyNFCService

const readAlertMessage = "readAlertMessage";
const writeAlertMessage = "writeAlertMessage";
const readDetectedMessage = "readDetectedMessage";
const writeDetectedMessage = "writeDetectedMessage";

const nfcService = new NativelyNFCService(
    ,
    writeAlertMessage,
    readDetectedMessage,
    writeDetectedMessage
);


// All available methods (It doesn't mean you need to call them like this):
nfcService.read(read_callback);
nfcService.write(recordId, recordData, write_callback);
nfcService.available(available_callback);
// write response
// {
//  "type_format": "nfcWellKnown",
//  "type": "123",
//  "id": "123",
//  "length": 0,
//  "payload_content": "recordData",
//  "payload_raw": ""
//}

// How to use?
// 1. Call nfcService.available method (you will receive resp.status == true)
// 2. Call nfcService.read (you will receive resp.
// 3. Call nfcService.write (you need to pass ``recordId (can be hardcoded to "123", we don't use it for now. In the future updates it will be used to Read/Write more than 1 data ), `recordData` (string, can be url or just text), to open app with card you can use your bundle id (Like this: com.bundle.id://open?url={url you wanna open} 
// 4. Check response resp.status (if it was SUCCESS or FAILED (with error)
// resp.status (resp.message if status is FAILED)