Secure & Private (Zero Data Retention)
Free Access • No Sign-Up
W3C Web NFCNDEF Binary FramingNTAG213 / 215 / 216
Web NFC & NDEF Tag Protocol Studio
Architect contactless web experiences with Web NFC (NDEFReader, NDEFWriter). Model binary NDEF record framing (MB/ME flags, Type Name Formats, RTD-URI, RTD-Text, MIME), inspect byte streams, audit tag memory budgets, and generate production TypeScript integrations.
1. NFC Hardware Tag & NDEF Record Specification
2. Binary NDEF Framing & Byte Stream Dissector
0xD1 Header & Lengths55 Record Type ('U')04 Payload Bytes
Tag Memory Allocation: 32 / 144 Bytes (22.2%)Within Capacity
3. Production Web NFC Implementation (W3C Standard)
// TypeScript Web NFC Scanner & Writer
async function startNfcSession() {
if (!('NDEFReader' in window)) {
throw new Error('Web NFC is not supported on this browser/platform.');
}
const ndef = new NDEFReader();
await ndef.scan();
ndef.addEventListener('reading', ({ message, serialNumber }) => {
console.log(`NFC Tag Detected! Serial: ${serialNumber}`);
for (const record of message.records) {
console.log(`Record Type: ${record.recordType}`);
console.log(`MIME Type: ${record.mediaType}`);
const textDecoder = new TextDecoder(record.encoding || 'utf-8');
console.log(`Payload: ${textDecoder.decode(record.data)}`);
}
});
ndef.addEventListener('readingerror', () => {
console.error('Cannot read data from the NFC tag. Try tapping again.');
});
}
⚠️ 5 Fatal Traps in Web NFC Implementations
1. The Silent iOS Safari Dead-End
Developers frequently test on Android and ship to production, only to discover that Apple Safari on iOS has never implemented Web NFC and has officially refused to expose CoreNFC to WebKit. Web applications must always implement defensive feature detection (if ('NDEFReader' in window)) with fallback QR codes.
The most ubiquitous NFC stickers sold in bulk are NXP NTAG213 chips with exactly 144 bytes of writable EEPROM. Attempting to write a long URL with UTM tracking parameters or a JSON object will throw an uncaught NotSupportedError DOMException. Always validate payload size before calling ndef.write().
3. Accidentally Burning Permanent Lock Bits
Calling ndef.makeReadOnly() physically modifies the OTP (One-Time Programmable) lock bits inside the tag's EEPROM silicon. This operation is 100% irreversible. Once locked, the tag cannot be re-formatted, cleared, or rewritten under any circumstances.
4. Cross-Origin iframe Permission Policy Denial
If a Web NFC reader component is loaded inside an iframe (e.g. within an embedded ticketing widget or checkout payment frame), the browser will reject ndef.scan() with a SecurityError unless the host frame explicitly specifies allow="nfc" in the iframe HTML element.
5. The Locked-Screen Scanning Freeze
To protect users from malicious NFC pickpocketing, Android shuts down Web NFC tag dispatch whenever the device screen turns off or the browser tab loses focus. Active scanning loops must detect document visibility state changes (visibilitychange) to re-arm scan listeners gracefully.
Frequently Asked Technical Questions
What is Web NFC and which devices and operating systems support it?+
Web NFC is a W3C specification allowing web applications to read and write Near Field Communication (NFC) tags formatted with NDEF (NFC Data Exchange Format). As of 2026, Web NFC is supported in Chromium-based browsers (Google Chrome, Edge, Brave, Opera) on Android devices equipped with NFC hardware. Web NFC is NOT supported on iOS Safari due to Apple restricting CoreNFC APIs from the WebKit browser engine, nor is it supported on desktop platforms without specialized USB NFC readers.
What are the strict browser security prerequisites for Web NFC execution?+
Web NFC enforces strict multi-layered security gates: 1) Secure Context: The page must be served over HTTPS or localhost; 2) Top-Level Browsing Context: Web NFC cannot run inside cross-origin iframes unless granted explicit Permissions Policy (allow="nfc"); 3) User Activation: Starting a scan (ndef.scan()) or write operation requires an explicit user gesture (e.g. tap/click event); 4) Device State: The mobile device screen must be unlocked and awake; scanning automatically pauses when the device is locked or the tab is backgrounded.
What is the binary structure of an NDEF Record header?+
An NDEF Record begins with a 1-byte header containing 6 bitflags: MB (Message Begin, bit 7), ME (Message End, bit 6), CF (Chunk Flag, bit 5), SR (Short Record, bit 4), IL (ID Length Present, bit 3), and TNF (Type Name Format, bits 2-0). If SR=1, the Payload Length is encoded in a single byte (max 255 bytes); if SR=0, it occupies 4 bytes (max 4.29 GB). If IL=1, an ID Length byte precedes the payload. Following the header is Type Length, followed by the Type Name string (e.g. "U", "T", "Sp", or "application/json").
Why can Web NFC read NDEF tags but CANNOT communicate with bank cards or transit passes?+
Web NFC intentionally exposes ONLY high-level NDEF (NFC Forum Data Exchange Format) messaging. It does NOT expose low-level ISO/IEC 14443 Type A/B, ISO 15693, or ISO/IEC 7816-4 APDU (Application Protocol Data Unit) communication channels. Bank cards (EMV), government e-Passports, and transit smartcards (Mifare Classic, Calypso, Felica) use proprietary APDU command sequences and cryptographic challenges that the W3C Web NFC Working Group deliberately excluded to prevent browser-based financial fraud and credential extraction.
What are the user-memory constraints across common NFC tag silicon (NTAG213 vs NTAG215 vs NTAG216)?+
Standard NXP NTAG chips have strict physical EEPROM limits: NTAG213 provides only 144 usable bytes of NDEF memory (accommodates short URLs and simple text); NTAG215 provides 504 usable bytes (standard for Amiibo and digital business cards); NTAG216 provides 888 usable bytes (suitable for small vCards, cryptographic keys, and multi-record smart posters). Exceeding the usable byte capacity causes write operations to throw a DOMException ("NotSupportedError: Tag memory capacity exceeded").