Integrare full-stack de Device Identification pentru Next.js (App Router + Pages Router). Adaugă identificarea vizitatorilor, detecția boților și smart signals în aplicația ta Next.js în câteva minute.
Adaugă SDK-ul în proiectul tău cu managerul de pachete preferat.
npm install @tracio/reactyarn add @tracio/reactpnpm add @tracio/reactDevii operațional cu configurarea minimă.
// app/layout.tsximport { TracioProvider } from '@tracio/react'export default function Layout({ children }) { return ( <TracioProvider publicKey={process.env.NEXT_PUBLIC_TRACIO_KEY!}> {children} </TracioProvider> )}Tipare gata de producție, cu gestionarea erorilor, stări de încărcare și configurare avansată.
// app/api/webhook/tracio/route.ts — identification events land here in real timeimport crypto from 'crypto'function verify(raw: Buffer, header: string, secret: string) { const p = Object.fromEntries(header.split(',').map((kv) => kv.split('='))) const signed = Buffer.concat([Buffer.from(`${p.t}.`), raw]) const expected = crypto.createHmac('sha256', secret).update(signed).digest('hex') const a = Buffer.from(p.v1, 'hex') const b = Buffer.from(expected, 'hex') return a.length === b.length && crypto.timingSafeEqual(a, b)}export async function POST(req: Request) { const raw = Buffer.from(await req.arrayBuffer()) const sig = req.headers.get('x-tracio-signature') ?? '' if (!verify(raw, sig, process.env.TRACIO_WEBHOOK_SECRET!)) { return new Response('Invalid signature', { status: 401 }) } const event = JSON.parse(raw.toString()) if (event.bot.result === 'bot') { await blockVisitor(event.visitorId) } return new Response('OK')}Toate opțiunile disponibile pentru inițializarea și configurarea SDK-ului.
publicKeystringCheia ta publică din dashboard — sigură de folosit în browserendpointstringURL de endpoint personalizat pentru implementările direcționate prin proxy — un URL explicit are prioritate față de regiuneregionstringRegiunea datelor: us sau eutimeoutMsnumberTimeout pentru întregul apel getResult(), în milisecundelinkedIdstringID-ul tău intern de cont pentru utilizatorul autentificat, ca vizitele de pe același dispozitiv să poată fi corelatetagstringEtichetă liberă atașată cererii de identificare, de ex. checkout sau logindebugbooleanÎnregistrează ciclul de viață al scriptului și activitatea de rețea în consola browseruluiscriptUrlstringSuprascriere completă a URL-ului scriptului agent — pentru self-hosting sau Subresource IntegrityAprofundează cu referința API completă, configurarea webhookurilor și ghiduri avansate.
Referință API completă, ghiduri de integrare și bune practici.
Livrarea evenimentelor în timp real, schema payloadului și verificarea semnăturii.
Configurează notificări în timp real pentru fiecare identificare a unui dispozitiv.
Adaugă fingerprinting de dispozitiv în aplicația ta Next.js în mai puțin de 5 minute.