Configuration de la Content Security Policy (CSP)

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 reverse proxy ou un pare-feu qui remplace la CSP par défaut, vous devrez peut-être configurer les en-têtes CSP pour que certaines fonctionnalités fonctionnent correctement.

Directives CSP

Les directives CSP suivantes contrôlent quelles ressources une page peut charger :

script-src : contrôle les scripts pouvant s’exécuter
style-src : contrôle les feuilles de style pouvant se charger
font-src : contrôle les polices pouvant se charger
img-src : contrôle les images, icônes et logos pouvant se charger
connect-src : contrôle les URL auxquelles il est possible de se connecter pour les appels à l’API et les connexions WebSocket
frame-src : contrôle les URL pouvant être intégrées dans des frames ou des iframes
default-src : valeur de repli pour les autres directives lorsqu’elles ne sont pas explicitement définies

Liste d’autorisation des domaines

Domaine	Finalité	Directive CSP	Obligatoire
`d4tuoctqmanu0.cloudfront.net`	CSS et polices KaTeX	`style-src`, `font-src`	Obligatoire
`*.mintlify.site`	Contenu de la documentation	`connect-src`, `frame-src`	Obligatoire
`*.mintlify.com`	Dashboard, API, proxy d’Analytics	`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
`cdn.jsdelivr.net`	Ressources emoji pour images OG	`script-src`, `img-src`	Obligatoire
`mintlify.s3.us-west-1.amazonaws.com`	Images hébergées sur S3	`img-src`	Obligatoire
`hcaptcha.com`	Vérification CAPTCHA hCaptcha	`script-src`, `frame-src`, `style-src`, `connect-src`, `unsafe-eval`, `unsafe-inline`	Obligatoire
`*.hcaptcha.com`	Vérification CAPTCHA hCaptcha	`script-src`, `frame-src`, `style-src`, `connect-src`, `unsafe-eval`, `unsafe-inline`	Obligatoire
`fonts.googleapis.com`	Google Fonts	`style-src`, `font-src`	Facultatif
`www.googletagmanager.com`	Google Analytics/Google Tag Manager (GTM)	`script-src`, `connect-src`	Facultatif
`cdn.segment.com`	Segment Analytics	`script-src`, `connect-src`	Facultatif
`plausible.io`	Plausible Analytics	`script-src`, `connect-src`	Facultatif
`us.posthog.com`	PostHog Analytics	`connect-src`	Facultatif
`tag.clearbitscripts.com`	Suivi Clearbit	`script-src`	Facultatif
`cdn.heapanalytics.com`	Heap Analytics	`script-src`	Facultatif
`chat.cdn-plain.com`	Widget de chat Plain	`script-src`	Facultatif
`chat-assets.frontapp.com`	Widget de chat Front	`script-src`	Facultatif
`browser.sentry-cdn.com`	Suivi des erreurs Sentry	`script-src`, `connect-src`	Facultatif
`js.sentry-cdn.com`	SDK JavaScript Sentry	`script-src`	Facultatif

Exemple de configuration CSP

Incluez uniquement les domains des services que vous utilisez. Supprimez tous les domains 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 tag.clearbitscripts.com cdn.heapanalytics.com chat.cdn-plain.com chat-assets.frontapp.com
browser.sentry-cdn.com js.sentry-cdn.com hcaptcha.com *.hcaptcha.com;
style-src 'self' 'unsafe-inline' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com hcaptcha.com *.hcaptcha.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 mintlify.s3.us-west-1.amazonaws.com;
connect-src 'self' *.mintlify.site *.mintlify.com d1ctpt7j8wusba.cloudfront.net mintcdn.com *.mintcdn.com
www.googletagmanager.com cdn.segment.com plausible.io us.posthog.com browser.sentry-cdn.com hcaptcha.com *.hcaptcha.com;
frame-src 'self' *.mintlify.site hcaptcha.com *.hcaptcha.com;

Configurations courantes selon le type de proxy

La plupart des reverse proxies prennent en charge l’ajout d’en-têtes personnalisés.

Configuration Cloudflare

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

Dans votre Dashboard Cloudflare, accédez à Rules > Overview.
Sélectionnez Create rule > Response Header Transform Rule.
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 hcaptcha.com *.hcaptcha.com; style-src 'self' 'unsafe-inline' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com hcaptcha.com *.hcaptcha.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 mintlify.s3.us-west-1.amazonaws.com; connect-src 'self' *.mintlify.site *.mintlify.com d1ctpt7j8wusba.cloudfront.net mintcdn.com *.mintcdn.com hcaptcha.com *.hcaptcha.com; frame-src 'self' *.mintlify.site hcaptcha.com *.hcaptcha.com;

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 hcaptcha.com *.hcaptcha.com; style-src 'self' 'unsafe-inline' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com hcaptcha.com *.hcaptcha.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 mintlify.s3.us-west-1.amazonaws.com; connect-src 'self' *.mintlify.site *.mintlify.com d1ctpt7j8wusba.cloudfront.net mintcdn.com *.mintcdn.com hcaptcha.com *.hcaptcha.com; frame-src 'self' *.mintlify.site hcaptcha.com *.hcaptcha.com;",
        "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 hcaptcha.com *.hcaptcha.com; style-src 'self' 'unsafe-inline' d4tuoctqmanu0.cloudfront.net fonts.googleapis.com hcaptcha.com *.hcaptcha.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 mintlify.s3.us-west-1.amazonaws.com; connect-src 'self' *.mintlify.site *.mintlify.com d1ctpt7j8wusba.cloudfront.net mintcdn.com *.mintcdn.com hcaptcha.com *.hcaptcha.com; frame-src 'self' *.mintlify.site hcaptcha.com *.hcaptcha.com;"
        }
      ]
    }
  ]
}

Dépannage

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

Ouvrez les outils de développement de votre navigateur.
Accédez à l’onglet Console.
Recherchez des 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

​Directives CSP

​Liste d’autorisation des domaines

​Exemple de configuration CSP

​Configurations courantes selon le type de proxy

​Configuration Cloudflare

​Configuration de AWS CloudFront

​Configuration de Vercel

​Dépannage

Directives CSP

Liste d’autorisation des domaines

Exemple de configuration CSP

Configurations courantes selon le type de proxy

Configuration Cloudflare

Configuration de AWS CloudFront

Configuration de Vercel

Dépannage