affiliatebase-tracking

Lightweight, zero-dependency affiliate tracking script for AffiliateBase. Cookie-based attribution, conversion tracking, and automatic Stripe integration.

Features

• 🍪 Cookie-based referral attribution (30-day default)
• 🔗 Multiple tracking parameters (?via=, ?ref=, ?affiliate=)
• 💳 Automatic Stripe Buy Button / Pricing Table integration
• 📧 Conversion tracking via email
• 🎯 Promo code attribution
• 🌐 Cross-domain link tagging
• 📝 Automatic form integration
• 0️⃣ Zero dependencies, pure JavaScript (~26KB)

Installation

Via npm

npm install affiliatebase-tracking
# or
pnpm add affiliatebase-tracking
# or
yarn add affiliatebase-tracking

Via CDN

<!-- Async loader (recommended) -->
<script>
  (function(w,r){w._abq=w._abq||[];w[r]=w[r]||function(){(w[r].q=w[r].q||[]).push(arguments)}})(window,'affiliatebase');
</script>
<script async src="https://cdn.jsdelivr.net/npm/affiliatebase-tracking@1/src/index.js" data-org-id="YOUR_ORG_ID"></script>

Usage

Basic Tracking

// Track conversion after signup/purchase
affiliatebase('convert', { email: '[email protected]' });

// Force attribution to specific affiliate
affiliatebase('source', 'affiliate_token');

// Execute code when loaded
affiliatebase('ready', () => {
  console.log('Referral:', window.AffiliateBase.referral);
});

TypeScript Support

import 'affiliatebase-tracking';

// Full type safety
affiliatebase('convert', { email: '[email protected]' });

if (window.AffiliateBase.referral) {
  console.log('Referred by:', window.AffiliateBase.affiliate?.name);
}

Automatic Stripe Integration

<!-- Stripe Buy Button -->
<stripe-buy-button
  buy-button-id="buy_btn_xxx"
  publishable-key="pk_test_xxx"
  data-affiliatebase
></stripe-buy-button>

<!-- Stripe Pricing Table -->
<stripe-pricing-table
  pricing-table-id="prctbl_xxx"
  publishable-key="pk_test_xxx"
  data-affiliatebase
></stripe-pricing-table>

Form Integration

<!-- Automatic -->
<form data-affiliatebase="true">
  <input type="email" name="email">
  <button>Submit</button>
  <!-- Hidden referral input auto-injected -->
</form>

<!-- Manual -->
<script>
affiliatebase('ready', () => {
  window.AffiliateBase.Forms.add(document.getElementById('signup-form'));
});
</script>

API Reference

Methods

affiliatebase('convert', data)

Track conversion event (signup, purchase, etc.)

Parameters:

• data.email (required): Customer email
• data.*: Additional metadata

Example:

affiliatebase('convert', {
  email: '[email protected]',
  value: 99.99,
  plan: 'pro'
});

affiliatebase('source', token)

Force attribution to specific affiliate token

Parameters:

• token (required): Affiliate link token

Example:

affiliatebase('source', 'affiliate_abc123');

affiliatebase('ready', callback)

Execute callback when script loaded

Parameters:

• callback (required): Function to execute

Example:

affiliatebase('ready', () => {
  console.log('Tracking initialized');
});

Global Objects

window.AffiliateBase

Main tracking object with attribution state

Properties:

• config: Configuration (apiUrl, orgId, debug, loaded)
• referral: Current referral ID (UUID) or empty string
• affiliate: Affiliate object or false
• campaign: Campaign object or false
• coupon: Coupon object or false

Example:

if (window.AffiliateBase.referral) {
  console.log('Referred by:', window.AffiliateBase.affiliate.name);
  console.log('Campaign:', window.AffiliateBase.campaign.name);
  console.log('Commission:', window.AffiliateBase.campaign.commission_value);
}

Configuration

Script Tag Attributes

<script
  src="https://cdn.jsdelivr.net/npm/@affiliatebase/tracking@1/src/index.js"
  data-org-id="YOUR_ORG_ID"              <!-- Required -->
  data-debug="true"                      <!-- Optional: logging -->
  data-affiliatebase-params="partner"    <!-- Optional: custom params -->
></script>

URL Parameters

Automatically detected:

• ?via=TOKEN (primary)
• ?ref=TOKEN
• ?affiliate=TOKEN
• ?a=TOKEN
• ?referral=ID (preload existing)
• Custom parameters via data-affiliatebase-params

Example:

https://yoursite.com?via=john123
https://yoursite.com?ref=partner&promo=SALE20

Events

// Script initialized
window.addEventListener('AffiliateBase.initialized', () => {
  console.log('Tracking initialized');
});

// Referral tracked
window.addEventListener('AffiliateBase.tracked', (e) => {
  console.log('Referral tracked:', e.detail.referral);
  console.log('Affiliate:', e.detail.affiliate);
});

Advanced Usage

Cross-Domain Link Tagging

// Automatically tag links to specified domains
affiliatebase('ready', () => {
  window.AffiliateBase.CrossDomainLinks.attach('example.com,partner.com');
});

Manual Stripe Integration

affiliatebase('ready', () => {
  // Attach Stripe Buy Buttons
  window.AffiliateBase.StripeBuyButtons.attach();

  // Attach Stripe Pricing Tables
  window.AffiliateBase.StripePricingTables.attach();

  // Attach Payment Links
  window.AffiliateBase.PaymentLinks.attach();
});

Attach All Integrations

affiliatebase('ready', () => {
  // Attach everything at once
  window.AffiliateBase.attachAll('example.com,partner.com');
});

Browser Support

• Chrome/Edge (last 2 versions)
• Firefox (last 2 versions)
• Safari (last 2 versions)
• iOS Safari (last 2 versions)

License

MIT

Links

• Repository
• Issues
• Documentation