Was sind CSP-Fehler?
Content Security Policy (CSP) ist eine Sicherheitsfunktion, die steuert, welche Ressourcen (wie Skripte oder Bilder) auf Ihrer Website geladen werden dürfen. Wenn die CSP-Konfiguration Ihrer Seite zu restriktiv ist, kann sie Ressourcen von Intercom-Domains blockieren. Beispiele für solche Einschränkungen sind, dass Help Center-Artikel leer erscheinen oder unendliche Ladeanimationen beim Versuch, Inhalte zu öffnen, angezeigt werden.
Dies kann wichtige Funktionen stören und Probleme verursachen wie:
Blockierte Bild-Uploads: Bilder können in Product Tours oder im Messenger nicht geladen werden.
Unresponsive Product Tours: Änderungen an einer Product Tour können nicht gespeichert werden.
Defekte Darstellungen: Intercom-Komponenten, wie Logos, können als defekte Bilder erscheinen.
Help Center-Probleme: Artikel können leer oder teilweise gerendert erscheinen oder unendliche Ladeanimationen auftreten.
CSP-Fehler identifizieren
Um zu bestätigen, dass CSP Probleme mit Intercom auf Ihrer Seite verursacht, müssen Sie die Entwicklerkonsole Ihres Browsers überprüfen.
Öffnen Sie die Entwicklertools in Ihrem Browser (normalerweise durch Drücken von F12 oder Rechtsklick und Auswahl von Inspect).
Navigieren Sie zum Tab Console.
Reproduzieren Sie das Problem auf Ihrer Seite, zum Beispiel indem Sie versuchen, ein Bild hochzuladen oder eine Product Tour zu speichern.
Suchen Sie in der Konsole nach roten Fehlermeldungen, die auf eine CSP-Verletzung hinweisen. Diese Meldungen erwähnen oft blockierte Anfragen an Intercom-Domains (z. B.
uploads.intercomcdn.com,*.intercom.io) und die spezifische CSP-Direktive, die die Blockierung verursacht hat, wieconnect-srcoderimg-src. Beispiel-Fehler:Refused to load the script 'https://widget.intercom.io' because it violates the following Content Security Policy directive: "script-src 'self'".
CSP-Fehler beheben
Um diese Fehler zu beheben, müssen Sie die CSP-Konfiguration Ihrer Seite aktualisieren, um Ressourcen von den erforderlichen Intercom-Domains zuzulassen.
1. Aktualisieren Sie Ihre CSP-Direktiven
Fehler-Direktive lokalisieren: Identifizieren Sie in der Entwicklerkonsole, welche Direktive die Einschränkung verursacht hat (z. B.
img-src).Intercom-Domains auf die Whitelist setzen: Fügen Sie die erforderlichen Intercom-URLs zu den relevanten Direktiven in der CSP-Konfiguration Ihrer Seite hinzu.
Wichtig: Sie müssen in der Regel die Intercom-Domains zu folgenden Direktiven hinzufügen:
connect-src: Für Kernfunktionen.img-src: Für Bilder und Anhänge.media-src: Für Medienressourcen.
Die hinzuzufügenden Domains sind *.intercomcdn.com und *.intercom.io. Für die aktuellste Domainliste konsultieren Sie stets die offizielle Dokumentation von Intercom.
Fügen Sie außerdem intercom-sheets.com in der frame-src-Direktive hinzu, um das ordnungsgemäße Laden von Artikel-Viewer-Iframes sicherzustellen.
2. Überprüfen Sie die Sicherheitsheader
Zu restriktive Header wie X-Frame-Options oder CSP-frame-ancestors-Einstellungen können ebenfalls die Funktionalität von Intercom beeinträchtigen. Überprüfen Sie diese Einstellungen und passen Sie sie bei Bedarf an.
3. Überprüfen Sie die Netzwerkeinstellungen
Stellen Sie sicher, dass Ihre Netzwerk- oder Firewall-Einstellungen ausgehende Verbindungen zu den Servern von Intercom zulassen. Möglicherweise müssen Sie Ihr IT-Team bitten, die erforderlichen Domains auf die Whitelist zu setzen.
4. Testen Sie Ihre Änderungen
Nachdem Sie Ihre CSP-Konfiguration aktualisiert haben:
Laden Sie die betroffenen Seiten auf Ihrer Website neu und prüfen Sie, ob die Intercom-Funktionen jetzt korrekt funktionieren.
Überwachen Sie die Entwicklerkonsole, um sicherzustellen, dass keine neuen CSP-Verletzungen auftreten.
Führen Sie einen Hard-Refresh in Ihrem Browser durch, um zwischengespeicherte Ressourcen nach Änderungen an der CSP zu löschen.
Hinweise:
Ihr Entwicklungsteam oder Ihre IT-Abteilung muss Sie möglicherweise bei der Umsetzung dieser CSP-Updates unterstützen.
Wenn Sie den Intercom Messenger über GTM integrieren, stellen Sie sicher, dass die GTM-Hosting-Region mit Ihrer Intercom-Hosting-Region übereinstimmt. Für EMEA setzen Sie api_base auf https://api-iam.eu.intercom.io. Wenn Probleme weiterhin bestehen, verwenden Sie den Messenger in einem dedizierten GTM-Tag anstelle von Inline-Skripten.