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

# Web Verification with the Authmatech Web SDK

> Run silent, no-OTP mobile verification in the mobile browser end to end with authmatech-sdk-web — a transaction id, the silent check, and a backend verify.

This guide wires up silent verification in a mobile web app, end to end: your backend issues a transaction id, the browser runs the silent check with the [Web SDK](/sdks/web), and your backend completes the verification with the server-side API key — with nothing for the customer to type.

## Architecture

The golden rule: **the API key never leaves your server.** The browser only receives a transaction id and a check URL; your backend resolves the result with the `X-API-KEY`.

```mermaid theme={null}
sequenceDiagram
    participant B as Mobile browser (Web SDK)
    participant YS as Your server
    participant AM as Authmatech API

    B->>YS: Start verification
    YS-->>B: transactionId + checkUrl
    B->>AM: initAuthmatechCheck (silent check over mobile data)
    B->>YS: transactionId, mobileNumber
    YS->>AM: POST /v1/api/verify/{transactionId} (X-API-KEY)
    AM-->>YS: { validNumber: true }
    YS-->>B: Access granted
```

<Note>
  The web flow is **transaction-based** — the browser SDK takes a `transactionId` and `checkUrl`, and your backend resolves the verdict by that same `transactionId`. (The `X-SDK-TOKEN` and `/v1/api/sdk/session` flow belongs to the native [mobile SDKs](/sdks/mobile), not the Web SDK.)
</Note>

## Step 1 — Issue a transaction id from your backend

Your backend creates the `transactionId` for this verification (format `prefix-<UUIDv4>`, where the prefix is provided by Authmatech) and hands it, plus the `checkUrl`, to the page. Keep your API key server-side.

## Step 2 — Run the silent check in the browser

```bash theme={null}
npm install authmatech-sdk-web
```

```js theme={null}
import { initAuthmatechCheck } from 'authmatech-sdk-web';

// transactionId + checkUrl come from your backend
initAuthmatechCheck({
  transactionId, // e.g. 'prefix-550e8400-e29b-41d4-a716-446655440000'
  checkUrl,      // e.g. 'https://web.authmatech.com/verify'
});

// Then tell your backend to resolve the result for this transaction.
await fetch('/api/verify', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ transactionId, mobileNumber }),
});
```

## Step 3 — Verify on your backend

Your endpoint resolves the verdict by transaction id with the secret API key:

```javascript theme={null}
// POST /api/verify on YOUR server
app.post('/api/verify', async (req, res) => {
  const { transactionId, mobileNumber } = req.body;

  const upstream = await fetch(
    `https://service.authmatech.com/v1/api/verify/${transactionId}`,
    {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
        'X-API-KEY': process.env.AUTHMATECH_API_KEY,   // server-side only
        'X-CLIENT-ID': process.env.AUTHMATECH_CLIENT_ID,
      },
      body: JSON.stringify({ mobileNumber, serviceType: 'LOGIN' }),
    },
  );

  res.status(upstream.status).json(await upstream.json());
});
```

A successful response carries `data.validNumber`. A `validNumber: false` is a successful `200` with a negative verdict — not an error.

## Step 4 — Handle the fallback

The silent check needs an active **mobile-data** connection. On desktop, Wi-Fi, or VPN it can't complete. Detect that case and fall back gracefully — show manual entry or ask the customer to switch to mobile data, rather than dropping back to an OTP.

## Requirements & constraints

* **Mobile browser, mobile data** — the silent check can't complete on desktop or over Wi-Fi/VPN.
* **Secure context** — the page must be served over HTTPS, and `checkUrl` must be `https`.
* **Never client-side keys** — the browser only ever sees the `transactionId` and `checkUrl`; the API key stays on your server.

## Related

<CardGroup cols={2}>
  <Card title="Web SDK reference" icon="js" href="/sdks/web">
    Full configuration and the `initAuthmatechCheck` API.
  </Card>

  <Card title="API: verify (Web)" icon="code" href="/api/overview">
    Resolve a verification by transaction id.
  </Card>
</CardGroup>
