Skip to main content
Vue works best with AgentRef when the script is installed once in the app shell instead of being recreated on every page.

Before you start

  • Set the program website in AgentRef to the same root domain your Vue app serves.
  • Copy the exact script snippet from Settings -> Integration.
  • If your marketing site and checkout app live on different subdomains, install on both when both can start the conversion path.
For Vue apps built with Vite, install the script in the shared HTML shell.
<!-- index.html -->
<script
  defer
  src="https://www.agentref.co/api/tracking/script.js?pid=YOUR_PROGRAM_ID"
></script>

Checkout compatibility in Vue

Checkout patternRecommendation
Stripe Payment Links, Buy Buttons, or Pricing TablesSupported directly. Keep the script on the page that renders them.
Vue frontend calls an API that creates Stripe Checkout SessionsSupported, but you must pass window.AgentRef.getCheckoutMetadata() to that API first.
Separate root-domain checkoutNot automatic. Cookies are first-party and stay on one root.

Notes for Vue SPAs

  • AgentRef does not need to be re-mounted on route changes.
  • Late-rendered Stripe elements are still instrumented automatically.
  • If you use a cookie banner component, call window.AgentRef.setConsent('granted') after the visitor accepts.

Verify the installation

1

Run a real referral visit

Open a live affiliate link that lands on your Vue app.
2

Check cookies and debug output

Confirm agentref_cid and agentref_pid, then add ?agentref_debug=1.
3

Check diagnostics

Use the AgentRef dashboard, tracking status endpoint, or MCP verify_tracking tool.

Troubleshooting

  • window.AgentRef never appears: install the script earlier, ideally in index.html.
  • Conversions are missing while clicks arrive: your Stripe session creation path still needs the Stripe guide.
  • Cookies disappear between domains: use one shared root domain or install deliberately on every participating subdomain.

Stripe Checkout

Metadata handoff for custom checkout sessions.

JavaScript Snippet

Cookie, parameter, and DOM API reference.

Debug Mode

Runtime inspection and warnings.