Ten przewodnik przeprowadzi Cię przez integrację TRACIO z Twoją aplikacją. Zainstalujesz kliencki SDK, zainicjujesz go swoim kluczem publicznym i odczytasz pierwszy wynik identyfikacji odwiedzającego.
Zainstaluj SDK TRACIO przy użyciu preferowanego menedżera pakietów:
npm install @tracio/sdkLub za pomocą pnpm:
pnpm add @tracio/sdkLub za pomocą yarn:
yarn add @tracio/sdkJeśli nie używasz bundlera, wstaw znacznik edge script na swoją stronę. Inicjalizuje się automatycznie kluczem publicznym przekazanym w parametrze zapytania k:
<script src="https://edge.tracio.ai/s.js?k=PUBLIC_KEY" async></script>Zaimportuj Tracio i wywołaj Tracio.init() ze swoim kluczem publicznym. Zwraca to natychmiast TracioInstance — bazowy agent ładuje się w tle.
import { Tracio } from "@tracio/sdk"
const tracio = Tracio.init({ publicKey: "5ca175fc...",})Twój klucz publiczny można bezpiecznie umieścić w kodzie po stronie klienta. Znajdziesz go w panelu w sekcji API Keys.
Tracio.init() przyjmuje obiekt TracioConfig:
| Opcja | Typ | Domyślnie | Opis |
|---|---|---|---|
publicKey | string | wymagane | Twój klucz publiczny. Skopiuj go z panelu. |
region | "us" | "eu" | brak | Opcjonalny region danych. Bez ustawienia SDK korzysta z generycznego endpointu https://edge.tracio.ai (bez domniemanej rezydencji danych w US). Ustaw go jawnie na us lub eu. |
endpoint | string | auto | Niestandardowy endpoint API (dla endpointu proxowanego jako first-party). |
scriptUrl | string | auto | Niestandardowy URL skryptu agenta (dla endpointu proxowanego jako first-party). |
linkedId | string | brak | Identyfikator wiążący tego odwiedzającego z encją w Twoim systemie. |
tag | string | brak | Dowolna etykieta dołączana do żądania na potrzeby późniejszego filtrowania. |
debug | boolean | false | Zapisuje szczegółową diagnostykę w konsoli. |
timeoutMs | number | 15000 | Jak długo czekać na wynik przed przekroczeniem limitu czasu. |
Wywołaj tracio.getVisitorId(), aby otrzymać stabilny identyfikator odwiedzającego. Jest to operacja asynchroniczna.
const visitorId = await tracio.getVisitorId()
console.log(visitorId) // "X7fh2Hg9LkMn3pQr"Wywołaj tracio.getResult(), aby otrzymać pełny wynik identyfikacji, wraz z wykrywaniem botów.
const result = await tracio.getResult()
console.log(result.visitorId) // "X7fh2Hg9LkMn3pQr"
if (result.bot.detected) { console.warn("bot, confidence:", result.bot.confidence)}Wynik ma postać:
{ visitorId: "X7fh2Hg9LkMn3pQr", bot: { detected: false, confidence: 2, // 0-100 reasons: [], },}Wykorzystaj callbacki cyklu życia, aby zareagować, gdy agent jest gotowy lub gdy coś zawiedzie, oraz destroy(), aby zniszczyć instancję:
const tracio = Tracio.init({ publicKey: "5ca175fc..." })
tracio.onReady((result) => { console.log("ready:", result.visitorId)})
tracio.onError((error) => { console.error("tracio error:", error.code, error.message)})
// later, when you no longer need ittracio.destroy()Zobacz Obsługa błędów, aby zapoznać się z pełną listą kodów błędów i pomocnikami do ponawiania.
import { Tracio } from "@tracio/sdk"
const tracio = Tracio.init({ publicKey: "5ca175fc..." })
async function handleLogin(email: string, password: string) { const visitorId = await tracio.getVisitorId()
const response = await fetch("/api/login", { method: "POST", body: JSON.stringify({ email, password, visitorId }), })
return response.json()}import { Tracio } from "@tracio/sdk"
const tracio = Tracio.init({ publicKey: "5ca175fc...", tag: "payment",})
async function processPayment(paymentData: PaymentData) { const result = await tracio.getResult()
if (result.bot.detected) { throw new Error("Automated client detected") }
const response = await fetch("/api/payment", { method: "POST", body: JSON.stringify({ ...paymentData, visitorId: result.visitorId }), })
return response.json()}