---
Source: https://docs.microblink.com/blinkid/scan-camera
Title: Scan in real time via camera
Description: Set up BlinkID for live document scanning using the device camera
---

# Scan in real time via camera

BlinkID includes a built-in scanning UI that manages the camera feed, guides the user with real-time feedback, and returns extracted data via a result callback.
The camera stream starts automatically once scanning is initialized—no additional setup is required.

## Embed the scanning UI

By default, the scanning UI covers the full screen.
On web, pass `targetNode` to render it inside a specific element instead.

<Tabs queryString="platform">

  <TabItem value="web" label="Web (TS)" default>

  ```typescript
  import { createBlinkId } from "@microblink/blinkid";

  const container = document.getElementById("scanner-container");

  const blinkId = await createBlinkId({
    licenseKey: "your-license-key",
    targetNode: container ?? undefined,
  });

  blinkId.addOnResultCallback((result) => {
    console.log("First name:", result.firstName?.latin?.value);
    console.log("Document number:", result.documentNumber?.latin?.value);
    void blinkId.destroy();
  });
  ```

  </TabItem>
  <TabItem value="android" label="Android (Kotlin)">

  ```kotlin
  BlinkIdCameraScanningScreen(
      blinkIdSdk = blinkIdSdk,
      onScanningSuccess = { result ->
          println("First name: ${result.firstName?.value}")
          println("Document number: ${result.documentNumber?.value}")
      },
      onScanningCanceled = { }
  )
  ```

  </TabItem>
  <TabItem value="ios" label="iOS (Swift)">

  ```swift
  let analyzer = try await BlinkIDAnalyzer(sdk: sdk)

  BlinkIDUXView(
      analyzer: analyzer,
      onScanCompleted: { resultState in
          guard let result = resultState.scanningResult else { return }
          print("First name:", result.firstName?.value ?? "")
          print("Document number:", result.documentNumber?.value ?? "")
      }
  )
  ```

  </TabItem>
</Tabs>

## Skip the onboarding guide

By default, BlinkID shows an onboarding guide before scanning begins.
Disable it to start frame capture immediately when the camera is ready.

<Tabs queryString="platform">

  <TabItem value="web" label="Web (TS)" default>

  ```typescript
  import { createBlinkId } from "@microblink/blinkid";

  const blinkId = await createBlinkId({
    licenseKey: "your-license-key",
    feedbackUiOptions: {
      showOnboardingGuide: false,
    },
  });

  blinkId.addOnResultCallback((result) => {
    console.log("Result:", result);
    void blinkId.destroy();
  });
  ```

  </TabItem>
  <TabItem value="android" label="Android (Kotlin)">

  ```kotlin
  BlinkIdCameraScanningScreen(
      blinkIdSdk = blinkIdSdk,
      uiSettings = UiSettings(showOnboardingDialog = false),
      onScanningSuccess = { result ->
          // use result
      },
      onScanningCanceled = { }
  )
  ```

  </TabItem>
  <TabItem value="ios" label="iOS (Swift)">

  ```swift
  let analyzer = try await BlinkIDAnalyzer(sdk: sdk)

  BlinkIDUXView(
      analyzer: analyzer,
      onScanCompleted: { resultState in
          guard let result = resultState.scanningResult else { return }
          print("Result:", result)
      }
  )
  .uxSettings(ScanningUXSettings(showIntroductionAlert: false))
  ```

  </TabItem>
</Tabs>

## Handle errors

Register an error callback to handle failures during scanning.

<Tabs queryString="platform">

  <TabItem value="web" label="Web (TS)" default>

  ```typescript
  import { createBlinkId } from "@microblink/blinkid";

  const blinkId = await createBlinkId({
    licenseKey: "your-license-key",
  });

  blinkId.addOnResultCallback((result) => {
    console.log("Result:", result);
    void blinkId.destroy();
  });

  blinkId.addOnErrorCallback((error) => {
    console.error("Scanning error:", error);
    void blinkId.destroy();
  });
  ```

  </TabItem>
  <TabItem value="android" label="Android (Kotlin)">

  ```kotlin
  // onScanningCanceled is called both when the user cancels and when scanning fails
  BlinkIdCameraScanningScreen(
      blinkIdSdk = blinkIdSdk,
      onScanningSuccess = { result ->
          println("First name: ${result.firstName?.value}")
      },
      onScanningCanceled = {
          println("Scanning canceled or failed")
      }
  )
  ```

  </TabItem>
  <TabItem value="ios" label="iOS (Swift)">

  ```swift
  // scanningResult is nil when scanning ends without a result (canceled or failed)
  BlinkIDUXView(
      analyzer: analyzer,
      onScanCompleted: { resultState in
          guard let result = resultState.scanningResult else {
              print("Scanning canceled or failed")
              return
          }
          print("First name:", result.firstName?.value ?? "")
      }
  )
  ```

  </TabItem>
</Tabs>

## Clean up

On Android and iOS, the scanning UI component owns its own lifecycle and releases camera resources automatically.
On web, call `destroy()` explicitly when scanning is complete or the user cancels.

<Tabs queryString="platform">

  <TabItem value="web" label="Web (TS)" default>

  ```typescript
  blinkId.addOnResultCallback((result) => {
    console.log("Result:", result);
    void blinkId.destroy();
  });
  ```

  </TabItem>
  

<!-- interactive component omitted -->


  

<!-- interactive component omitted -->


</Tabs>

:::tip

To use the front-facing camera for kiosk-style setups where the user holds the document up to the screen, see [How to use the front-facing camera](front-facing-camera.md).

:::

## Related articles

- [How to scan a single-sided document](scan-single-side.md)
- [How to scan a double-sided document](scan-double-side.md)
- [How to scan from a static image](scan-image.md)
- [How to extract specific fields](extract-fields.md)


Last updated on Jul 24, 2026