React

Используйте @fingerru/react, если ваш интерфейс написан на React. Для работы понадобится публичный API-ключ проекта. В быстром старте показано, как получить ключ и проверить запрос.

Установите пакетСкопировать ссылку

npm install @fingerru/react

Подключите провайдерСкопировать ссылку

Оберните приложение в FingprintProvider и передайте публичный ключ:

import { createRoot } from 'react-dom/client'
import { FingprintProvider } from '@fingerru/react'
import { App } from './App'

createRoot(document.getElementById('root')!).render(
  <FingprintProvider apiKey="pk_live_example">
    <App />
  </FingprintProvider>,
)

Замените pk_live_example на публичный ключ своего проекта.

Получите идентификаторСкопировать ссылку

В компоненте вызовите useVisitorData({ immediate: true }). Запрос выполнится после монтирования компонента:

import { useVisitorData } from '@fingerru/react'

export function App() {
  const { data, error, isLoading } = useVisitorData({ immediate: true })

  if (isLoading) return <p>Получаем данные...</p>
  if (error) return <p>Не удалось получить данные: {error.message}</p>

  return <p>Visitor ID: {data?.user}</p>
}

Чтобы запускать запрос по действию пользователя, установите immediate: false и вызовите getData() в нужном месте.

После успешного запроса найдите событие в кабинете по полю Visitor ID, как показано в быстром старте.