Proxy Flowsery Analytics avec Firebase Hosting

Faites transiter Flowsery Analytics via Firebase Hosting a l'aide de Cloud Functions afin d'eviter les interferences des bloqueurs de publicites et de capturer des donnees visiteurs plus precises.

Remarque : Firebase Hosting ne prend pas en charge nativement les rewrites de reverse proxy vers des destinations externes. Ce guide utilise donc Firebase Cloud Functions comme alternative.

1. Initialiser Firebase Functions (si ce n'est pas deja fait)

Si votre projet n'inclut pas encore Firebase Functions, lancez :

firebase init functions

Suivez les invites de configuration adaptees a votre environnement. A la fin, un dossier /functions sera present dans votre projet.

2. Installer les dependances

Placez-vous dans le dossier functions/ puis installez les paquets necessaires :

cd functions/
npm i -s express express-http-proxy

3. Construire la fonction de reverse proxy

Creez ou mettez a jour functions/index.js avec le contenu suivant :

const { onRequest } = require('firebase-functions/v2/https');
const express = require('express');
const proxy = require('express-http-proxy');
 
const app = express();
 
app.set('trust proxy', true);
 
// Proxy the Flowsery Analytics tracking script
app.use(
  '/js/main.js',
  proxy('https://analytics.flowsery.com', {
    proxyReqPathResolver: () => '/js/main.js',
  })
);
 
// Proxy the event collection endpoint
app.use(
  '/api/track',
  proxy('https://analytics.flowsery.com', {
    proxyReqPathResolver: () => '/analytics/events',
    proxyReqOptDecorator: (proxyReqOpts, srcReq) => {
      // Forward the real visitor IP for accurate geolocation
      const clientIp =
        srcReq.headers['cf-connecting-ip'] || srcReq.headers['x-real-ip'] || srcReq.headers['x-forwarded-for']?.split(',')[0]?.trim() || srcReq.ip;
      proxyReqOpts.headers['x-forwarded-for'] = clientIp;
      if (clientIp) {
        // CRITICAL: Flowsery reads this as the authoritative visitor IP. Without it, every visitor resolves to your server's region.
        proxyReqOpts.headers['x-flowsery-real-ip'] = clientIp;
      }
      return proxyReqOpts;
    },
  })
);
 
exports.reverseProxy = onRequest(app);

Remarque : si votre projet utilise deja une route /api/track, ajoutez data-api a la balise script Flowsery Analytics pour rediriger les evenements ailleurs. Par exemple, data-api="/flowsery-events" envoie les donnees vers /flowsery-events.

Important : si tous les visiteurs apparaissent au meme endroit dans votre tableau de bord, verifiez que l'en-tete x-flowsery-real-ip est bien defini sur la vraie IP du visiteur (et non celle du serveur proxy) lors du transfert des requetes vers le endpoint /events de Flowsery Analytics.

4. Configurer les rewrites Firebase Hosting

Mettez a jour firebase.json pour router les chemins correspondants vers la fonction reverseProxy :

{
  "hosting": {
    "public": "public",
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "rewrites": [
      {
        "source": "/js/main.js",
        "function": "reverseProxy"
      },
      {
        "source": "/api/track",
        "function": "reverseProxy"
      }
    ]
  },
  "functions": [
    {
      "source": "functions",
      "codebase": "default",
      "ignore": ["node_modules", ".git", "firebase-debug.log", "firebase-debug.*.log", "*.local"]
    }
  ]
}

5. Modifier la balise script

Remplacez le snippet Flowsery Analytics par la version proxifiee :

<script defer data-fl-website-id="flid_******" src="/js/main.js"></script>

6. Deployer l'hosting et les functions

Deployez l'hosting et les functions en une seule commande :

firebase deploy --only hosting,functions

Verifier que cela fonctionne

Pour valider le bon fonctionnement du proxy :

1. Ouvrez votre site web
2. Ouvrez les outils de developpement de votre navigateur et passez a l'onglet Reseau
3. Verifiez que les requetes analytics sont servies depuis votre domaine plutot que depuis analytics.flowsery.com

Depannage

Tous les visiteurs apparaissent au meme endroit

Lorsque tous les visiteurs affichent une seule localisation geographique (generalement la region de votre serveur), le proxy ne transmet pas correctement les vraies IP des visiteurs.

Resolution :

1. Assurez-vous que votre proxy inclut l'en-tete x-flowsery-real-ip contenant la vraie adresse IP du visiteur (et non celle du serveur) lors du transfert des requetes vers le endpoint /events de Flowsery Analytics
2. Si la Cloud Function est derriere un autre proxy (Cloudflare, Vercel, etc.), srcReq.ip sera l'IP du proxy amont : utilisez plutot cf-connecting-ip ou x-real-ip