Qu'est-ce que les erreurs CSP ?
CSP est une fonction de sécurité du navigateur qui contrôle les ressources externes pouvant se charger — si elle est configurée de manière trop restrictive, elle peut empêcher le chargement correct du Messenger Intercom, des articles du Help Center, des images, des Product Tours et des médias.
Cela peut perturber des fonctionnalités clés et causer des problèmes tels que :
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 avec le Help Center : Les articles peuvent apparaître vides ou partiellement rendus, ou des spinners de chargement infinis peuvent se produire.
Note : Cet article est pertinent si vous avez installé le Messenger Intercom ou tout produit Intercom JS sur votre site (y compris Product Tours, Surveys, Checklists et News). Si vous utilisez le Help Center autonome hébergé par Intercom (par exemple help.yourco.com), Intercom gère sa propre CSP et la politique de votre site ne s'y applique pas. La mise à jour de votre CSP nécessite un accès à la configuration de votre serveur ou aux en-têtes de réponse HTTP — si vous ne gérez pas directement l'infrastructure de votre site, partagez cet article avec votre équipe de développement ou votre service informatique.
Comment 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 dans votre navigateur (généralement en appuyant sur F12 ou en cliquant droit et en sélectionnant Inspecter).
Naviguez vers 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 des 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'".
Comment 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 la directive qui 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, *.intercom.io et *.intercom-chat.com (nécessaire pour la connexion websocket en direct du Messenger — non couvert par le joker *.intercom.io). Pour la liste de domaines la plus à jour, consultez Using Intercom with Content Security Policy.
Incluez également intercom-sheets.com dans la directive frame-src pour assurer le bon chargement des iframes du visualiseur d'articles.
Note : Si les articles se chargent correctement sur votre Help Center autonome mais apparaissent vides ou ne s'affichent pas lorsqu'ils sont ouverts dans le Messenger, un décalage CSP est la cause la plus probable. Le Messenger affiche les articles dans une iframe — si votre politique bloque frame-src intercom-sheets.com ou connect-src *.intercom.io, le visualiseur d'articles dans le Messenger échouera même si le reste du Messenger se charge. Ajoutez intercom-sheets.com à votre directive frame-src pour résoudre ce problème.
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 d'Intercom. Vous devrez peut-être demander à votre équipe informatique de mettre en liste blanche les domaines nécessaires.
4. Testez vos modifications
Après avoir mis à jour votre configuration CSP :
Rechargez les pages concernées de votre site et vérifiez si les fonctionnalités d'Intercom fonctionnent désormais 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.
Si les fonctionnalités d'Intercom ne fonctionnent toujours pas après un rafraîchissement complet, rouvrez l'onglet Console et vérifiez s'il reste des erreurs de violation CSP. Chaque nouveau message d'erreur indiquera la prochaine directive ou domaine à ajouter — répétez le cycle de mise à jour et de test jusqu'à ce qu'aucune violation n'apparaisse.
Quelles fonctionnalités d'Intercom sont affectées par les erreurs CSP ?
Différentes fonctionnalités d'Intercom sont bloquées par différentes directives CSP. Le tableau ci-dessous associe chaque fonctionnalité Intercom à ses symptômes courants, à la directive CSP qui la bloque et aux domaines à mettre en liste blanche.
Fonctionnalité Intercom | Symptômes | Directive bloquante | Domaine(s) à mettre en liste blanche |
Messenger (widget de chat) | Le widget ne se charge pas ou est invisible | script-src, connect-src | widget.intercom.io, js.intercomcdn.com, *.intercom-chat.com, api-iam.intercom.io (US), api-iam.eu.intercom.io (EU), api-iam.au.intercom.io (AU) |
Help Center | Les articles apparaissent vides ou ne se chargent pas, y compris lorsqu'ils sont consultés dans l'espace Help du Messenger | frame-src, connect-src | intercom-sheets.com, *.intercom.io |
Chargements d'images et pièces jointes | Les images ne se téléchargent pas ou sont cassées | img-src, connect-src | uploads.intercomcdn.com, *.intercomcdn.com |
Product Tours | Les tours ne s'affichent pas ou les modifications ne sont pas enregistrées | script-src, connect-src, img-src | *.intercom.io, *.intercomcdn.com |
Médias (vidéo/audio) | Les fichiers médias ne se lisent pas | media-src, connect-src | *.intercomcdn.com |
Astuce : Si vous voyez plusieurs erreurs dans la console en même temps, commencez par résoudre celles de la directive la plus restrictive (par exemple, script-src bloque plus que img-src). Une correction de directive peut parfois résoudre plusieurs symptômes.
Comment mettre à jour votre CSP pour des fonctionnalités Intercom spécifiques
Utilisez le mode Report-Only pour auditer avant d'appliquer, puis appliquez les changements progressivement par fonctionnalité.
Utilisez d'abord le mode Report-Only
Avant de modifier votre Content Security Policy (CSP) appliquée pour corriger les problèmes Intercom, ajoutez un en-tête Content-Security-Policy-Report-Only en plus de votre politique existante. Cela enregistre les violations sans rien bloquer, vous permettant d'auditer en toute sécurité ce qui doit changer.
Ajoutez l'en-tête Content-Security-Policy-Report-Only suivant aux en-têtes de réponse HTTP de votre serveur (en plus — pas en remplacement — de votre en-tête Content-Security-Policy appliqué) :
Content-Security-Policy-Report-Only:
script-src 'self' https://widget.intercom.io https://js.intercomcdn.com;
connect-src 'self' https://*.intercom.io https://*.intercomcdn.com
https://*.intercom-chat.com wss://*.intercom-chat.com;
img-src 'self' https://*.intercomcdn.com;
media-src 'self' https://*.intercomcdn.com;
frame-src 'self' https://intercom-sheets.com;
Appliquez les changements progressivement
Activez le mode Report-Only et reproduisez le problème.
Notez chaque domaine bloqué dans la sortie de la console.
Ajoutez le(s) domaine(s) requis à la directive pertinente dans votre politique appliquée — une directive à la fois.
Retestez en mode Report-Only pour confirmer qu'aucune nouvelle violation n'apparaît.
Promouvez la modification dans votre en-tête Content-Security-Policy appliqué.
Une fois promue, effectuez un rafraîchissement complet et confirmez que la fonctionnalité Intercom fonctionne comme prévu. Si une nouvelle violation apparaît dans la console, recommencez à l'étape 1 pour la nouvelle directive.
Comment maintenir votre CSP à jour
La configuration CSP n'est pas une correction unique. Intercom met périodiquement à jour son infrastructure et ses exigences de domaine. Suivez les étapes ci-dessous pour garder votre politique à jour.
Surveillez les nouvelles violations
Configurez un point de rapport CSP avec la directive
report-to(une directive CSP qui indique aux navigateurs où envoyer les rapports de violation) pour que les violations soient envoyées automatiquement à un service de journalisation — vous n'aurez pas à vérifier manuellement la console. Note :report-uriest obsolète au profit dereport-to. Lors de l'utilisation dereport-to, vous devez également ajouter un en-tête HTTP compagnonReporting-Endpointspour définir le groupe de points de terminaison.Examinez les rapports de violation après chaque mise à jour d'Intercom ou après avoir déployé des changements dans l'infrastructure de votre site.
Restez à jour avec la liste des domaines d'Intercom
Mettez en favori l'article Using Intercom with Content Security Policy et consultez-le lors des mises à jour majeures d'Intercom.
Abonnez-vous à la page de statut d'Intercom pour être informé des changements d'infrastructure pouvant affecter les domaines requis.
Évitez les pièges courants de gestion
N'utilisez pas unsafe-inline ou unsafe-eval comme raccourci. Ajouter ces valeurs à
script-srcdésactive une grande classe de protection contre les XSS (cross-site scripting) et expose votre site aux attaques par injection de scripts — même temporairement. Utilisez plutôt des nonces (jetons cryptographiques ajoutés à chaque balise script) ou des hachages — Intercom supporte strictement CSPv3 (la troisième version de la norme CSP) avec des politiques basées sur des nonces.Gardez votre CSP sous contrôle de version. Suivez chaque changement avec votre historique de déploiement pour pouvoir revenir en arrière si une modification de directive casse une fonctionnalité.
Testez d'abord dans un environnement de préproduction. Validez toujours les changements CSP avec les fonctionnalités Intercom dans un environnement de préproduction ou de prévisualisation avant de déployer en production.
Note : Si vous intégrez Intercom via Google Tag Manager (GTM), assurez-vous que les entrées script-src et connect-src de votre conteneur GTM sont également incluses dans votre politique — GTM injecte des scripts dynamiquement, ce qui peut déclencher des violations CSP supplémentaires indépendantes des domaines d'Intercom. Si les problèmes persistent après la mise à jour de ces directives, déployez le Messenger Intercom dans une balise GTM dédiée plutôt qu'avec des scripts inline.
Note : Les modifications des en-têtes CSP peuvent être mises en cache par votre CDN ou navigateur. Si vous ne voyez pas le comportement de politique mis à jour après les modifications, videz le cache de votre CDN et effectuez un rafraîchissement complet avant de tester à nouveau.
Notes :
La mise à jour de votre Content Security Policy nécessite un accès à la configuration de votre serveur ou aux en-têtes HTTP. Si vous ne gérez pas directement l'infrastructure de votre site, partagez cet article avec votre équipe de développement ou votre service informatique.
Lors de l'intégration du Messenger Intercom via Google Tag Manager (GTM), assurez-vous que la région d'hébergement GTM correspond à la région de votre espace de travail Intercom. Définissez
api_basesur le point de terminaison de votre région :api-iam.intercom.io(US),api-iam.eu.intercom.io(EU / EMEA — Europe, Moyen-Orient et Afrique), ouapi-iam.au.intercom.io(AU).
