AR Defence

SDK Integration Guide

Use this page when the customer has a PWA or SPA and needs the full browser SDK surface, raw events, gateway resolution, and usage patterns for RFID, NFC, QR, and host info.

Back to Docs Open Build Page

SDK Setup

The host bridge is exposed as window.AR after creating it with ARHostSDK.createBridge().

Initialization

<script src="https://cdn.lotix.co/ar-host-sdk/0.1.0/ar-host-sdk.js"></script>
<script>
  window.AR = window.ARHostSDK.createBridge({
    resolveTag: window.ARHostSDK.createGatewayPersonnelResolver({
      gatewayUrl: "https://customer.example.com/personnel/resolve",
    }),
  });
</script>

startRfidScan()

Starts host-controlled RFID scan. The host emits rfid.epc and, if a resolver is configured, rfid.personnel.

async function startBatchScan() {
  statusLabel.textContent = "Starting RFID scan...";
  await window.AR.stopNfcScan();
  await window.AR.startRfidScan();
}

Related screens: RFID scan active, crew filled with members.

stopRfidScan()

Stops RFID scanning. Use this when switching flows or leaving a screen that should not keep scanning in the background.

async function stopBatchScan() {
  await window.AR.stopRfidScan();
  statusLabel.textContent = "RFID scan stopped.";
}

Related screens: crew reporting idle state.

startNfcScan()

Starts NFC scanning in the host app. The host emits nfc.uid and optionally nfc.personnel if resolution is enabled.

async function startPersonalScan() {
  statusLabel.textContent = "Waiting for NFC tag...";
  await window.AR.stopRfidScan();
  await window.AR.startNfcScan();
}

Typical use: personal scan or assigning an NFC tag to a member.

stopNfcScan()

Stops the NFC listener. Use it before changing from personal NFC flow to another flow or when a tag has already been captured.

async function finishPersonalScan() {
  await window.AR.stopNfcScan();
  statusLabel.textContent = "NFC scan completed.";
}

Typical use: after first accepted NFC read in a personal scan flow.

startQrScan()

Requests host-native QR scanning. Used for assigning RFID tags from printed QR labels or provisioning a client by QR payload.

async function scanMemberQr(member) {
  selectedMember = member;
  statusLabel.textContent = "Scan QR tag...";
  await window.AR.startQrScan();
}

Related screens: QR focus scan, tag assignment edit.

getHostInfo()

Requests current host info. The host responds through host.info with environment, version, or runtime capability data.

window.AR.on("host.info", (info) => {
  console.log("Host version:", info.version);
  console.log("Platform:", info.platform);
});

await window.AR.getHostInfo();

Use at app startup or after login if the web app needs host metadata.

on(eventName, handler)

Subscribes to host events. Returns an unsubscribe function.

const offRfid = window.AR.on("rfid.personnel", (person) => {
  addMemberToActiveCrew(person);
});

const offErrors = window.AR.on("ar.error", (error) => {
  showError(error.message);
});

// later
offRfid();
offErrors();

Supported events

Event Payload Use

rfid.epc Raw EPC string Low-level RFID processing in PWA/SPA flows

rfid.personnel "ID - Name" Resolved crew reporting flows

nfc.uid Raw NFC UID string Low-level NFC handling and custom resolution

nfc.personnel "ID - Name" Resolved personal scan flows

ar.error { source, code, message, timestamp } Host bridge, network, or resolution errors

host.info Host-defined object Environment, build, or runtime capability snapshot

Gateway resolver helper

ARHostSDK.createGatewayPersonnelResolver({ gatewayUrl }) creates a resolver that POSTs tag reads to the backend and returns a normalized string in the form ID - Name.

const resolveTag =
  window.ARHostSDK.createGatewayPersonnelResolver({
    gatewayUrl: "https://customer.example.com/personnel/resolve",
  });

window.AR = window.ARHostSDK.createBridge({ resolveTag });

Usage Samples

Crew reporting flow

Start batch scan, append resolved members, stop automatically or manually, then report the crew.

window.AR.on("rfid.personnel", (label) => {
  addMemberToActiveCrew(label);
});

async function handleBatchScan() {
  await window.AR.stopNfcScan();
  await window.AR.startRfidScan();
}

crew-reporting-populated.png

Personal NFC flow

Use a personal scan for a single member and stop the other scan mode before activating NFC.

window.AR.on("nfc.personnel", (label) => {
  setSingleMemberResult(label);
});

async function handlePersonalScan() {
  await window.AR.stopRfidScan();
  await window.AR.startNfcScan();
}

crew-reporting-reported.png

Tag assignment by QR

Request QR scanning from the host app and use the QR result to assign an RFID tag to the selected member.

async function assignRfidFromQr(member) {
  selectedMember = member;
  await window.AR.startQrScan();
}

window.AR.on("qr.value", (value) => {
  assignRfidTagToMember(selectedMember, value);
});

qr-scan-focus.png

SDK Screens

Illustration slots for SDK-driven flows. Replace placeholders with real screenshots when image files are available.

rfid-waiting.png

RFID scan active

Batch scan highlighted while RFID scanning is running.

crew-reporting-populated.png

Resolved crew members

Resolved RFID entries appended to the active crew.

tag-assignment-edit.png

Tag assignment panel

Edit member details and assign RFID / NFC tags through bridge-driven actions.

qr-scan-focus.png

QR focus scan

Host-native QR scanning flow used by SDK consumers for tag assignment.