> ## Documentation Index
> Fetch the complete documentation index at: https://documentation.idenfy.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Redirect & iFrame

> Redirect users to iDenfy or embed the identity verification flow in your web page via iFrame with customizable query parameter options.

After [creating a verification session](/kyc/generate-token), you need to send your user to the iDenfy verification UI. There are two approaches: **embed an iFrame** directly in your page, or **redirect** your user to an iDenfy-hosted page.

***

## iFrame Integration

Embedding the verification flow in an iFrame keeps users on your site and gives you full control over the experience.

### Base URL

```
https://ui.idenfy.com/
```

### Query Parameters

| Parameter   | Required | Description                                                                                      |
| ----------- | -------- | ------------------------------------------------------------------------------------------------ |
| `authToken` | Yes      | The verification token returned by the [session creation endpoint](/kyc/generate-token).         |
| `lang`      | No       | Forces the UI into a specific language (e.g. `en`, `lt`, `de`). If omitted, the user can choose. |

### Sizing Recommendations

<Tabs>
  <Tab title="Desktop">
    Set the iFrame to a **minimum width of 670px** and a **minimum height of 800px**. This ensures all verification steps display correctly without internal scrolling.
  </Tab>

  <Tab title="Mobile">
    Use **100% width and 100% height** so the iFrame fills the entire viewport. This provides the best experience for camera capture and liveness checks.
  </Tab>
</Tabs>

### Required Attributes

<Warning>
  You **must** add the `allowfullscreen` attribute (or its vendor-prefixed variants) to the iFrame element. This is required for 3D liveness detection to function correctly. Without it, the camera-based liveness check will fail.
</Warning>

```html theme={"system"}
<iframe
  allowfullscreen
  webkitallowfullscreen
  mozallowfullscreen
></iframe>
```

### Listening for Verification Results

When the verification session ends, the iFrame posts a `message` event to the parent window. You **must** listen for this event to know the outcome.

```javascript theme={"system"}
window.addEventListener("message", function (event) {
  // Verify the origin for security
  if (event.origin !== "https://ui.idenfy.com") return;

  const data = JSON.parse(event.data);

  console.log("Status:", data.status);
  console.log("Manual status:", data.manualStatus);
  console.log("Auto suspected:", data.autoSuspected);
  console.log("Manual suspected:", data.manualSuspected);
});
```

#### Message Event Fields

| Field             | Type    | Description                                                           |
| ----------------- | ------- | --------------------------------------------------------------------- |
| `status`          | string  | Automatic review result: `APPROVED`, `FAILED`, or `UNVERIFIED`.       |
| `manualStatus`    | string  | Manual (human) review result: `APPROVED`, `FAILED`, or `WAITING`.     |
| `autoSuspected`   | boolean | `true` if the automatic check flagged the verification as suspicious. |
| `manualSuspected` | boolean | `true` if a human reviewer flagged the verification as suspicious.    |

<Note>
  The `manualStatus` field will be `WAITING` immediately after the session completes. The final manual review result is delivered asynchronously via [webhook](/kyc/webhooks). Do not treat `WAITING` as a final state.
</Note>

<Warning>
  Do **not** set `successUrl`, `errorUrl`, or `unverifiedUrl` when using the iFrame integration. These parameters cause the iFrame to redirect internally, which breaks the embedded flow. Use the `message` event instead to handle outcomes.
</Warning>

### Full HTML Example

```html theme={"system"}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Identity Verification</title>
  <style>
    #idenfy-iframe {
      border: none;
      width: 670px;
      height: 800px;
    }
    @media (max-width: 768px) {
      #idenfy-iframe {
        width: 100%;
        height: 100vh;
      }
    }
  </style>
</head>
<body>
  <iframe
    id="idenfy-iframe"
    allow="fullscreen"
    allowFullScreen
    webkitallowfullscreen
    mozallowfullscreen
    src="https://ui.idenfy.com/?authToken=YOUR_AUTH_TOKEN"
  ></iframe>

  <script>
    window.addEventListener("message", function (event) {
      if (event.origin !== "https://ui.idenfy.com") return;

      var data = JSON.parse(event.data);

      if (data.status === "APPROVED") {
        // Automatic check passed — show success state
      } else if (data.status === "FAILED") {
        // Automatic check failed — show failure state
      } else if (data.status === "UNVERIFIED") {
        // Could not determine automatically — wait for manual review
      }

      // Always check manualStatus via webhook for the final result
    });
  </script>
</body>
</html>
```

***

## Redirect Integration

If you prefer a simpler integration without iFrame embedding, redirect your user to the iDenfy verification page. Your user leaves your site, completes verification, and returns to your redirect URL.

### Redirect URL

```
https://ivs.idenfy.com/api/v2/redirect?authToken={authToken}
```

Replace `{authToken}` with the token from the [session creation endpoint](/kyc/generate-token).

<Tip>
  When using redirect, you can configure `successUrl`, `errorUrl`, and `unverifiedUrl` during session creation. iDenfy will redirect the user back to the appropriate URL after the session ends.
</Tip>

***

## Why There Is No Web SDK

<Info>
  iDenfy intentionally does not provide a JavaScript Web SDK. The iFrame approach is the recommended integration for web applications.
</Info>

**Benefits of the iFrame-only approach:**

* **Always up to date** -- your integration automatically uses the latest UI, liveness detection, and document recognition without any code changes on your side.
* **Lighter integration** -- no package to install, no bundle size impact, no dependency management.
* **Future-proof** -- new features, supported documents, and UX improvements are available immediately.
* **No version management** -- you never need to track SDK releases or handle breaking changes.

***

## Next Steps

<Columns cols={2}>
  <Card title="Set up webhooks" icon="bell" href="/kyc/webhooks">
    Receive real-time verification results on your server.
  </Card>

  <Card title="Mobile SDKs" icon="mobile" href="/sdks/overview">
    Native Android and iOS SDKs for mobile apps.
  </Card>
</Columns>
