Mettre en place un CDN gratuit avec Cloudflare

Credit : Logo officiel

Mettre en place un CDN gratuit avec Cloudflare

Dylan D. — Agent Support Technique Serveur Web 2000 mots 10 min de lecture

Le client en Australie qui pleure devant un site charge en 12 secondes

Decembre dernier, un client e-commerce a Toulouse vend des produits qui partent beaucoup en Australie et au Canada. Son site WordPress avec WooCommerce charge en 1,5 seconde a Paris (genial), 4,8 secondes a Montreal (passable), 11,7 secondes a Sydney (catastrophe). Il perdait 60% de ses visiteurs australiens avant qu'ils voient la page d'accueil. J'ai branche Cloudflare en plan Free un mardi soir, en 45 minutes, et le lendemain Sydney chargeait en 1,8 seconde. Son taux de conversion sur l'Asie-Pacifique est passe de 0,4% a 2,1% le mois suivant.

Cloudflare Free c'est un des meilleurs cadeaux d'internet. Vous obtenez : un CDN avec 300+ points de presence mondiaux, du SSL gratuit, une protection DDoS, un WAF de base, du DNS rapide, des outils de cache reglables. Tout ca sans payer un centime, sans limite de bande passante, sans piege.

Dans ce guide je couvre la mise en place complete avec les vrais reglages que j'utilise sur les sites WordPress et PrestaShop que je supervise. Pas de blabla marketing, juste les commandes et les checkbox a cocher.

Etape 1 : Ajouter votre domaine a Cloudflare

Creez un compte sur cloudflare.com (email + mot de passe, pas de carte bancaire requise pour le plan gratuit). Une fois connecte :

  1. Cliquez sur Add a Site en haut a droite
  2. Entrez votre domaine racine (ex: monsite.fr, sans www, sans https://)
  3. Selectionnez le plan Free (tout en bas, le bouton est moins visible)
  4. Cloudflare scanne automatiquement vos DNS existants pendant 30 secondes

A cette etape, Cloudflare a recupere vos enregistrements DNS actuels mais n'a encore rien change. Votre site continue de fonctionner normalement chez votre registrar/hebergeur.

Etape 2 : Verifier les enregistrements DNS

Cloudflare va vous afficher la liste des enregistrements detectes. C'est ici qu'il ne faut pas se louper. Le proxy Cloudflare (le nuage orange) doit etre active pour le trafic web et desactive (nuage gris) pour les autres protocoles.

Voici a quoi ca doit ressembler pour un site WordPress avec mail sur le meme serveur :

Type   Nom          Contenu                Proxy status
A      monsite.fr   203.0.113.10           Proxied (orange)
A      www          203.0.113.10           Proxied (orange)
MX     monsite.fr   mail.monsite.fr        DNS only (gris)
A      mail         203.0.113.10           DNS only (gris)
TXT    monsite.fr   v=spf1 mx -all         DNS only (gris)
TXT    _dmarc       v=DMARC1; p=quarantine DNS only (gris)
CNAME  ftp          monsite.fr             DNS only (gris)

Les enregistrements MX, mail, TXT, et tout ce qui n'est pas du HTTP doivent imperativement rester en DNS only (nuage gris). Si vous mettez vos MX en orange, vos emails ne fonctionnent plus parce que Cloudflare ne proxy pas le SMTP.

J'ai fait l'erreur exactement une fois en 2022. Le client n'a plus recu d'email pendant 4 heures avant qu'on s'en rende compte. Plus jamais.

Etape 3 : Changer les nameservers chez votre registrar

Cloudflare vous donne deux nameservers du genre dana.ns.cloudflare.com et bob.ns.cloudflare.com (ils sont attribues aleatoirement, chaque domaine a un couple different). Connectez-vous chez votre registrar (Gandi, OVH, IONOS, Namecheap, GoDaddy) et remplacez les nameservers actuels par ceux fournis.

C'est la seule manipulation un peu chiante parce que la propagation DNS peut prendre jusqu'a 48 heures. En realite, sur les TLD modernes (.fr, .com, .net), c'est en general fait en 1 a 4 heures. Pendant cette periode, votre site continue de fonctionner via les anciens DNS, donc pas de coupure.

Verifiez la propagation :

dig NS monsite.fr +short
dana.ns.cloudflare.com.
bob.ns.cloudflare.com.

# Quand ca renvoie les nameservers Cloudflare, c'est bon

Quand Cloudflare detecte que les NS pointent bien chez lui, vous recevez un email "Your domain is now active on Cloudflare".

Etape 4 : Configurer le mode SSL

Dans le dashboard Cloudflare, allez dans SSL/TLS > Overview. Vous avez quatre modes :

Pour utiliser Full (Strict), votre serveur doit avoir un certificat SSL valide. Trois options :

Option 1 : Let's Encrypt sur votre serveur (la plus classique) :

sudo apt install certbot python3-certbot-nginx
sudo certbot --nginx -d monsite.fr -d www.monsite.fr

Option 2 : Cloudflare Origin Certificate (mon prefere) :

Dans SSL/TLS > Origin Server > Create Certificate. Cloudflare vous genere un certif valide 15 ans. Vous le copiez sur votre serveur, vous le configurez dans Nginx, et vous oubliez. Plus de renouvellement Let's Encrypt a gerer.

sudo nano /etc/ssl/cloudflare/origin.crt   # coller le certificate
sudo nano /etc/ssl/cloudflare/origin.key   # coller la private key
sudo chmod 600 /etc/ssl/cloudflare/origin.key

Dans la config Nginx :

ssl_certificate /etc/ssl/cloudflare/origin.crt;
ssl_certificate_key /etc/ssl/cloudflare/origin.key;

Option 3 : Authenticated Origin Pulls : encore plus securise, le serveur n'accepte que les requetes signees par Cloudflare. Pour les setups paranoiaques.

Une fois le certif en place, activez aussi Always Use HTTPS et Automatic HTTPS Rewrites dans SSL/TLS > Edge Certificates.

Etape 5 : Configurer les regles de cache

Le cache Cloudflare c'est la ou vous allez gagner en performance. Allez dans Caching > Configuration.

Reglages de base :

Pour aller plus loin, creez des Cache Rules dans Caching > Cache Rules :

Regle 1 : Cache aggressif sur les assets
Nom : Cache static assets
Quand : URI Path matches regex ".*\.(jpg|jpeg|png|gif|webp|svg|css|js|woff2|ttf|ico){{CONTENT}}quot;
Alors :
  - Cache eligibility: Eligible for cache
  - Edge TTL: 1 month (override origin)
  - Browser TTL: 1 week

Regle 2 : Bypass cache pour l'admin WordPress
Nom : Bypass admin
Quand : URI Path contains "/wp-admin/" OR URI Path contains "/wp-login"
Alors :
  - Cache eligibility: Bypass cache

Sur un site WordPress avec WooCommerce, ajoutez aussi un bypass pour le panier et le checkout :

Regle 3 : Bypass cache WooCommerce dynamique
Quand : URI Path contains "/cart/" OR URI Path contains "/checkout/" OR URI Path contains "/my-account/"
Alors : Bypass cache

Etape 6 : Optimisations de performance

Dans Speed > Optimization :

Dans Network :

Etape 7 : WAF et securite

Dans Security > WAF, vous activez les regles de base gratuites :

Pour des regles personnalisees, allez dans Security > WAF > Custom Rules. Exemples utiles :

Regle : Bloquer les acces a wp-config.php et .env
Expression : (http.request.uri.path contains "wp-config") or 
             (http.request.uri.path contains ".env") or
             (http.request.uri.path contains "phpinfo")
Action : Block

Regle : Limiter les tentatives de login WordPress
Expression : (http.request.uri.path eq "/wp-login.php" and http.request.method eq "POST")
Action : Challenge (Managed)

Regle : Bloquer les acces depuis pays a risque (a adapter)
Expression : (ip.geoip.country in {"CN" "RU" "KP"})
Action : Block

Le Rate Limiting est aussi gratuit jusqu'a 10 000 requetes/jour. Dans Security > Rate Limiting Rules, vous pouvez par exemple limiter /wp-login.php a 5 tentatives par minute par IP.

Etape 8 : Verifier que tout fonctionne

curl -I https://monsite.fr

Vous devez voir dans les headers de reponse :

HTTP/2 200
cf-cache-status: HIT
cf-ray: 8a1b2c3d4e5f-CDG
server: cloudflare
strict-transport-security: max-age=31536000

Le cf-ray confirme que la requete passe par Cloudflare. Le cf-cache-status: HIT confirme que le cache fonctionne (sur les premieres requetes vous aurez MISS puis HIT ensuite, c'est normal).

Tester le SSL :

curl -sI https://monsite.fr | grep -i strict
openssl s_client -connect monsite.fr:443 -servername monsite.fr < /dev/null 2>&1 | grep "subject="

Allez aussi sur ssllabs.com/ssltest et lancez un scan, vous devriez avoir un grade A ou A+.

Purger le cache via API

Quand vous publiez du nouveau contenu, vous pouvez vouloir purger le cache. Dans le dashboard, Caching > Configuration > Purge Cache > Custom Purge pour vider une URL specifique.

Via API, super pratique pour les hooks WordPress :

# Recuperez votre Zone ID dans Overview
ZONE_ID="abc123def456"
API_TOKEN="votreTokenAvecPermissionCachePurge"

# Purger tout
curl -X POST "https://api.cloudflare.com/client/v4/zones/$ZONE_ID/purge_cache" \
  -H "Authorization: Bearer $API_TOKEN" \
  -H "Content-Type: application/json" \
  --data '{"purge_everything":true}'

# Purger des URLs specifiques
curl -X POST "https://api.cloudflare.com/client/v4/zones/$ZONE_ID/purge_cache" \
  -H "Authorization: Bearer $API_TOKEN" \
  -H "Content-Type: application/json" \
  --data '{"files":["https://monsite.fr/article/123","https://monsite.fr/categorie/tech"]}'

Creez un token API limite uniquement aux operations de cache dans My Profile > API Tokens > Create Token > Custom Token. Ne mettez JAMAIS un token Global API Key dans des scripts.

Erreurs courantes et leur fix

Erreur 525 SSL Handshake Failed. Cloudflare ne peut pas etablir la connexion SSL avec votre serveur. En general parce que vous etes en mode Full (Strict) sans certificat valide cote serveur. Soit installez Let's Encrypt, soit passez temporairement en Full (mais pas Flexible).

Boucle de redirection ERR_TOO_MANY_REDIRECTS. C'est le piege classique avec WordPress. Vous etes en mode Flexible et WordPress redirige HTTP vers HTTPS, donc Cloudflare envoie HTTP a WP qui redirige vers HTTPS, qui retombe en HTTP cote serveur. Solution : passez en Full ou Full (Strict), et dans wp-config.php ajoutez :

if (isset($_SERVER['HTTP_X_FORWARDED_PROTO']) && $_SERVER['HTTP_X_FORWARDED_PROTO'] === 'https') {
    $_SERVER['HTTPS'] = 'on';
}

Real IP des visiteurs perdue (tout le monde a 173.x.x.x). Cloudflare proxy donc votre serveur voit l'IP Cloudflare au lieu de l'IP reelle du visiteur. Pour Nginx, ajoutez le module ngx_http_realip et configurez :

set_real_ip_from 173.245.48.0/20;
set_real_ip_from 103.21.244.0/22;
# ... voir la liste complete sur cloudflare.com/ips
real_ip_header CF-Connecting-IP;

Cache pas effectif (cf-cache-status: BYPASS partout). Verifiez vos cookies. Si votre site set un cookie sur chaque page (analytics maison, sessions), Cloudflare ne cache pas par defaut. Soit reduisez les cookies, soit utilisez les Cache Rules pour forcer le cache malgre les cookies.

MX en orange par erreur, plus de mails. Repassez les MX en gris (DNS only) et redemarrez votre client mail pour qu'il refasse la resolution DNS. Si votre serveur de mail recoit des messages depuis 4 heures, ils sont peut-etre encore en queue chez les expediteurs (la plupart retentent pendant 5 jours).

Pour aller plus loin

Conclusion : Cloudflare Free, le 100 euros par mois qui ne coute rien

Si vous deviez payer pour un CDN equivalent, ce serait facilement 100-200 euros par mois en 2026. Cloudflare Free offre tout ca gratuitement parce que leur business model c'est de monter en gamme sur les usages pro (WAF avance, DDoS Layer 7 illimite, analytics fines). Mais le plan gratuit reste largement suffisant pour 95% des sites web, blogs, e-commerces de taille petite a moyenne.

L'autre avantage qu'on oublie : Cloudflare absorbe les pics de trafic. Le jour ou un de mes clients a ete cite a la TV un samedi soir, son serveur 2 vCPU n'a pas bronche : Cloudflare a servi 80% du trafic depuis son cache. Sans CDN, le site serait tombe en 30 secondes.

Mettez-le en place sur tous vos sites, meme les petits. Une fois que c'est fait, vous l'oubliez et ca tourne tout seul.

# Articles similaires

Sur les memes sujets et plus loin