# Content Security Policy

> What to allow if your site sends a Content-Security-Policy header.

If your site sends a `Content-Security-Policy`, add the hosts below. The [tracking SDK](#tracking-sdk) needs its own two entries.

## Messenger and support form

Add the widget host to these directives. Without them the browser blocks the widget and nothing shows.

| Directive | Add | Why |
|---|---|---|
| `script-src` | `https://widget.customercatalyst.io` | Loads `messenger.js` / `form.js`. |
| `connect-src` | `https://widget.customercatalyst.io` | Settings, sending, conversations and file downloads. |
| `frame-src` | `https://widget.customercatalyst.io` | The security check runs in a small frame on our host. |
| `style-src` | `'unsafe-inline'` | The widgets bring their styles as a `<style>` element inside their Shadow DOM. |
| `img-src` | `data:`, and your logo's host, e.g. `https://*.cdn.bubble.io` | `data:` draws the arrow on list fields. The logo host only if you set a logo; logos uploaded in CustomerCatalyst are served from Bubble's file storage. |

For example:

```
Content-Security-Policy:
  script-src 'self' https://widget.customercatalyst.io;
  connect-src 'self' https://widget.customercatalyst.io;
  frame-src https://widget.customercatalyst.io;
  style-src 'self' 'unsafe-inline';
  img-src 'self' data: https://*.cdn.bubble.io
```

Merge these into your existing policy rather than replacing it.

### Cloudflare Turnstile

The Turnstile security check loads from `https://challenges.cloudflare.com`, but inside our own frame on `widget.customercatalyst.io`, which has its own policy. Your page doesn't load anything from `challenges.cloudflare.com`, so your policy doesn't need it.

### Fonts

The widgets load no web fonts. With **Inter** chosen, they use Inter when the visitor's device has it.

## Tracking SDK

`customercatalyst.js` loads from our CDN and sends events to the CustomerCatalyst API host, with `fetch` and, when the page is hidden or closed, `navigator.sendBeacon`. Both are covered by `connect-src`.

| Directive | Add | Why |
|---|---|---|
| `script-src` | `https://cdn.customercatalyst.io` | Loads `customercatalyst.js`. |
| `connect-src` | `https://xfjgmzwigomtfmaloeun.supabase.co` | Sends events. |

The tracking script loads no styles, fonts or frames.
