使用你偏好的包管理器将 SDK 添加到你的项目。
npm install @tracio/reactyarn add @tracio/reactpnpm add @tracio/react以最简配置快速上手运行。
import { useVisitorId } from '@tracio/react'function App() { const { data: visitorId } = useVisitorId() return <div>Visitor: {visitorId}</div>}包含错误处理、加载状态和高级配置的生产级模式。
import { TracioProvider, useTracioResult } from '@tracio/react'function App() { return ( <TracioProvider publicKey={process.env.NEXT_PUBLIC_TRACIO_KEY!} endpoint="/tracio/identify" timeoutMs={15000} > <ProtectedPage /> </TracioProvider> )}function ProtectedPage() { const { data, isLoading, error } = useTracioResult() if (isLoading) return <Spinner /> if (error) return <ErrorBanner message={error.message} /> return ( <div> <p>Visitor: {data?.visitorId}</p> <p>Bot: {data?.bot.detected ? 'detected' : 'clear'} ({data?.bot.confidence}/100)</p> </div> )}用于初始化和配置 SDK 的所有可用选项。
publicKeystring来自仪表盘的公钥 — 可安全地随浏览器代码发布endpointstring用于代理路由部署的自定义端点 URL — 显式 URL 优先于 regionregionstring数据区域：us 或 eutimeoutMsnumber整个 getResult() 调用的超时时间（毫秒）linkedIdstring已登录用户在您系统内的账户 ID，用于关联共享同一设备的访问tagstring附加到识别请求上的自由格式标签，例如 checkout 或 logindebugboolean将脚本生命周期和网络活动输出到浏览器控制台scriptUrlstring完全覆盖 agent 脚本 URL — 用于自托管或 Subresource Integrity通过完整的 API 参考、webhook 配置和高级指南深入了解。