SDK Angular

Pakiet @tracio/angular opakowuje rdzeniowy @tracio/sdk i udostępnia idiomatyczne prymitywy Angulara: provider, który rozwijasz do konfiguracji aplikacji, oraz oparty na sygnałach serwis, który możesz wstrzyknąć w dowolnym miejscu.

Instalacja

bash

npm install @tracio/angular @tracio/sdk

@angular/core (17, 18 lub 19) jest peer dependency i zakłada się, że jest już zainstalowany w Twojej aplikacji.

Konfiguracja

Rozwiń provideTracio(config) do ApplicationConfig.providers.

TypeScript

// app.config.ts
import { provideTracio } from "@tracio/angular"
export const appConfig: ApplicationConfig = {
  providers: [provideTracio({ publicKey: "5ca175fc…" })],
}

Serwis

Wstrzyknij TracioService, aby odczytywać stan identyfikacji przez sygnały tylko do odczytu:

Element	Typ	Opis
`visitorId()`	`Signal<string \| null>`	Stabilny identyfikator odwiedzającego.
`result()`	`Signal<TracioResult \| null>`	Pełny wynik identyfikacji.
`error()`	`Signal<TracioError \| null>`	Ostatni błąd, jeśli wystąpił.
`isLoading()`	`Signal<boolean>`	Czy trwa pobieranie danych.
`getVisitorData()`	metoda	(Ponowne) imperatywne pobranie danych odwiedzającego.

TypeScript

// home.component.ts
import { Component, inject } from "@angular/core"
import { TracioService } from "@tracio/angular"
@Component({ selector: "app-home", template: `<span>{{ tracio.visitorId() }}</span>` })
export class HomeComponent {
  readonly tracio = inject(TracioService)
}

Wywołaj getVisitorData(), aby odroczyć lub ponownie wyzwolić identyfikację — na przykład dopiero po tym, jak użytkownik wyrazi zgodę.

Pełny przykład

TypeScript

// app.config.ts
import { provideTracio } from "@tracio/angular"
export const appConfig: ApplicationConfig = {
  providers: [provideTracio({ publicKey: "5ca175fc…" })],
}

TypeScript

// home.component.ts
import { Component, inject } from "@angular/core"
import { TracioService } from "@tracio/angular"
@Component({ selector: "app-home", template: `<span>{{ tracio.visitorId() }}</span>` })
export class HomeComponent {
  readonly tracio = inject(TracioService)
}

Następne kroki

Dokumentacja SDK JavaScript — rdzeniowe API @tracio/sdk, na którym opiera się serwis
Obsługa błędów — kody błędów i strategie ponawiania
Przegląd SDK — każdy pakiet frameworka w skrócie

Serwis

Wstrzyknij TracioService, aby odczytywać stan identyfikacji przez sygnały tylko do odczytu:

Element

Typ

Opis

visitorId()

Signal<string | null>

Stabilny identyfikator odwiedzającego.

result()

Signal<TracioResult | null>

Pełny wynik identyfikacji.

error()

Signal<TracioError | null>

Ostatni błąd, jeśli wystąpił.

isLoading()

Signal<boolean>

Czy trwa pobieranie danych.

getVisitorData()

metoda

(Ponowne) imperatywne pobranie danych odwiedzającego.

TypeScript

// home.component.ts
import { Component, inject } from "@angular/core"
import { TracioService } from "@tracio/angular"
@Component({ selector: "app-home", template: `<span>{{ tracio.visitorId() }}</span>` })
export class HomeComponent {
  readonly tracio = inject(TracioService)
}

Wywołaj getVisitorData(), aby odroczyć lub ponownie wyzwolić identyfikację — na przykład dopiero po tym, jak użytkownik wyrazi zgodę.

Pełny przykład

TypeScript

// app.config.ts
import { provideTracio } from "@tracio/angular"
export const appConfig: ApplicationConfig = {
  providers: [provideTracio({ publicKey: "5ca175fc…" })],
}

TypeScript

// home.component.ts
import { Component, inject } from "@angular/core"
import { TracioService } from "@tracio/angular"
@Component({ selector: "app-home", template: `<span>{{ tracio.visitorId() }}</span>` })
export class HomeComponent {
  readonly tracio = inject(TracioService)
}