Cloudflare ? Est-ce que vous avez déjà entendu le nom de ce service ? Et bien c’est un vrai couteau suisse qui permet d’optimiser la globalité des performances de votre boutique Prestashop… Oui, c’est vraiment TOP !
Une méthode simple pour avoir un shop rapide
Ce que j’apprécie avec Cloudflare c’est que l’intégration est très simple, on change les DNS du domaine et ensuite Cloudfare prend en charge le reste et fait lui-même les optimisations nécessaires (compression des fichiers, mise en cache, protection de votre shop). N’importe quel novice (ou presque) est capable de mettre en oeuvre ce service… Le gros avantage ? Pas besoin d’installer 36 plugins et c’est gratuit.
Les modules Prestashop pour optimiser les performances
Savez-vous quel est le problème de ces modules ? Bien souvent c’est qu’ils sont beaucoup trop intrusifs, ils compressent et modifient trop de code et ça alourdit les comportement de Prestashop. Et il y a une réalité un module « Prestashop » pour optimiser les performances… ne sera jamais aussi populaire / bon, qu’un « Clouflare » utilisé à l’échelle mondiale. Chez Cloudflare vous avez l’assurance que ce sont des optimisations qui ne vont pas « perturber » votre boutique et ça c’est très rassurant.
La localisation de l’IP du domaine aux US
Par exemple sur les shops où j’ai mis en place ce service, l’adresse du domaine est à présent localisée aux US… Il est vrai que cela va à contraire de ce que je recommande habituellement (avoir une IP basée localisée sur le pays dans lequel on a son business). J’ai fait le test en terme de SEO avec une IP Suisse & une IP US et je n’ai pas vu différence d’impact en terme de trafic pour le même domaine. Je pense que Google est capable de comprendre que Cloudflare est un intermédiaire et que le site n’est pas réellemement localisé aux US.
Gratuit comment est-ce possible ?
C’est une question qu’on peut se poser, comment cela se fait-il que Cloudflare peut proposer une version de base 100% gratuite… En principe quand c’est gratuit alors « c’est vous le produit » (ou vos données)… Mais je pense qu’il faut être réaliste, notre but à tous c’est d’avoir un site rapide… un service qui propose de faire cela « gratuitement » et qu’en plus ça fonctionne « très bien », que demander de plus ? Et finalement ce n’est pas plus « intrusif » que votre registar qui capte votre trafic.
La combinaison magique ?
Vous savez avec les clients, il faut être « rapide » et « efficace » et surtout « pas trop cher », alors avant de m’aventurer dans de l’optimisation de code Prestashop et le déploiement de plugins, voici ce que je fais simplement. Pour commencer je mets la boutique Prestashop sur un VPS avec de bonnes performances, puis j’ajoute la surcouche Cloudflare par-dessus. L’avantage de fonctionner ainsi c’est que c’est « simple & peu coûteux », car plutôt que d’optimiser du code on se contente d’augmenter la puissance des ressources et pour la partie technique on délègue à Cloudfare parce que c’est leur travail (je vulgarise le trait, mais c’est un peu ça).
Résumé de la vidéo : Cloudflare améliore les performances de Prestashop
- Pour commencer on crée un compte sur Cloudflare.
- Ensuite, chez le registar on change les DNS, mais il faut patienter 24/48h pour la prise en charge.
- Vous pouvez contrôler le Whois du nom de domaine pour vous assurer que les DNS ont bien été actualisés.
- Cloudflare, fait déjà toute la configuration pour vous, mais nous allons voir ensemble les différents onglets & options qui s’offrent à nous.
- On va aussi regarder comment contrôler que le cache Cloudflare fonctionne, par le biais du navigateur.
- Oui, je conseille de payer 5€ par mois afin d’avoir un certificat SSL dédié à votre domaine c’est toujours mieux (ok je chipote).
- Quand vous optimisez Prestashop, pensez à désactiver / vider le cache Cloudflare… sinon certaines informations ne vont pas s’actualiser (oui vous aurez le cache Prestashop + le cache Cloudflare).
- En complément d’information, vous pouvez aussi consulter le billet de mon collègue Mediacom87 qui traite de Cloudflare & KeyCDN.
Bonjour,
Merci encore pour cet article.
Quel est l’avantage de prendre le certificat SSL dédié à notre domaine ?
d’avance merci,
Olivier
Bonjour,
Le certificat de base Cloudflare est « partagé » sur plusieurs domaines différents… A vrai dire je ne suis pas expert en certificats SSL/HTTPS, mais le fait d’avoir une « mixité » avec d’autres sites inconnus ça me rassure pas vraiment.
Regardez peut-être ici pour avoir plus d’informations : https://www.tophebergeur.com/hebergement/ssl-partage/
A bientôt !
Merci !!
Salut Webbax.
Encore une vidéo des plus intéressantes. Je vais aller tester ça.
J’ai tout de même quelques questions qui me viennent à l’esprit en regardant ta vidéo :
1 – Qu’en est-il des sous-domaines? doit on prendre plusieurs abonnements? est ce que ca devient payant? Bon, tu me diras qu’on peut aller voir sur leur site (en anglais… pas toujours évident)…
2 – J’ai vu, dans ta vidéo, que tu n’as pas coché allways use https… une raison à celà? Est ce que c’est quelque chose que tu ne fais jamais (si oui pourquoi)? Est ce que c’est juste pour la vidéo que tu n’en avais pas besoin? Je te pose cette question, parcqu’aussi bien sur Prestashop que sur WordPress, c’est une fonction que j’active systématiquement.
3 – J’ai trouvé, sur Prestashop addons un module qui semble proposer la gestion des la partie admin de cloudfare (https://addons.prestashop.com/en/website-performance/24710-cloudflare.html#specifications). utile ou pas?… ca fait des frais en plus, mais ca permet aussi de tout avoir directement en backoffice… gain de temps? Pratique?
Enfin voilà, ce sont les petites question qui me sont venus tout de suite.
Ca me semble en effet, intéressant, je vais aller tester ca sur un de mes sites avant de proposer aux clients.
Bonjour Jérôme,
Pour ton point 1, tu vas dans DNS (Cloudflare) et tu rajoutes un CNAME avec ton sous-domaine, normalement ça doit le faire.
Bonne continuation.
Patrick
Merci pour l’info 😉
Merci Patrick. Je vais voir ça.
Hello,
1) C’est valable pour l’ensemble.
2) Je n’ai pas fait attention, mais en principe cela est géré en « amont » la boutique Prestashop devrait être en 100% HTTPS de base… mais ça peut-être un plus d’activer cette option.
3) A mon avis je ne pense pas que le module soit indispensable, modifier les DNS du domaine est la solution recommandée.
A bientôt !
Bonjour Germain,
Si le PS 1.7.6.3 a déjà MEMCACHED d’installé, peut-on aussi se servir de Cloudflare en même temps ?
Merci 🙂
Hello,
A vrai dire je n’ai pas testé ces 2 options en même temps… c’est assez rare que j’utilise MEMCACHED (régulièrement j’ai vu des e-commerçants avec des problèmes d’actualisation de données).
A bientôt !
Merci pour ta réponse, effectivement cela me créais des soucis, je viens de l’enlever, et tout refonctionne mieux, à part que tous les articles que j’ai saisi depuis la mise en place de MEMCACHE ont perdu l’association a la catégorie principale.
Super Tuto comme d’habitude
J’ai tout de même une question.
Il y a un onglet « always Use HTTPS
Redirect all requests with scheme “http” to “https”. This applies to all http requests to the zone.
ON ou OFF
Perso j’ai mis sur ON, car toi de ton côté pour le test, tu n’a touché à rien. Etait-ce une bonne idée ? Pour ma part, je me suis dit que oui.
Dans tous les cas, la redirection a pris je crois 3 minutes à tout casser.
Maintenant, j’attends de voir le résultat.
C’est toujours un plaisir de voir tes vidéos et bien à jeudi pour un nouveau cours 🙂
Sébastien
Hello,
Je pense que c’est une bonne chose… oui ça permet vraiment de sécuriser tout le trafic. Faire attention quand même parfois il peut y avoir des surprises si certains comportements ne sont pas optimisés pour le HTTPS… mais normalement ça ne devrait pas se produire.
A bientôt !
Bonjour,
Juste une info complémentaire, si comme moi vous avez comme POP3 et SMTP : mail.monsite.com, il va falloir changer.
Pour ma part j’ai mis le nom du serveur, et tout roule.
Je pense qu’il doit y avoir un paramètre sous Cloudflare, mais je ne l’ai pas trouvé.
Hello,
Normalement Cloudflare fait la bonne configuration presque 100% automatiquement, mais on n’est jamais à l’abri de variantes (surtout les mails c’est la base). Merci pour ces infos…
A bientôt !
Bonjour à tous et merci à Webbax pour la vidéo.
J’utilise Cloudflare depuis 12 – 18 mois et voici quelqu’unes de mes remarques en tant qu’utilisateur :
1 – Il faut comprendre le fonctionnement de Cloudflare avant de décider son utilisation car Cloudflare télécharge les pages d’une façon un peu différente : il prépare la page en cache avant la première intéraction utilisateur puis délivre très rapidement tout le contenu de la page (contrairement à un téléchargement au fil de l’eau). Conséquence : La première intéraction utilisateur peut être plus lente avec Cloudflare (que sans) mais après cela va beaucoup plus vite (et au final le téléchargement de la page est plus rapide).
2 – Cloudflare ayant des serveurs aux 4 coins du monde, cela peut-être intéressant pour les vendeurs à l’international. Votre site étant stocké au plus près des utilisateurs, le temps de téléchargement s’en trouve réduit (l’utilisateur chargeant votre site sur le serveur Cloudflare le plus proche de lui sans avoir à venir chercher l’info chez votre hébergeur)
3 – Petite précision par rapport à la vidéo sur le nettoyage du cache : quand vous êtes en production, évitez si possible de ‘nettoyer tout le cache’ comme montré dans la vidéo. En effet, cela a pour conséquence de vider le cache de Cloudflare pour toutes les pages de votre site. Cloudflare doit ensuite le reconstituer petit à petit et votre site sera plus lent pendant un certain temps. Dans le cas où vous ne modifiez que quelques pages, il vaut mieux utiliser l’option ‘Custom purge’ et indiquer l’url des pages que vous voulez actualiser.
4 – Astuce pour booster encore plus votre site avec Cloudflare : Si vous avez réservé plusieurs extensions (par exemple monsite.com et monsite.fr) et que vous ne les utilisez pas toutes pour l’hébergement, utilisez les autres comme serveur de média. Dans Cloudflare, vous ajoutez en plus de votre domaine principal (par ex. monsite.com), le domaine extension (par ex. monsite.fr) et vous indiquez dans PS le domaine extension comme serveur média (en bas de page PS Configurer –> Paramètres avancés –> Performances). L’avantage c’est que vous parallélisez vos téléchargements : Le html, le java, etc… sont téléchargés à partir de votre domaine principal alors que vos ressources médias (notamment les images produits) sont téléchargées à partir du domaine extension. C’est un peu comme si vous aviez 2 serveurs donc des téléchargements plus rapides !!!
Bon WE à tous
Bonjour,
Un grand merci pour votre retour d’expérience avec Cloudflare.
Le point 4 que vous mentionnez est très intéressant, parce qu’effectivement ça permet de décharger le téléchargement des ressources et de répartir sur plusieurs domaines différents et ça c’est TOP.
A bientôt !
Bonjour,
Merci pour vos infos.
Je me suis inscrit sur Cloudflare et j’en suis très satisfait mais je galère pour mettre en place votre point n°4 concernant les serveurs de médias: j’ai 2 domaines chez le même hébergeur (.fr et .com) configurés avec les serveurs de noms Cloudflare.
J’ai testé de rediriger mon .fr vers mon .com, puis j’ai rentré mon nomdedomaine.fr dans la case « serveur de média n°1 » mais rien ne s’affiche en FO et je ne comprends pas comment Prestashop sait où récupérer les images, js et css, mon .fr étant une coquille vide.
Dois-je connecter mon .fr à mon espace web et copier les fichiers manuellement pour que Prestashop les retrouve ?
Merci d’avance pour votre aide,
Cordialement
Merci !!
Merci pour ce super tuto, puis je configurer mes DNS en passant directement par le plesk sur un serveur dédié ?
Est ce que les fichiers sur le FTP sont retouchés ou le sont il seulement sur le cloud ? en cas de retour en arrière suffit il de remettre ses DNS par defaut ?
merci pour ces précisions
Hello,
A faire confirmer à l’hébergeur, si lui gère aussi les domaines la modification DNS doit être possible via Plesk.
Les fichiers Prestashop restent sur le FTP et ne sont pas modifiés, c’est juste que certains fichiers seront mis en cache et se sera Cloudflare qui distribuera le fichier, plutôt que le serveur FTP sur lequel est stocké le fichier.
Oui en remettant les DNS de base on revient en arrière.
A bientôt !
Suite à l’activation de Cloudflare j’ai rencontré un problème avec mon système de paiement en ligne. Le problème venait du Firewall Cloudflare qui bloque les Ips,
Pour régler le problème il suffit de faire des règles pour autoriser les Ips bloquées ou de décocher « Browser integrity check »
Voici le lien ou j’ai trouvé la solution :
https://colibris.es/redsys-woocommerce-cloudflare-pedidos-pendientes-pago/
Hello,
Effectivement si ça bloque la partie paiement de la boutique Prestashop, ça semble assez catastrophique (mais jamais vu encore ce cas). Merci d’avoir partagé cette information qui sera certainement utile à un prochain lecteur.
A bientôt !
Bonjour à tous,
Après plusieurs essais, j’ai réussi à bloquer les Bots tels que Semrush,et autres via Coudflare.
Il faut aller dans Firewall -> Firewall Rules -> Create a firewall rule, vous lui donnez un nom, puis :
Field : User agent
Operator : Contain
Value : Le nom de votre bot, exemple : Semrush
Puis vous cliquez sur OR, et vous rajoutez les autres robots.
Bon confinement à tous 🙂
Merci pour ces infos, intéressant de voir que Cloudflare propose une multitude d’outils.
Bonjour à tous,
Moi en ce qui me concerne j’ai des déconexxion intempestives au niveau du back office. Donc impossible de gérer ma boutique. Je désisntalle ClouFlare, pas du tout convaincu… Cdt
Bonjour,
Il faut que le Prestashop de base soit assez réactif, si votre Prestashop met parfois 30 ou 60 secondes pour se charger « Cloudflare » coupe automatiquement le processus (c’est l’un des inconvénients, mais aussi une sécurité).
A bientôt !
Merci pour cette video.
J’ai une question au sujet des erreur timeout 524 avec prestashop 1.7 lorsqu’on produit par exemple un sitemap… En effet, cloudflare limite a 100s comme indiqué dans votre vidéo… Du coup comment fait on pour contourner ce problème? Je souhaiterai simplement actualiser mon sitemap avec le module gsitemap… cependant mm cloudflare désactive il continue de tourner… surement un délais de propagation… bref c’est gênant… une solution? merci et bravo pour votre travail.
Pour contourner le problème il faut en principe faire exécuter le script PHP au serveur (avec une commande « exec » et un chemin local) au lieu de l’url…. c’est un un peu ça le grand principe.
Bonjour merci pour la réponse, en fait le problème venait de mon hebergeur qui avait des soucis techniques. Merci de votre aide et bonne continuation 😉
Hello Germain
Merci pour cette vidéo que j’ai vu un peu tardivement 😉
J’ai vérifié ma configuration de Cloudflare avec mon tutorial et c’est conforme.
Mais j’ai constaté un bug « impossible de mettre a jour les paramètres » depuis une fiche produit !
Je ne sais pas si tu as rencontré ce bug sur tes sites prestashop mais j’ai constaté que ce bug existait en version 1.6 mais je suis en 1.7.2.0
Ce bug apparait lorsque je change mes serveurs de nom avec ceux de Cloudflare et en utilisant Chrome (requêtes synchrone sont dépréciés car elles jouent un rôle négatif sur l’expérience utilisateur) et pas de Mozilla.
En remettant les serveurs de nom de mon registar le bug disparait.
Je ne suis pas très technique pour comprendre le comment du pourquoi …
C’est la raison pour laquelle je te pose la question ….
Devrais je apporter une modification dans le code source de ma boutique 1.7.2.0 ?
Merci d’avance pour tes lumières
🙂 A force de regarder tes vidéos je te tutoie !
Sorry
(lol)
Salut Germain!!
Autant cloudflare propose une offre agressive au niveau tarif autant au niveau technique c’est une sacrée machinerie, perso pour ma part j’ai laissé tomber et suis passé à keycdn qui est d’une facilité de config/mise en place infantile !
Selon la dimension de l’application, cloudflare peu être un atout comme l’inverse et il faut pour le coup quelques notions afin d’en comprendre son fonctionnement, au final on se retrouve vite à demander de l’aide et l’avantage du coté gratuit est rapidement perdu.
Idem si vous avez une preprod en sous domaine (n’oubliez pas de bien configurer cloudflare afin que le sous domaine ne soit pas pris en compte sinon vous risquez de rapidement tourner en bourrique =D
Bonjour
Bravo pour le tuto. Comme tous d’ailleurs…
Je suis sous prestashop 1.7.6.5 chez planethoster data center Paris et j’ai mis en place cloudflare gratuit.
Le souci est que pour le mode maintenance si j’ajoute mon ip … Elle n’est pas prise en compte.
Y aurait il une solution pour contourner ce problème qui est d’ailleurs celui de beaucoup.
Merci d’avance
Cordialement
Bonjour
Effectivement je constate ce même problème je sais pas si une solution existe ?
Bonjour,
Le tuto est op.
Si le cache de Cloudflare (version pro) est activé, doit-on laisser le smarty cache de presta activé ? Ou cela risque de faire conflit ?
Bonjour,
On peut activer tous les caches PrestaShop, y compris CCC (JavaScript et pour les CSS).
Avec la couche Cloudflare par-dessus, cela donne satisfaction et les deux cohabitent ensemble.
À bientôt !
Merci beaucoup pour votre réponse et votre professionnalisme !!!
Bonjour,
Merci pour votre tuto, dite-moi, faut-il totalement désactiver la mise en cache dans prestashop ?
Merci par avance
Bonjour,
Vous pouvez laisser la mise en cache « activée » sur PrestaShop.
À bientôt !
Bonjour Webbax,
Est-il bénéfique de cumuler Cloudflare à un module bien connu tel que Page Cache Ultimate ?
En vous remerciant 🙂
Bonjour Acidlava,
Personnellement je déconseille les modules de caches autres que ceux nativement fournis, dans PrestaShop (il est préférable de s’attaquer à la source de lenteur plutôt que de rajouter des plugins de caches).
Vous pouvez cumuler les deux systèmes.
À bientôt !
Merci pour votre retour Webbax.
J’ai une dernière question concernant CloudFlare. En admettant qu’on utilise la minification JS/CSS/HTML du site, faut-il désactiver en parallèle celle native de PrestaShop ? Quid de l’optimisation Apache ?
Merci beaucoup.
Pour le moment je n’ai pas vu d’objection à activer les caches des deux côtés (Cloudflare + PrestaShop).
Bonjour Germain,
merci pour ce tuto, je l’ai suivi et tout est OK.
juste un petit problème au niveau du Back-office de PrestaShop, celui se déconnecte à chaque changement d’onglet, impossible de travailler.
seule solution trouvée, je désactive » Vérifier l’adresse IP du cookie » dans l’onglet administration des paramètres avancées.
Mais cela pose donc un problème de sécurité.
Aurais-tu déjà rencontré ce problème et si oui existe-i-il une solution ou une configuration de Cloudfare?
Pour infos:
Lorsque je mets mon IP de maintenance celle n’est pas la mienne, mais une autre, certainement celle de Cloudfare.
je suis avec Prestashop 8.1.5 et Php 8
D’avance merci.
Christophe.