starti.app
How-to Guides

Scan QR Codes

Scan QR codes and barcodes with the built-in scanner and validate results

Scan QR Codes

Use the SDK's QR scanner to scan QR codes from the device camera, with optional validation logic.

Prerequisites

  • The starti.app SDK is installed and initialized
  • Camera access is available on the device

Basic scan

Open the scanner and get the scanned value:

const result = await startiapp.QrScanner.scan();
console.log("Scanned:", result);

Scan with validation

Pass a validation function that accepts or rejects scanned values. The scanner stays open until a valid code is scanned or the user closes it:

const result = await startiapp.QrScanner.scan({
  validation: (scannedValue) => {
    return scannedValue.startsWith("TICKET-");
  },
});

if (result) {
  console.log("Valid ticket:", result);
}

Async validation

The validation function can be async, for example to verify a code against your server:

const result = await startiapp.QrScanner.scan({
  validation: async (scannedValue) => {
    const res = await fetch(`/api/verify?code=${scannedValue}`);
    return res.ok;
  },
});

Scanner options

OptionTypeDefaultDescription
showCameraPreviewbooleantrueShow the camera feed
cameraFacing"front" | "back""back"Which camera to use
showCameraSwitchButtonbooleantrueShow the camera switch button
validation(value: string) => boolean | Promise<boolean>Validation function
await startiapp.QrScanner.scan({
  cameraFacing: "front",
  showCameraSwitchButton: false,
});

Stop the scanner programmatically

await startiapp.QrScanner.stop();

Listening for scan events

If you need to scan multiple codes in a row — for example, scanning a batch of tickets at an entrance — use the qrCodeScanned event instead of awaiting the result. The scanner stays open after each scan, so the user can continue scanning without leaving the scanner view.

startiapp.QrScanner.addEventListener("qrCodeScanned", async (event) => {
  const scannedValue = event.detail;
  console.log("Scanned:", scannedValue);

  // Give the user feedback — vibrate or play a sound
  await startiapp.App.vibrate(1); // medium intensity
});

startiapp.QrScanner.addEventListener("qrScannerClosed", () => {
  console.log("Scanner was closed");
});

// Open the scanner — it stays open until the user closes it or you call stop()
startiapp.QrScanner.scan();

This pairs well with a vibration or a short audio cue to confirm each successful scan.

Checking camera access

const granted = await startiapp.QrScanner.isCameraAccessGranted();

if (!granted) {
  await startiapp.QrScanner.requestCameraAccess();
}

See also

On this page