mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
mintlify[bot]
f66b301e00
Co-authored-by: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com>
143 lines
7.8 KiB
Plaintext
143 lines
7.8 KiB
Plaintext
---
|
|
title: "Content Security Policy (CSP) configuration"
|
|
sidebarTitle: "CSP configuration"
|
|
description: "Configure Content Security Policy headers to allow Mintlify resources while maintaining security for reverse proxies and strict network policies."
|
|
keywords: ["Content Security Policy", "CSP", "directives", "security headers", "firewall", "XSS prevention"]
|
|
---
|
|
|
|
Content Security Policy (CSP) is a security standard that helps prevent cross-site scripting (XSS) attacks by controlling which resources a web page can load. Mintlify serves a default CSP that protects most sites. If you host your documentation behind a reverse proxy or firewall that overwrites the default CSP, you may need to configure CSP headers for features to function properly.
|
|
|
|
## CSP directives
|
|
|
|
The following CSP directives control which resources a page can load:
|
|
|
|
- `script-src`: Controls which scripts can run
|
|
- `style-src`: Controls which stylesheets can load
|
|
- `font-src`: Controls which fonts can load
|
|
- `img-src`: Controls which images, icons, and logos can load
|
|
- `connect-src`: Controls which URLs can connect to for API calls and WebSocket connections
|
|
- `frame-src`: Controls which URLs can embed in frames or iframes
|
|
- `default-src`: Fallback for other directives when not explicitly set
|
|
|
|
## Domain allowlist
|
|
|
|
{/* vale Vale.Terms = NO */}
|
|
|
|
| Domain | Purpose | CSP directive | Required |
|
|
|:-------|:--------|:--------------|:-------|
|
|
| `d4tuoctqmanu0.cloudfront.net` | KaTeX CSS, fonts | `style-src`, `font-src` | Required |
|
|
| `*.mintlify.site` | Documentation content | `connect-src`, `frame-src` | Required |
|
|
| `*.mintlify.com` | Dashboard, API, analytics proxy | `connect-src` | Required |
|
|
| `leaves.mintlify.com` | Assistant API | `connect-src` | Required |
|
|
| `d3gk2c5xim1je2.cloudfront.net` | Icons, images, logos | `img-src` | Required |
|
|
| `d1ctpt7j8wusba.cloudfront.net` | Mint version and release files | `connect-src` | Required |
|
|
| `mintcdn.com` | Images, favicons | `img-src`, `connect-src` | Required |
|
|
| `*.mintcdn.com` | Images, favicons | `img-src`, `connect-src` | Required |
|
|
| `cdn.jsdelivr.net` | Emoji assets for OG images | `script-src`, `img-src` | Required |
|
|
| `mintlify.s3.us-west-1.amazonaws.com` | S3-hosted images | `img-src` | Required |
|
|
| `hcaptcha.com` | hCaptcha CAPTCHA verification | `script-src`, `frame-src`, `style-src`, `connect-src`, `unsafe-eval`, `unsafe-inline` | Required |
|
|
| `*.hcaptcha.com` | hCaptcha CAPTCHA verification | `script-src`, `frame-src`, `style-src`, `connect-src`, `unsafe-eval`, `unsafe-inline` | Required |
|
|
| `fonts.googleapis.com` | Google Fonts | `style-src`, `font-src` | Optional |
|
|
| `www.googletagmanager.com` | Google Analytics/Google Tag Manager (GTM) | `script-src`, `connect-src` | Optional |
|
|
| `cdn.segment.com` | Segment analytics | `script-src`, `connect-src` | Optional |
|
|
| `plausible.io` | Plausible analytics | `script-src`, `connect-src` | Optional |
|
|
| `us.posthog.com` | PostHog analytics | `connect-src` | Optional |
|
|
| `tag.clearbitscripts.com` | Clearbit tracking | `script-src` | Optional |
|
|
| `cdn.heapanalytics.com` | Heap analytics | `script-src` | Optional |
|
|
| `chat.cdn-plain.com` | Plain chat widget | `script-src` | Optional |
|
|
| `chat-assets.frontapp.com` | Front chat widget | `script-src` | Optional |
|
|
| `browser.sentry-cdn.com` | Sentry error tracking | `script-src`, `connect-src` | Optional |
|
|
| `js.sentry-cdn.com` | Sentry JavaScript SDK | `script-src` | Optional |
|
|
|
|
{/* vale Vale.Terms = YES */}
|
|
|
|
## Example CSP configuration
|
|
|
|
<Note>
|
|
Only include domains for services that you use. Remove any analytics domains that you have not configured for your documentation.
|
|
</Note>
|
|
|
|
```text wrap
|
|
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;
|
|
```
|
|
|
|
## Common configurations by proxy type
|
|
|
|
Most reverse proxies support adding custom headers.
|
|
|
|
### Cloudflare configuration
|
|
|
|
Create a Response Header Transform Rule:
|
|
|
|
1. In your Cloudflare dashboard, go to **Rules > Overview**.
|
|
2. Click **Create rule > Response Header Transform Rule**.
|
|
3. Configure the rule:
|
|
- **Modify response header**: Set static
|
|
- **Header name**: `Content-Security-Policy`
|
|
- **Header value**:
|
|
```text wrap
|
|
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;
|
|
```
|
|
4. Deploy your rule.
|
|
|
|
### AWS CloudFront configuration
|
|
|
|
Add a response headers policy in CloudFront:
|
|
|
|
```json
|
|
{
|
|
"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
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
```
|
|
|
|
### Vercel configuration
|
|
|
|
Add to your `vercel.json`:
|
|
|
|
```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;"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
## Troubleshooting
|
|
|
|
Identify CSP violations in your browser console:
|
|
|
|
1. Open your browser's Developer Tools.
|
|
2. Go to the **Console** tab.
|
|
3. Look for errors starting with:
|
|
- `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`
|