Configuration de la Content Security Policy (CSP)

Liste d’autorisation de domaines et configuration des en-têtes pour les proxys inverses, pare-feu et réseaux appliquant des politiques de sécurité strictes

La Content Security Policy (CSP) est une norme de sécurité qui aide à prévenir les attaques de cross-site scripting (XSS) en contrôlant les ressources qu’une page web est autorisée à charger. Mintlify fournit une CSP par défaut qui protège la plupart des sites. Si vous hébergez votre documentation derrière un proxy inverse ou un pare-feu qui remplace la CSP par défaut, vous devrez peut-être configurer les en-têtes CSP pour que les fonctionnalités fonctionnent correctement.

​

Directives CSP

Les directives CSP suivantes permettent de contrôler quelles ressources peuvent être chargées :

• script-src : Détermine quels scripts peuvent être exécutés
• style-src : Détermine quelles feuilles de style peuvent être chargées
• font-src : Détermine quelles polices peuvent être chargées
• img-src : Détermine quelles images, icônes et logos peuvent être chargés
• connect-src : Détermine quelles URL peuvent être contactées pour les appels API et les connexions WebSocket
• frame-src : Détermine quelles URL peuvent être intégrées dans des cadres ou des iframes
• default-src : Valeur par défaut utilisée pour les autres directives lorsqu’elles ne sont pas explicitement définies

​

Liste d’autorisations de domaines

Domaine	Finalité	Directive CSP	Obligatoire
d4tuoctqmanu0.cloudfront.net	CSS et polices KaTeX	style-src, font-src	Obligatoire
*.mintlify.dev	Contenu de la documentation	connect-src, frame-src	Obligatoire
*.mintlify.com	Tableau de bord, API, proxy d’analyses	connect-src	Obligatoire
leaves.mintlify.com	API Assistant	connect-src	Obligatoire
d3gk2c5xim1je2.cloudfront.net	Icônes, images, logos	img-src	Obligatoire
d1ctpt7j8wusba.cloudfront.net	Fichiers de version et de publication Mint	connect-src	Obligatoire
mintcdn.com	Images, favicons	img-src, connect-src	Obligatoire
*.mintcdn.com	Images, favicons	img-src, connect-src	Obligatoire
api.mintlifytrieve.com	API de recherche	connect-src	Obligatoire
cdn.jsdelivr.net	Ressources d’emojis pour images OG	script-src, img-src	Obligatoire
fonts.googleapis.com	Google Fonts	style-src, font-src	Optionnel
www.googletagmanager.com	Google Analytics/GTM	script-src, connect-src	Optionnel
cdn.segment.com	Analyses Segment	script-src, connect-src	Optionnel
plausible.io	Analyses Plausible	script-src, connect-src	Optionnel
us.posthog.com	Analyses PostHog	connect-src	Optionnel
cdn.getkoala.com	Analyses Koala	script-src	Optionnel
tag.clearbitscripts.com	Suivi Clearbit	script-src	Optionnel
cdn.heapanalytics.com	Analyses Heap	script-src	Optionnel
chat.cdn-plain.com	Widget de chat Plain	script-src	Optionnel
chat-assets.frontapp.com	Widget de chat Front	script-src	Optionnel
browser.sentry-cdn.com	Suivi des erreurs Sentry	script-src, connect-src	Optionnel
js.sentry-cdn.com	SDK JavaScript Sentry	script-src	Optionnel

​

Exemple de configuration CSP

N’incluez que les domaines des services que vous utilisez. Supprimez tous les domaines d’analytics que vous n’avez pas configurés pour votre documentation.

Content-Security-Policy:
default-src 'self';
script-src 'self' 'unsafe-inline' 'unsafe-eval' cdn.jsdelivr.net www.googletagmanager.com cdn.segment.com plausible.io
us.posthog.com cdn.getkoala.com tag.clearbitscripts.com cdn.heapanalytics.com chat.cdn-plain.com chat-assets.frontapp.com
browser.sentry-cdn.com js.sentry-cdn.com;
style-src 'self' 'unsafe-inline' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com;
font-src 'self' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com;
img-src 'self' data: blob: d3gk2c5xim1je2.cloudfront.net mintcdn.com *.mintcdn.com cdn.jsdelivr.net;
connect-src 'self' *.mintlify.dev *.mintlify.com d1ctpt7j8wusba.cloudfront.net mintcdn.com *.mintcdn.com
api.mintlifytrieve.com www.googletagmanager.com cdn.segment.com plausible.io us.posthog.com browser.sentry-cdn.com;
frame-src 'self' *.mintlify.dev;

​

Configurations courantes selon le type de proxy

La plupart des serveurs proxy inverses prennent en charge l’ajout d’en-têtes personnalisés.

​

Configuration de Cloudflare

Créez une règle de transformation des en-têtes de réponse :

1. Dans votre tableau de bord Cloudflare, allez à Rules > Overview.
2. Sélectionnez Create rule > Response Header Transform Rule.
3. Configurez la règle :

• Modify response header: Set static
  • Header name: Content-Security-Policy
  • Header value:
    default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' cdn.jsdelivr.net; style-src 'self' 'unsafe-inline' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com; font-src 'self' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com; img-src 'self' data: blob: d3gk2c5xim1je2.cloudfront.net mintcdn.com *.mintcdn.com cdn.jsdelivr.net; connect-src 'self' *.mintlify.dev *.mintlify.com d1ctpt7j8wusba.cloudfront.net mintcdn.com *.mintcdn.com api.mintlifytrieve.com; frame-src 'self' *.mintlify.dev;
    

4. Déployez la règle.

​

Configuration de AWS CloudFront

Ajoutez une stratégie d’en-têtes de réponse dans CloudFront :

{
"ResponseHeadersPolicy": {
    "Name": "MintlifyCSP",
    "Config": {
    "SecurityHeadersConfig": {
        "ContentSecurityPolicy": {
        "ContentSecurityPolicy": "default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' cdn.jsdelivr.net; style-src 'self' 'unsafe-inline' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com; font-src 'self' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com; img-src 'self' data: blob: d3gk2c5xim1je2.cloudfront.net mintcdn.com *.mintcdn.com cdn.jsdelivr.net; connect-src 'self' *.mintlify.dev *.mintlify.com d1ctpt7j8wusba.cloudfront.net mintcdn.com *.mintcdn.com api.mintlifytrieve.com; frame-src 'self' *.mintlify.dev;",
        "Override": true
        }
      }
    }
  }
}

​

Configuration de Vercel

Ajoutez ceci à votre vercel.json :

{
"headers": [
    {
    "source": "/(.*)",
    "headers": [
        {
        "key": "Content-Security-Policy",
        "value": "default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' cdn.jsdelivr.net; style-src 'self' 'unsafe-inline' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com; font-src 'self' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com; img-src 'self' data: blob: d3gk2c5xim1je2.cloudfront.net mintcdn.com *.mintcdn.com cdn.jsdelivr.net; connect-src 'self' *.mintlify.dev *.mintlify.com d1ctpt7j8wusba.cloudfront.net mintcdn.com *.mintcdn.com api.mintlifytrieve.com; frame-src 'self' *.mintlify.dev;"
        }
      ]
    }
  ]
}

​

Dépannage

Identifiez les violations de la CSP dans la console de votre navigateur :

1. Ouvrez les outils de développement de votre navigateur.
2. Allez dans l’onglet Console.
3. Recherchez les erreurs commençant par :
   • Content Security Policy: The page's settings blocked the loading of a resource
   • Refused to load the script/stylesheet because it violates the following Content Security Policy directive
   • Refused to connect to because it violates the following Content Security Policy directive