Svelte SDK

Balíček @tracio/svelte obaluje jádro @tracio/sdk a poskytuje idiomatické Svelte primitivy: jednorázové volání init a readable stores, které vám předají visitor ID a výsledek identifikace.

Instalace

npm install @tracio/svelte @tracio/sdk

svelte (5) je peer dependency a předpokládá se, že už je ve vaší aplikaci nainstalována.

Nastavení

Zavolejte Tracio.init({ publicKey }) jednou, blízko kořene vaší aplikace — v +layout.svelte u SvelteKitu — ošetřené pomocí browser, aby se nikdy nespustilo během serverového renderování.

<!-- +layout.svelte -->
<script>
  import { Tracio } from "@tracio/svelte"
  import { browser } from "$app/environment"
  if (browser) Tracio.init({ publicKey: import.meta.env.VITE_TRACIO_KEY })
</script>
<slot />

Stores

Stav TRACIO je vystaven jako Svelte readable stores. Každá hodnota store je QueryState, který nese data, isLoading a error. Store konzumujte s prefixem $: $visitor.data, $visitor.isLoading, $visitor.error.

Přecházíte z Reactu? Svelte QueryState vynechává příznak isFetched z React hooks a useVisitorId() nevystavuje imperativní metodu pro načtení — pouze useTracioResult() nese getData().

useVisitorId()

Vrací readable store { data, isLoading, error }, kde data je stabilní identifikátor návštěvníka (string | undefined).

<script>
  import { useVisitorId } from "@tracio/svelte"
  const visitor = useVisitorId()
</script>
{$visitor.data}

useTracioResult(opts?)

Vrací readable store { data, isLoading, error } obsahující kompletní TracioResult (visitor ID plus detekce botů). Vrácený store také nese metodu getData() (rozšiřuje Readable) pro imperativní (opětovné) načtení. opts.immediate má výchozí hodnotu true; předáním { immediate: false } odložíte načtení, dokud nezavoláte getData() — například za souhlasovou bránou (consent gate).

<script>
  import { useTracioResult } from "@tracio/svelte"
  const result = useTracioResult({ immediate: false })
  // $result.data / $result.isLoading / $result.error
  // result.getData(): Promise<void> — call to fetch on demand
</script>

useTracio()

Únikový poklop (escape hatch), který vrací podkladovou TracioInstance (nebo undefined, když Tracio.init() pro aktuální strom neproběhlo) pro pokročilé použití. Vrací instanci přímo — není zde žádný store ani wrapper objekt k destrukturování.

<script>
  import { useTracio } from "@tracio/svelte"
  const tracio = useTracio()
</script>

Kompletní příklad

<!-- +layout.svelte -->
<script>
  import { Tracio } from "@tracio/svelte"
  import { browser } from "$app/environment"
  if (browser) Tracio.init({ publicKey: import.meta.env.VITE_TRACIO_KEY })
</script>
<slot />

<!-- AnyComponent.svelte -->
<script>
  import { useVisitorId } from "@tracio/svelte"
  const visitor = useVisitorId()
</script>
{#if $visitor.isLoading}Loading…{:else if $visitor.error}Error: {$visitor.error.message}{:else}Visitor: {$visitor.data}{/if}

Další kroky

• Reference JavaScript SDK — jádro API @tracio/sdk, na kterém stores staví
• Zpracování chyb — chybové kódy a strategie opakování
• Přehled SDK — každý framework balíček na první pohled