Quick Start

Add ShieldLabs to your website, identify a visitor and view their risk. Start with a browser integration, then connect the results to your backend.

1. Create a ShieldLabs account and get your API key

Start Free to create your account, or sign in.
Open Integration > Domains and add your website’s hostname, such as example.com.
Select the domain and open Integration > API keys.
Copy its Public Key. You will use it as PUBLIC_API_KEY in the browser examples below.

Your domain starts reporting when ShieldLabs receives its first identification. Domain verification happens automatically from that traffic. For testing, use a registered development domain.

2. Add ShieldLabs to your website

Choose a guide for your frontend. Each guide covers installation, configuration and a first check.

JavaScript

Step-by-step browser setup

React

Provider and identification hook

Next.js

Client components and server integration

Vue

Plugin and identification composable

Angular

Provider and identification helper

Svelte

Context and SvelteKit integration

For an existing JavaScript project, install the SDK:

npm install @shieldlabs-ai/js@1.0.1

yarn add @shieldlabs-ai/js

pnpm add @shieldlabs-ai/js

Import it into your browser code and configure your key:

import { load } from '@shieldlabs-ai/js';

const options = { publicKey: 'PUBLIC_API_KEY' };

Replace PUBLIC_API_KEY with the Public Key you copied in step 1. For a website without a build step, follow Install the snippet.

3. Identify your first visitor

Call identify() when a visitor takes the action you want to protect, such as signing up, logging in or checking out:

async function identifyVisitor() {
  const agent = await load(options);
  const { requestId: identificationId } = await agent.identify();
  return identificationId;
}

The returned identificationId identifies this check. The JavaScript guide shows a complete working page with a button, error handling and the result displayed on screen. For a signed-in user, pass the stable pseudonymous account ID supplied by your backend:

const agent = await load(options);
const { requestId: identificationId } = await agent.identify({
  userId: 'PSEUDONYMOUS_USER_ID',
});

This connects checks to the same user and enables account-level investigations. See Accounts and identifications.

4. View the result in the analytics dashboard

Open your website on the registered domain and run the check.
Open Analytics > Identifications in the analytics dashboard.
Find the check by its Identification ID and open the identification card.
Review the Risk Score, risk signals, identifiers and device and network details.

Processing is asynchronous, so the completed identification may appear after the browser receives its Identification ID. Keep the page open while the check is sent. If the result is missing, check Troubleshooting.

5. Connect the result to your backend

Send the identificationId with the action your application handles. Your server retrieves the identification using the domain’s Private API Key, available under Integration > API keys. Choose your backend guide:

Node.js

History reads and webhook verification

Python

Sync and async clients

Go

Context-aware reads and webhooks

PHP

Composer and server handlers

Java

Maven or Gradle and typed results

.NET

NuGet and ASP.NET Core

For example, in Node.js:

npm install @shieldlabs-ai/node@1.0.1

Set SHIELDLABS_API_KEY in your server environment, then read the result:

import { ShieldLabs } from '@shieldlabs-ai/node';

const client = new ShieldLabs({ apiKey: process.env.SHIELDLABS_API_KEY });

export async function readIdentification(identificationId) {
  if (!identificationId) return null;
  return client.identifications.get(identificationId);
}

The server SDK waits for a stored result within a bounded time budget. Handle missing results and API errors, then use the returned identifiers, Risk Score and detection flags in your application. Follow the backend guide for a complete handler and result validation.

Keep the Private API Key on your server. For push delivery, configure signed webhooks. The data model reference explains the fields available through each delivery method.

Next steps

Protect your first action

Use verified risk results at signup, login or checkout.

Use case tutorials

Build a complete example for your use case.

Content Security Policy

Allow the connections needed by the browser SDK.

Playground

Explore identification and risk results.

Getting started

Account and domains

Browser integration

Server integration

AI

Billing and usage

Troubleshooting

Help

1. Create a ShieldLabs account and get your API key

2. Add ShieldLabs to your website

JavaScript

React

Next.js

Vue

Angular

Svelte

3. Identify your first visitor

4. View the result in the analytics dashboard

5. Connect the result to your backend

Node.js

Python

Go

PHP

Java

.NET

Next steps

Protect your first action

Use case tutorials

Content Security Policy

Playground

​1. Create a ShieldLabs account and get your API key

​2. Add ShieldLabs to your website

JavaScript

React

Next.js

Vue

Angular

Svelte

​3. Identify your first visitor

​4. View the result in the analytics dashboard

​5. Connect the result to your backend

Node.js

Python

Go

PHP

Java

.NET

​Next steps

Protect your first action

Use case tutorials

Content Security Policy

Playground

1. Create a ShieldLabs account and get your API key

2. Add ShieldLabs to your website

3. Identify your first visitor

4. View the result in the analytics dashboard

5. Connect the result to your backend

Next steps