Ruka hadi maudhui makuu

Miunganisho ya fremu za kazi

SDK haihitaji safu kwa kila fremu ya kazi: autocapture hurekebisha History API, hivyo mabadiliko ya njia hufuatiliwa chini ya kila router. Unda mteja mmoja kwa ukurasa na umshiriki jinsi fremu yako inavyoshiriki kitu kingine chochote. Unarenda kwenye seva pia? Unda mteja kwenye kivinjari pekee, kama kila kipande hapa chini kinavyofanya.

Ufunguo katika vipande hivi unatoka kwenye konsoli: Pata ufunguo wa API

At a glance

Route tracking
None needed: autocapture patches the History API, every router is covered
Pattern
One createWebClient per page, shared via your framework
React
@prodantix/react, the one lifecycle that needs an adapter

React

React ndiyo tofauti pekee: mzunguko wake wa maisha unahitaji adapta maalum, provider na hook zinazosakinisha mteja mara moja tu, salama kwa StrictMode.

Bash
bun add @prodantix/sdk @prodantix/react

Vue

JavaScript
// prodantix.js
import { createWebClient } from '@prodantix/sdk/web';

export const prodantixPlugin = {
  install(app, options) {
    const client = createWebClient(options);
    app.provide('prodantix', client);
  },
};

// main.js (in a Nuxt app: a .client.js plugin)
app.use(prodantixPlugin, {
  apiKey: PRODANTIX_PUBLIC_KEY,
  host: 'https://eu.api.prodantix.com',
  flagsHost: 'https://api.prodantix.com',
});

// any component
import { inject } from 'vue';
const prodantix = inject('prodantix');
prodantix.capture('order.completed');

Svelte

JavaScript
// $lib/prodantix.js
import { browser } from '$app/environment';
import { createWebClient } from '@prodantix/sdk/web';

export const prodantix = browser
  ? createWebClient({
      apiKey: PRODANTIX_PUBLIC_KEY,
      host: 'https://eu.api.prodantix.com',
      flagsHost: 'https://api.prodantix.com',
    })
  : null;

// any component
import { prodantix } from '$lib/prodantix';
prodantix?.capture('order.completed');

Angular

JavaScript
// prodantix.service.ts (Angular Universal: create only when isPlatformBrowser)
import { Injectable } from '@angular/core';
import { createWebClient } from '@prodantix/sdk/web';

@Injectable({ providedIn: 'root' })
export class ProdantixService {
  readonly client = createWebClient({
    apiKey: PRODANTIX_PUBLIC_KEY,
    host: 'https://eu.api.prodantix.com',
    flagsHost: 'https://api.prodantix.com',
  });
}

// any component
constructor(private prodantix: ProdantixService) {}
this.prodantix.client.capture('order.completed');