NDEFRecord.data — Eigenschaft · JavaScript-Referenz

Signatur

NDEFRecord.data

Beschreibung

Die schreibgeschützte Eigenschaft data des Interfaces NDEFRecord gibt die Nutzlast eines NFC-Records als DataView zurück. Du erhältst die Records über das reading-Event eines NDEFReader: Dort steckt in event.message.records ein Array von NDEFRecord-Objekten.

Wie die Bytes zu deuten sind, hängt von recordType ab. Bei "text" und "url" dekodierst du die Daten mit einem TextDecoder. Bei "text" gibt dir encoding die Zeichenkodierung vor (z. B. "utf-8"). Bei "mime" bestimmt mediaType das Format, etwa application/json oder image/png. Bei eigenen Typen ("example.com:typ") oder "unknown" liest du die Bytes selbst über die DataView-Methoden wie getUint8() oder getUint16() aus.

Bei den Typen "smart-poster" und "empty" sowie bei externen Typen mit eingebetteter Nachricht ist data nicht immer sinnvoll. Für verschachtelte Records nimmst du stattdessen record.toRecords(). Bei "empty" ist data null.

Rückgabewert

Typ

DataView | null

Beschreibung

Ein DataView über den Rohbytes der Record-Nutzlast. Bei Records ohne Nutzlast (z. B. recordType "empty") ist der Wert null.

Beispiele

Text- und URL-Records lesen

const leseTag = async () => {
  const reader = new NDEFReader();
  await reader.scan(); // muss durch eine Nutzergeste ausgelöst werden

  reader.addEventListener('reading', ({ message, serialNumber }) => {
    console.log(`Tag ${serialNumber} gelesen`);
    for (const record of message.records) {
      if (record.recordType === 'text') {
        const decoder = new TextDecoder(record.encoding);
        console.log(`Text (${record.lang}):`, decoder.decode(record.data));
      } else if (record.recordType === 'url') {
        console.log('URL:', new TextDecoder().decode(record.data));
      }
    }
  });
};

document.querySelector('#scan').addEventListener('click', leseTag);

Tag 04:a2:3b:1c:5e:80:00 gelesen Text (de): Hallo NFC URL: https://programmierung.net

JSON aus einem MIME-Record parsen

const reader = new NDEFReader();

reader.onreading = ({ message }) => {
  for (const record of message.records) {
    if (record.recordType === 'mime' && record.mediaType === 'application/json') {
      const json = JSON.parse(new TextDecoder().decode(record.data));
      console.log('Artikel:', json.artikel, 'Lager:', json.bestand);
    }
  }
};

reader.onreadingerror = () => console.warn('Tag konnte nicht gelesen werden');

document.querySelector('#scan').onclick = () => reader.scan();

Artikel: A-1042 Lager: 17

Binärdaten eines eigenen Record-Typs auswerten

// Beim Schreiben: 2 Byte Sensor-ID + 4 Byte Float-Temperatur
const schreibeSensor = async () => {
  const buffer = new ArrayBuffer(6);
  const view = new DataView(buffer);
  view.setUint16(0, 42);
  view.setFloat32(2, 21.5);
  await new NDEFReader().write({
    records: [{ recordType: 'example.com:sensor', data: buffer }]
  });
};

// Beim Lesen: direkt über die DataView zugreifen
const reader = new NDEFReader();
reader.onreading = ({ message }) => {
  const rec = message.records.find(r => r.recordType === 'example.com:sensor');
  if (!rec || !rec.data) return;
  const id = rec.data.getUint16(0);
  const temp = rec.data.getFloat32(2);
  console.log(`Sensor ${id}: ${temp.toFixed(1)} °C`);
};
document.querySelector('#scan').onclick = () => reader.scan();

Sensor 42: 21.5 °C

// Wichtig · Fallstricke

Kompatibilität: Web NFC ist experimentell und läuft praktisch nur in Chrome für Android (ab 89). Desktop-Browser, Firefox und Safari/iOS kennen es nicht. Prüfe die Unterstützung vorher mit 'NDEFReader' in window.
Sicherer Kontext und Berechtigung: Die API funktioniert nur über HTTPS, nur im Top-Level-Frame und nur bei sichtbarer Seite. scan() und write() brauchen eine Nutzergeste und die Berechtigung "nfc".
DataView statt ArrayBuffer: data kann nur einen Ausschnitt eines größeren Puffers abbilden. Wer record.data.buffer direkt nutzt, muss byteOffset und byteLength berücksichtigen. Sicherer ist new Uint8Array(record.data.buffer, record.data.byteOffset, record.data.byteLength).
Dekodierung: Bei "text" immer record.encoding an den TextDecoder übergeben, da auch utf-16 vorkommen kann. Byte-Reihenfolge: DataView liest standardmäßig Big-Endian.
Sicherheit: NFC-Tags kann jeder beschreiben. Behandle die Nutzlast als nicht vertrauenswürdige Eingabe: URLs prüfen, JSON in try/catch parsen und Inhalte nie ungefiltert per innerHTML einfügen.

Siehe auch

NDEFRecord NDEFRecord.recordType NDEFRecord.encoding NDEFRecord.mediaType NDEFRecord.toRecords() NDEFReader DataView TextDecoder