Content-Security-Policy-Header
Die Content-Security-Policy bietet zusätzliche Sicherheit, indem sie einschränkt, wie und wo Inhalte auf Ihrer Website geladen werden können. Dieser Referenzartikel beschreibt, welche Content-Security-Policy-Header beim Web SDK erforderlich sind.
Dieser Artikel richtet sich an Entwickler:innen, die an Websites arbeiten, die CSP-Regeln durchsetzen und mit Braze integriert sind. Er ist nicht als Ratschlag gedacht, wie Sie die Sicherheit angehen sollten.
Diese Anleitung verwendet Codebeispiele aus dem Braze Web SDK 4.0.0+. Um ein Upgrade auf die neueste Web SDK-Version durchzuführen, siehe SDK Upgrade Guide.
Nonce-Attribute
Wenn Sie in den Direktiven script-src oder style-src einen nonce-Wert verwenden, übergeben Sie diesen Wert an die Initialisierungsoption contentSecurityNonce, damit er an neu erstellte Skripte und Stile weitergegeben wird, die vom SDK generiert werden:
1
2
3
4
5
6
import * as braze from "@braze/web-sdk";
braze.initialize(apiKey, {
baseUrl: baseUrl,
contentSecurityNonce: "YOUR-NONCE-HERE", // assumes a "nonce-YOUR-NONCE-HERE" CSP value
});
Direktiven
connect-src
Ihre URL muss mit dem API-SDK-Endpunkt der von Ihnen gewählten baseUrl-Initialisierungsoption übereinstimmen.
| URL | Informationen |
|---|---|
connect-src https://sdk.iad-01.braze.com |
Ermöglicht dem SDK die Kommunikation mit Braze-APIs. Ändern Sie diese URL so, dass sie dem API-SDK-Endpunkt für die von Ihnen gewählte baseUrl-Initialisierungsoption entspricht. |
script-src
| URL | Informationen |
|---|---|
script-src https://js.appboycdn.com |
Erforderlich, wenn Sie die im CDN gehostete Integration verwenden. |
script-src 'unsafe-eval' |
Erforderlich bei Verwendung des Integrations-Snippets, das einen Verweis auf appboyQueue enthält. Wenn Sie diese Direktive nicht verwenden möchten, integrieren Sie das SDK stattdessen mit NPM. |
script-src 'nonce-...'oder script-src 'unsafe-inline' |
Erforderlich für bestimmte In-App-Nachrichten, wie z. B. benutzerdefiniertes HTML. |
img-src
| URL | Informationen |
|---|---|
img-src: appboy-images.com braze-images.com cdn.braze.eu |
Erforderlich bei der Verwendung von Bildern, die im CDN von Braze gehostet werden. Die Hostnamen können je nach Dashboard-Cluster variieren. Wichtig: Wenn Sie angepasste Schriftarten verwenden, müssen Sie auch font-src einbeziehen. |
Font Awesome
Um die automatische Einbindung von Font Awesome zu deaktivieren, verwenden Sie die Initialisierungsoption doNotLoadFontAwesome:
1
2
3
4
5
6
import * as braze from "@braze/web-sdk";
braze.initialize(apiKey, {
baseUrl: baseUrl,
doNotLoadFontAwesome: true,
});
Wenn Sie Font Awesome verwenden möchten, sind die folgenden CSP-Direktiven erforderlich:
font-src https://use.fontawesome.comstyle-src https://use.fontawesome.comstyle-src 'nonce-...'oderstyle-src 'unsafe-inline'