Vue.js / Vite Proxy

Vue SPAs served by Vite need a dev proxy for local testing and a production proxy on your web server or backend.

Development (Vite)
Production

Configure Vite dev proxy

Add to vite.config.js or vite.config.ts:

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";

export default defineConfig({
  plugins: [vue()],
  server: {
    proxy: {
      "/cvs.js": {
        target: "https://usertrax.io",
        changeOrigin: true,
        secure: true,
      },
      "/api/usertrax/events": {
        target: "https://api.usertrax.io",
        changeOrigin: true,
        secure: true,
        rewrite: (path) => path.replace(/^\/api\/usertrax\/events/, "/api/events"),
      },
    },
  },
});

Add the script to index.html

<!doctype html>
<html lang="en">
  <head>
    <script>
      window.usertraxConfig = {
        endpoint: "/api/usertrax/events",
      };
    </script>
    <script
      src="/cvs.js"
      data-key="%VITE_USERTRAX_KEY%"
      defer
    ></script>
  </head>
  <body>
    <div id="app"></div>
    <script type="module" src="/src/main.js"></script>
  </body>
</html>

Add to .env:

VITE_USERTRAX_KEY=your_public_key_here

For production, the Vite dev proxy does not apply. Choose one of these options:

Nginx / Caddy / Apache in front of your built SPA — see the Nginx or Caddy guides
Backend proxy (Laravel, Express) — see Laravel or Express.js
Hosting platform rewrites (Netlify, Vercel) — similar to the Next.js rewrite approach

Your built index.html should use the same proxied paths:

<script>
  window.usertraxConfig = {
    endpoint: "/api/usertrax/events",
  };
</script>
<script src="/cvs.js" data-key="YOUR_API_KEY" defer></script>

Usage in Vue components

Tracking works the same as without a proxy — the endpoint change is transparent:

// After a conversion
window.usertrax.push({
  event: "purchase",
  total: 99.99,
  currency: "EUR",
});

See the Vite + Vue integration for full setup details.

Verification

Run npm run dev (development) or deploy with production proxy configured
Open the Network tab
Confirm cvs.js and event POSTs use your domain (or localhost with dev proxy)

Troubleshooting

Works in dev, not in production: The Vite proxy is dev-only — configure a production proxy separately
401 in production: Ensure your production proxy forwards X-Auth-Key