Magento 2.4.7 et Content Security Policy (CSP) : Sécuriser sans bloquer le tunnel de commande

Depuis la version 2.3.5, Magento 2 intègre la Content Security Policy (CSP), une couche de sécurité web puissante conçue pour prévenir les attaques XSS (Cross-Site Scripting) et l’injection de contenu malveillant.
Mais à partir de la version Magento 2.4.7, l’application plus stricte des politiques CSP peut provoquer des dysfonctionnements critiques — en particulier dans le tunnel d’achat, où de nombreux scripts tiers sont utilisés.

Ce guide vous explique ce qu’est la CSP, les problèmes observés depuis Magento 2.4.7, et comment les résoudre sans compromettre la sécurité de votre site.

1. Qu’est-ce que la Content Security Policy (CSP) ?

La CSP permet de restreindre les ressources qu’un navigateur est autorisé à charger (scripts, styles, images, iframes…). Elle se configure via :

• Un en-tête HTTP (recommandé) :

Content-Security-Policy: script-src 'self' https://trusted.cdn.com;

• Ou une balise HTML <meta> (moins sécurisée) :

<meta http-equiv="Content-Security-Policy" content="script-src 'self'">

Pourquoi est-ce important ?

✅ Bloque les scripts malveillants (XSS, clickjacking)
✅ Limite les dépendances à des domaines de confiance
❌ Peut désactiver des fonctionnalités légitimes si mal configurée

Source : OWASP CSP Cheat Sheet

2. Magento 2 et CSP : ce qui change depuis la 2.4.7

Magento a progressivement renforcé l’application de la CSP :

Version	Mode CSP	Comportement
2.3.5	Report-Only	Avertissements uniquement
2.4.4	Partiellement actif	Problèmes sur certains modules
2.4.7	Strict par défaut	Blocage actif de scripts non autorisés

Problèmes fréquents dans le tunnel de commande :

🚫 Paiements (Stripe, PayPal, Adyen) → Scripts bloqués (script-src)
🚫 Livraison (Mondial Relay, UPS, Colissimo) → Iframes bloqués (frame-src)
🚫 Outils analytics (Google Analytics, GTM, Hotjar) → Données non collectées

Source : Magento 2.4.7 Release Notes

3. Diagnostiquer et corriger les erreurs CSP

Étape 1 : Activer le mode « Report-Only »

Pour analyser les violations sans bloquer les scripts :

<!-- app/etc/di.xml -->
<type name="Magento\Csp\Model\Policy\ReportOnlyPolicyInterface">
    <arguments>
        <argument name="enabled" xsi:type="boolean">true</argument>
    </arguments>
</type>

Cela permet de voir les erreurs dans la console navigateur, sans affecter le comportement du site.

Étape 2 : Observer les erreurs dans le navigateur

Chrome DevTools : F12 → Onglet Console → Chercher :

Refused to load the script 'https://js.stripe.com/v3/' because it violates the following Content Security Policy directive...

Firefox : F12 → Onglet Réseau, puis regardez les en-têtes de réponse CSP.

Étape 3 : Ajouter les sources nécessaires via csp_whitelist.xml

Voici un exemple pour Stripe et PayPal :

<!-- app/code/Vendor/Module/etc/csp_whitelist.xml -->
<csp_policies>
    <policy id="script-src">
        <values>
            <value id="stripe" type="host">https://js.stripe.com</value>
            <value id="paypal" type="host">https://www.paypal.com</value>
        </values>
    </policy>
    <policy id="frame-src">
        <values>
            <value id="paypal-iframe" type="host">https://www.paypalobjects.com</value>
        </values>
    </policy>
</csp_policies>

💡 Astuce : Pensez à tester aussi les URL des solutions de livraison, analytics ou A/B testing si vous en utilisez.

4. Bonnes pratiques pour éviter les blocages

✔️ Préférez les fichiers JS externes aux scripts inline
✔️ Utilisez des nonce ou des hashes pour les scripts nécessaires
✔️ Testez sur un environnement de préproduction avec Report-Only
✔️ Gardez vos extensions à jour : certaines nécessitent une adaptation CSP

Conclusion : Sécurité et expérience utilisateur ne sont pas incompatibles

La mise en œuvre stricte de la CSP depuis Magento 2.4.7 est une avancée majeure en matière de sécurité.
Cependant, mal configurée, elle peut bloquer des fonctionnalités critiques, notamment dans le checkout.

🎯 Recommandations clés :

• Activez le mode Report-Only avant toute mise en production
• Auditez les scripts et iframes utilisés dans votre site
• Ajustez vos règles via csp_whitelist.xml
• Testez minutieusement les parcours utilisateurs

🚨 Votre site utilise Magento 2.4.7 ou supérieur ?

Avant toute mise en ligne, auditez vos politiques CSP : cela vous évitera des paniers vides, des erreurs de paiement ou des pertes de données analytics. TBDGroup est à votre disposition pour réaliser cette tâche.