Швидкий старт

Цей посібник проведе вас через інтеграцію TRACIO у ваш застосунок. Ви встановите клієнтський SDK, ініціалізуєте його своїм публічним ключем і прочитаєте свій перший результат ідентифікації відвідувача.

Крок 1: Встановлення SDK

Встановіть TRACIO SDK за допомогою вашого улюбленого менеджера пакетів:

npm install @tracio/sdk

Або за допомогою pnpm:

pnpm add @tracio/sdk

Або за допомогою yarn:

yarn add @tracio/sdk

Сніпет CDN без збірки

Якщо ви не використовуєте бандлер, додайте на сторінку edge-тег script. Він автоматично ініціалізується з публічним ключем у query-параметрі k:

<script src="https://edge.tracio.ai/s.js?k=PUBLIC_KEY" async></script>

Крок 2: Ініціалізація SDK

Імпортуйте Tracio та викличте Tracio.init() зі своїм публічним ключем. Це одразу повертає TracioInstance — базовий агент завантажується у фоні.

import { Tracio } from "@tracio/sdk"

const tracio = Tracio.init({
  publicKey: "5ca175fc...",
})

Ваш публічний ключ безпечно постачати у клієнтському коді. Ви знайдете його у своїй панелі керування в розділі API Keys.

Параметри конфігурації

Tracio.init() приймає об’єкт TracioConfig:

Крок 3: Отримання ідентифікатора відвідувача

Викличте tracio.getVisitorId(), щоб отримати стабільний ідентифікатор відвідувача. Це асинхронна операція.

const visitorId = await tracio.getVisitorId()

console.log(visitorId) // "X7fh2Hg9LkMn3pQr"

Крок 4: Читання повного результату

Викличте tracio.getResult(), щоб отримати повний результат ідентифікації, включно з виявленням ботів.

const result = await tracio.getResult()

console.log(result.visitorId) // "X7fh2Hg9LkMn3pQr"

if (result.bot.detected) {
  console.warn("bot, confidence:", result.bot.confidence)
}

Результат має таку форму:

{
  visitorId: "X7fh2Hg9LkMn3pQr",
  bot: {
    detected: false,
    confidence: 2,        // 0-100
    reasons: [],
  },
}

Крок 5: Життєвий цикл і помилки

Використовуйте колбеки життєвого циклу, щоб реагувати, коли агент готовий або коли щось не вдається, та destroy(), щоб знищити інстанс:

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 it
tracio.destroy()

Див. Обробка помилок для повного переліку кодів помилок і допоміжних засобів для повторних спроб.

Поширені патерни інтеграції

Захист входу

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()
}

Наступні кроки

• Як це працює — Зрозумійте пайплайн збору сигналів та ідентифікації
• Довідник JavaScript SDK — Повна документація API SDK
• Webhooks — Отримуйте події ідентифікації на своєму сервері в реальному часі
• Виявлення ботів — Глибоке занурення у виявлення автоматизації