> For the complete documentation index, see [llms.txt](https://devcenter.unico.io/you/Ol1H6eGO4sQvPYB1Nmyl/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://devcenter.unico.io/you/Ol1H6eGO4sQvPYB1Nmyl/sdk/web/redirect.md).

# Redirect

## Redirecting the user — You Web Integration

This guide explains how to integrate **Unico You** into a web application using the redirect approach, where the user is sent to the You flow and then returned to your application after completion.

***

### How it works

The redirect flow follows three steps:

1. **Your backend** creates a process via the You API and receives a `link`.
2. **Your frontend** redirects the user to that `link`. The user completes the biometric flow inside the You platform.
3. When finished, **You redirects the user back** to the `redirectUrl` you provided.

```
Your App  ──[1. POST /process]──►  You API
          ◄──[link + id]──────────

Your App  ──[2. redirect to link]──►  You Platform (biometric flow)
          ◄──[3. redirect to redirectUrl]──
```

***

### Prerequisites

* A valid API key (`x-unico-accesskey`). Store it in your secrets manager — never expose it to the browser.
* A registered HTTPS callback URL. Contact Unico to allowlist your domain before going to production.

***

### Step 1: Create a process (backend)

From your backend, call `POST /api/public/v1/process` to create the process and get the redirect link.

| Environment | Base URL                        |
| ----------- | ------------------------------- |
| UAT         | `https://api.you.uat.unico.app` |
| Production  | `https://api.you.unico.app`     |

**Request:**

```http
POST /api/public/v1/process
x-unico-accesskey: <your_api_key>
Content-Type: application/json

{
  "scopes": ["SCOPE_HUMAN_TOKEN"],
  "redirectUrl": "https://yourapp.com/callback"
}
```

**Response:**

```json
{
  "id": "a1b2c3d4-0000-0000-0000-abcdef012345",
  "token": "eyJhbGciOiJSUzI1NiJ9...",
  "link": "https://you.unico.io/..."
}
```

| Field   | Description                                                                  |
| ------- | ---------------------------------------------------------------------------- |
| `id`    | Process identifier. **Persist this** — you will need it to retrieve results. |
| `token` | Used to initialize the Web SDK (not needed for the redirect approach).       |
| `link`  | The URL to redirect the user to.                                             |

> **Important:** Never call this endpoint from the browser. The API key must only be used server-side.

***

### Step 2: Redirect the user

Pass the `link` from the API response to your frontend and send the user there. There are two ways to do this.

#### Option A: Full-page redirect

The simplest approach. The user leaves your page, completes the biometric flow, and is sent back to your `redirectUrl`.

```js
// Receive the link from your backend and redirect
window.location.href = processLink;
```

Recommended when you want a straightforward, mobile-friendly experience.

#### Option B: New tab (`window.open`)

Opens the You flow in a separate browser tab. Once the user completes the flow, the tab is redirected to your `redirectUrl`. Your main page can poll or listen for that signal and close the tab.

```js
const youTab = window.open(processLink, '_blank');

// Poll until the tab navigates to your callback URL
const poll = setInterval(() => {
  try {
    if (youTab.closed) {
      clearInterval(poll);
      // tab was closed by the user before completing
      return;
    }

    if (youTab.location.href.startsWith('https://yourapp.com/callback')) {
      clearInterval(poll);
      youTab.close();
      // proceed to retrieve results
    }
  } catch {
    // cross-origin frames throw until the tab is back on your domain — ignore
  }
}, 500);
```

> See the [MDN documentation on `window.open`](https://developer.mozilla.org/en-US/docs/Web/API/Window/open) for browser compatibility and popup-blocker considerations. Call `window.open` inside a user gesture (e.g. a button click) to avoid being blocked.

***

### Step 3: Handle the callback

When the flow is complete (or the user cancels/times out), You redirects to your `redirectUrl`:

```
https://yourapp.com/callback
```

> The redirect happens regardless of outcome — completed, expired, or canceled. Always retrieve the process status from the API to know what actually happened.

***

### Step 4: Retrieve the results (backend)

From your backend, call `GET /api/public/v1/process/{id}` using the `id` received in the first step.
