Autoriser la génération du CSS utilisé et du CSS critique dans Cloudflare

Cet article contient des informations relatives aux problèmes connus causés par les options de sécurité de Cloudflare qui affectent les fonctionnalités Supprimer les ressources CSS inutilisées et Chargement Asynchrone du CSS lors de la génération du CSS utilisé et du CSS critique.

Cloudflare Bot fight mode

Le Bot Fight mode de Cloudflare peut détecter à tort les serveurs WP Rocket comme des bots.

Pour vous assurer que les serveurs peuvent accéder à vos pages, veuillez vous rendre sur Cloudflare > Security > Settings > Bot fight mode, et désactivez-le, comme indiqué ci-dessous :

Cloudflare Firewall

Dans certains cas, le pare-feu Cloudflare peut bloquer les serveurs WP Rocket, et vous pouvez voir cette notification dans le tableau de bord WordPress :

Il semble qu'un plugin de sécurité ou le pare-feu du serveur empêche WP Rocket d'accéder au générateur Supprimer les ressources CSS inutilisées. Les adresses IP répertoriées ici dans notre documentation doivent être autorisées :

- Dans le plugin de sécurité, si vous en utilisez un
- Dans le pare-feu du serveur. Votre hébergeur peut vous aider à ce sujet.

Cet autre avis peut également être affiché :

La protection Cloudflare empêche le service d'accéder au site web.

To solve this problem, you could use Cloudflare's Custom Lists and Custom rules to allow WP Rocket's IP addresses by following these instructions:

Pour résoudre ce problème, vous pouvez utiliser les listes personnalisées et les règles personnalisées de Cloudflare afin d'autoriser les adresses IP de WP Rocket en suivant ces instructions :

1. Rendez-vous sur Cloudflare > Manage Account > Settings > Lists > Custom Lists.
2. Cliquez sur le bouton Create list.
3. Ajoutez un Identifier, assurez-vous que le Type est IP, et cliquez sur le bouton Create.
4. Copiez l'une des listes d'adresses IP disponibles et collez-la dans le premier champ IP.
   Vous n'avez pas besoin de saisir les adresses IP une par une, ni les plages une par une, car le tableau de bord Cloudflare créera automatiquement des entrées pour chaque élément.
5. Clquez sur Add to list, et c'est tout.
   
   Voici un court enregistrement que vous pouvez utiliser comme référence visuelle :
   
   

   

   Jusqu'ici, vous avez créé avec succès votre liste personnalisée et vous pouvez continuer avec votre règle personnalisée comme suit :

6. Rendez-vous dans Security > Security rules.
7. Cliquez sur Create rule, et sélectionnez l'option Custom rules.
8. Tapez un mot-clé pertinent Rule name.
9. Choisissez ces paramètres :
• Field: IP Source Address.
• Operator: Is in list.
• Value: Sélectionnez la liste Identifier que vous avez créé dans les étapes ci-dessus.
• Choose action: Passer.
• WAF components to skip: Cochez toutes les cases correspondant aux composants WAF disponibles.
10. Enfin, cliquez sur Deploy.

Voici un enregistrement expliquant comment créer la règle personnalisée :

Une fois cette règle personnalisée déployée, Cloudflare ne devrait plus bloquer les serveurs WP Rocket.

Cloudflare Workers

Dans certains cas, notre outil peut être bloqué par un Cloudflare Worker. Si tel est le cas, vous verrez s'afficher une erreur similaire à celle-ci :

Error 1101: Rendering error. Worker Threw Exception.

Une cause fréquente de ce problème est qu'un Cloudflare Worker génère une exception JavaScript lors de l'exécution.

Pour déboguer cela, procédez comme suit :

1. Rendez vous sur Cloudflare > onglet Compute (Workers).

2. Désactivez tout Worker que vous avez activé à cet endroit.

3. Une fois les Workers désactivés, essayez de régénérer le CSS utilisé ou le CSS critique dans WP Rocket.

Si la génération se déroule sans problème, vous devrez déboguer le code de votre worker pour détecter d'éventuelles erreurs.

Si cela ne fonctionne pas, veuillez demander au support de Cloudflare d'autoriser WP Rocket.