Proxy with Netlify

A Netlify Function mounted on your two paths relays the script and events with Netlify's visitor IP and location.

Set it up

1. Add the function

   netlify/functions/metricraven.mjs

   Copy

   1

   2

   3

   4

   5

   6

   7

   8

   9

   10

   11

   12

   13

   14

   15

   16

   17

   18

   19

   20

   21

   22

   23

   24

   25

   26

   27

   28

   29

   30

   31

   32

   33

   34

   35

   36

   37

   38

   // netlify/functions/metricraven.mjs · Netlify Functions
   export default async (request, context) => {
     const { pathname } = new URL(request.url);
     const script = pathname === "/a/script" && request.method === "GET";
     const event = pathname === "/a/event" && request.method === "POST";
     if (!script && !event) return new Response("Not found", { status: 404 });
     const headers = new Headers({ "x-visitor-ip": context.ip });
     for (const name of ["content-type", "origin", "user-agent"]) {
       const value = request.headers.get(name);
       if (value) headers.set(name, value);
     }
     const geo = context.geo || {};
     for (const [name, value] of [
       ["x-visitor-country", geo.country?.code],
       ["x-visitor-region", geo.subdivision?.name],
       ["x-visitor-city", geo.city],
       ["x-visitor-latitude", geo.latitude],
       ["x-visitor-longitude", geo.longitude],
     ]) {
       if (value) headers.set(name, encodeURIComponent(value));
     }
     const upstream = await fetch(script ? "https://metricraven.com/js/script.js" : "https://metricraven.com/api/v1/collect", {
       method: request.method,
       headers,
       body: event ? await request.arrayBuffer() : undefined,
       signal: AbortSignal.timeout(15000),
     });
     return new Response(upstream.body, {
       status: upstream.status,
       headers: {
         "Content-Type": upstream.headers.get("content-type") || "application/octet-stream",
         "Cache-Control": script ? "public, max-age=3600" : "no-store",
       },
     });
   };
   
   // Serve the function at these paths on your site's own domain.
   export const config = { path: ["/a/script", "/a/event"] };

   config.path serves the function at /a/script and /a/event directly, so it needs no _redirects lines.

2. Deploy

   Push to your connected repository or run netlify deploy --prod.

3. Point your script tag at your own paths

   Replace your MetricRaven tag with this one. src loads the tracker from your domain and data-api sends its events there too.

   Your website's shared layout

   Copy

   1

   <script defer src="/a/script" data-api="/a/event" data-site-id="YOUR_SITE_ID"></script>

Notes

• A _redirects proxy rule such as /a/event https://metricraven.com/api/v1/collect 200 is not enough on its own: it can't add x-visitor-ip, so every visit would appear to come from Netlify.

How the proxy works and which headers it must send: Use your own domain.