Managed proxy

1. 1

   Open Settings → Integrations → Proxy. Enter a subdomain of your site (it defaults to stats.example.com; www isn't allowed) and click Set up.

2. 2

   At your DNS provider, add the record the panel shows:

   Type	Name	Target
   CNAME	stats	The target shown in the panel

   Type

   CNAME

   Name

   stats

   Target

   The target shown in the panel

3. 3

   Click Check DNS, or wait: Trakily re-checks automatically. Once the CNAME resolves and the script is served over HTTPS on your subdomain, the status changes to Active.

4. 4

   Replace your snippet with the one the panel now shows. Only the src changes:

   Copy

   <script
     defer
     data-website-id="pls_…"
     data-domain="example.com"
     src="https://stats.example.com/js/script.js"
   ></script>

Events follow the script's origin automatically, so they are posted to https://stats.example.com/api/events. No other change is needed.

Your subdomain needs a valid HTTPS certificate before browsers will load the script from it. A proxy only becomes Active once https://stats.example.com/js/script.js answers over HTTPS, so a missing certificate shows as Waiting for SSL rather than a broken snippet.

On Trakily's hosted service the certificate is issued for you after the CNAME resolves; this usually takes a few minutes. If it stays on Waiting for SSL for more than an hour, check that the CNAME isn't proxied (for Cloudflare, use DNS only, the grey cloud) and that no CAA record blocks Let's Encrypt.

Prefer to keep everything on your main domain? Rewrite two paths, /js/script.js and /api/events, to Trakily, then load the script from your own site with src="/js/script.js". Use script.cookieless.js instead if you use cookieless mode.

const nextConfig = {
  async rewrites() {
    return [
      { source: "/js/script.js", destination: "https://trakily.com/js/script.js" },
      { source: "/api/events", destination: "https://trakily.com/api/events" },
    ];
  },
};

export default nextConfig;

{
  "rewrites": [
    { "source": "/js/script.js", "destination": "https://trakily.com/js/script.js" },
    { "source": "/api/events", "destination": "https://trakily.com/api/events" }
  ]
}

// Route: yoursite.com/js/* and yoursite.com/api/events
export default {
  async fetch(request) {
    const url = new URL(request.url);
    const target = new URL(url.pathname + url.search, "https://trakily.com");
    const headers = new Headers(request.headers);
    headers.set("X-Forwarded-For", request.headers.get("CF-Connecting-IP") || "");
    headers.set("Host", "trakily.com");
    return fetch(target, { method: request.method, headers, body: request.body });
  },
};

[[redirects]]
  from = "/js/script.js"
  to = "https://trakily.com/js/script.js"
  status = 200

[[redirects]]
  from = "/api/events"
  to = "https://trakily.com/api/events"
  status = 200

location = /js/script.js {
    proxy_pass https://trakily.com/js/script.js;
    proxy_set_header Host trakily.com;
    proxy_ssl_server_name on;
}

location = /api/events {
    proxy_pass https://trakily.com/api/events;
    proxy_set_header Host trakily.com;
    proxy_set_header X-Forwarded-For $remote_addr;
    proxy_ssl_server_name on;
}

Then use:

<script
  defer
  data-website-id="pls_…"
  data-domain="example.com"
  src="/js/script.js"
></script>

If /api/events is already taken in your app, rewrite a different path and point the script at it with data-api-url="/your-path".