Proxy Flowsery Analytics avec DigitalOcean

Faites transiter Flowsery Analytics via DigitalOcean afin d'eviter les interferences des bloqueurs de publicites et de capturer des donnees visiteurs plus precises. Ce guide couvre a la fois App Platform et les configurations basees sur Droplet.

Option 1 : DigitalOcean App Platform

Si vous utilisez DigitalOcean App Platform avec Node.js, reportez-vous au guide specifique au framework correspondant a votre stack :

• Applications Next.js : consultez le guide proxy Next.js
• Applications Express.js : consultez le guide proxy Express.js
• Autres applications Node.js : suivez l'approche Express.js

App Platform gere automatiquement le transfert des IP via l'en-tete X-Forwarded-For, donc les configurations de ces guides fonctionnent sans modification.

Option 2 : DigitalOcean Droplet avec Nginx

Si vous utilisez un DigitalOcean Droplet avec Nginx comme serveur web ou reverse proxy, utilisez la configuration suivante.

1. Vous connecter a votre Droplet

ssh root@your-droplet-ip

2. Ouvrir la configuration Nginx

Editez le fichier de configuration de votre site (generalement /etc/nginx/sites-available/your-site) :

sudo nano /etc/nginx/sites-available/your-site

3. Ajouter les blocs location proxy

Inserez les blocs location suivants dans votre configuration serveur :

server {
    listen 80;
    server_name your_domain.com;
 
    # Your existing configuration...
 
    # Proxy the analytics script
    location /js/main.js {
        proxy_pass https://cdn.flowsery.com/main.js;
        proxy_set_header Host analytics.flowsery.com;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
 
        # Cache the script for 1 year
        add_header Cache-Control "public, max-age=31536000";
        expires 1y;
    }
 
    # Proxy the event collection endpoint
    location /api/track {
        proxy_pass https://analytics.flowsery.com/analytics/events;
        proxy_set_header Host analytics.flowsery.com;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        # CRITICAL: Flowsery reads this as the authoritative visitor IP. Without it, every visitor resolves to your server's region.
        proxy_set_header x-flowsery-real-ip $remote_addr;
 
        # Allow POST requests
        proxy_method POST;
        proxy_pass_request_body on;
    }
 
    # Your other location blocks...
}

Remarque : si vous avez deja un bloc location /api/track, ajoutez data-api a la balise script Flowsery Analytics pour rediriger les evenements. Par exemple, data-api="/flowsery-events" envoie les donnees vers /flowsery-events.

4. Tester et recharger Nginx

Verifiez la configuration pour detecter les erreurs de syntaxe :

sudo nginx -t

Si le test est concluant, rechargez Nginx :

sudo systemctl reload nginx

5. Optionnel : activer le cache

Pour ameliorer les performances, configurez une zone de cache Nginx :

# Place this outside the server block (typically at the top of nginx.conf)
proxy_cache_path /var/cache/nginx/flowsery_cache
    levels=1:2
    keys_zone=flowsery_cache:10m
    max_size=100m
    inactive=60m
    use_temp_path=off;
 
# In your server block, update the script location
location /js/main.js {
    proxy_cache flowsery_cache;
    proxy_cache_use_stale error timeout http_500 http_502 http_503 http_504;
    proxy_cache_valid 200 1y;
    proxy_cache_bypass $http_pragma;
    proxy_cache_revalidate on;
 
    proxy_pass https://cdn.flowsery.com/main.js;
    proxy_set_header Host analytics.flowsery.com;
 
    add_header Cache-Control "public, max-age=31536000";
    expires 1y;
}

Option 3 : DigitalOcean Spaces CDN

Si vous utilisez DigitalOcean Spaces CDN devant votre Droplet, assurez-vous qu'il transfere correctement les IP clientes :

1. Dans le tableau de bord DigitalOcean, allez dans Networking > CDN
2. Verifiez que votre CDN est configure pour laisser passer les en-tetes de requete
3. Le CDN ajoute automatiquement des en-tetes X-Forwarded-For
4. Votre configuration Nginx recuperera les IP visiteurs depuis ces en-tetes

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>

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
4. Verifiez dans votre tableau de bord Flowsery Analytics que les localisations des visiteurs sont affichees correctement

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 Nginx est derriere un autre proxy (Cloudflare, Vercel, etc.), $remote_addr sera l'IP du proxy amont : lisez plutot $http_cf_connecting_ip ou $http_x_real_ip