Quelles sont les erreurs CSP ?
Content Security Policy (CSP) est une fonctionnalité de sécurité qui contrôle quelles ressources (comme les scripts ou images) peuvent être chargées sur votre site. Si la configuration CSP de votre site est trop restrictive, elle peut bloquer les ressources des domaines Intercom. Par exemple, des articles du Help Center peuvent apparaître vides ou des spinners de chargement infinis peuvent survenir lors de l'accès au contenu.
Cela peut perturber des fonctionnalités clés et causer des problèmes tels que :
Téléchargements d'images bloqués : Les images ne peuvent pas être chargées dans les Product Tours ou le Messenger.
Product Tours non réactifs : Les modifications apportées à un Product Tour ne sont pas enregistrées.
Visuels cassés : Les composants Intercom, comme les logos, peuvent apparaître comme des images cassées.
Problèmes du Help Center : Les articles peuvent apparaître vides ou partiellement rendus, ou des spinners de chargement infinis peuvent se produire.
Identifier les erreurs CSP
Pour confirmer que CSP cause des problèmes avec Intercom sur votre site, vous devez vérifier la console développeur de votre navigateur.
Ouvrez les outils développeur de votre navigateur (généralement en appuyant sur F12 ou en cliquant droit et en sélectionnant Inspecter).
Allez à l'onglet Console.
Reproduisez le problème sur votre site, par exemple en essayant de télécharger une image ou d'enregistrer un Product Tour.
Cherchez des messages d'erreur rouges dans la console indiquant une violation CSP. Ces messages mentionnent souvent des requêtes bloquées vers les domaines Intercom (par exemple,
uploads.intercomcdn.com,*.intercom.io) et la directive CSP spécifique qui a causé le blocage, commeconnect-srcouimg-src. Exemple d'erreur :Refus de charger le script 'https://widget.intercom.io' car il viole la directive Content Security Policy suivante : "script-src 'self'".
Résoudre les erreurs CSP
Pour résoudre ces erreurs, vous devez mettre à jour la configuration CSP de votre site pour autoriser les ressources des domaines requis par Intercom.
1. Mettez à jour vos directives CSP
Localisez la directive en erreur : Dans l'erreur de la console développeur, identifiez quelle directive a causé la restriction (par exemple,
img-src).Liste blanche des domaines Intercom : Ajoutez les URL Intercom requises aux directives pertinentes dans la configuration CSP de votre site.
Important : Vous devrez généralement ajouter les domaines Intercom aux directives suivantes :
connect-src: Pour les fonctionnalités principales.img-src: Pour les images et pièces jointes.media-src: Pour les ressources médias.
Les domaines à ajouter sont *.intercomcdn.com et *.intercom.io. Pour la liste de domaines la plus à jour, consultez toujours la documentation officielle d'Intercom.
Incluez également intercom-sheets.com dans la directive frame-src pour assurer le bon chargement des iframes du visualiseur d'articles.
2. Révisez les en-têtes de sécurité
Des en-têtes trop restrictifs comme X-Frame-Options ou les paramètres CSP frame-ancestors peuvent aussi impacter la fonctionnalité d’Intercom. Vérifiez ces paramètres et ajustez-les si nécessaire.
3. Vérifiez les paramètres réseau
Assurez-vous que les paramètres réseau ou pare-feu autorisent les connexions sortantes vers les serveurs Intercom. Vous devrez peut-être demander à votre équipe IT de mettre les domaines nécessaires en liste blanche.
4. Testez vos modifications
Après avoir mis à jour votre configuration CSP :
Rechargez les pages affectées de votre site et vérifiez si les fonctionnalités d'Intercom fonctionnent correctement.
Surveillez la console développeur pour vous assurer qu'aucune nouvelle violation CSP n'apparaît.
Effectuez un rafraîchissement complet dans votre navigateur pour vider le cache après avoir modifié la CSP.
Notes :
Votre équipe de développement ou département IT pourrait devoir aider à mettre en œuvre ces mises à jour CSP.
Lors de l'intégration d'Intercom Messenger via GTM, assurez-vous que la région d'hébergement GTM correspond à votre région d'hébergement Intercom. Pour EMEA, définissez api_base sur https://api-iam.eu.intercom.io. Si les problèmes persistent, déployez Messenger dans une balise GTM dédiée plutôt que dans des scripts inline.