En-têtes de la politique de sécurité du contenu
La politique de sécurité du contenu (Content-Security-Policy) renforce la sécurité en limitant la manière et l’endroit où le contenu peut être chargé sur votre site web. Cet article de référence explique quels en-têtes de la politique de sécurité du contenu sont nécessaires avec le SDK Web.
Cet article est destiné aux développeurs travaillant sur des sites web qui appliquent des règles CSP et s’intègrent à Braze. Il ne constitue pas un guide sur la manière dont vous devez aborder la sécurité.
Ce guide utilise des exemples de code du SDK Web de Braze 4.0.0+. Pour passer à la dernière version du SDK Web, consultez le Guide de mise à niveau du SDK.
Attributs nonce
Si vous utilisez une valeur nonce dans vos directives script-src ou style-src, transmettez cette valeur à l’option d’initialisation contentSecurityNonce pour la propager aux scripts et styles nouvellement créés par le SDK :
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
});
Directives
connect-src
Votre URL doit correspondre à l’endpoint du SDK API de l’option d’initialisation baseUrl que vous avez choisie.
| URL | Information |
|---|---|
connect-src https://sdk.iad-01.braze.com |
Permet au SDK de communiquer avec les API de Braze. Modifiez cette URL pour qu’elle corresponde à l’endpoint du SDK API de l’option d’initialisation baseUrl que vous avez choisie. |
script-src
| URL | Information |
|---|---|
script-src https://js.appboycdn.com |
Requis lors de l’utilisation de l’intégration hébergée par le CDN. |
script-src 'unsafe-eval' |
Requis lors de l’utilisation de l’extrait de code d’intégration qui contient une référence à appboyQueue. Pour éviter d’utiliser cette directive, intégrez le SDK à l’aide de NPM. |
script-src 'nonce-...'ou script-src 'unsafe-inline' |
Requis pour certains messages in-app, tels que le HTML personnalisé. |
img-src
| URL | Information |
|---|---|
img-src: appboy-images.com braze-images.com cdn.braze.com cdn.braze.eu |
Requis lors de l’utilisation d’images hébergées par le CDN de Braze. Incluez les quatre noms d’hôte CDN pour garantir le chargement correct des images sur tous les clusters du tableau de bord. Important : Si vous utilisez des polices personnalisées, vous devez également inclure font-src. |
Noms d’hôte CDN
Ajoutez tous les noms d’hôte suivants à votre directive img-src :
appboy-images.combraze-images.comcdn.braze.comcdn.braze.eu
Font Awesome
Pour désactiver l’inclusion automatique de Font Awesome, utilisez l’option d’initialisation doNotLoadFontAwesome :
1
2
3
4
5
6
import * as braze from "@braze/web-sdk";
braze.initialize(apiKey, {
baseUrl: baseUrl,
doNotLoadFontAwesome: true,
});
Si vous choisissez d’utiliser Font Awesome, les directives CSP suivantes sont requises :
font-src https://use.fontawesome.comstyle-src https://use.fontawesome.comstyle-src 'nonce-...'oustyle-src 'unsafe-inline'