# Directives (/en/docs/web-security/policies/content-security-policy/introduction/csp-directives)



A Content Security Policy (CSP) is built from directives. Each directive names
one resource type or behavior and sets the rule for it: which script hosts are
allowed, who may frame the page, where the policy reports to. This page groups
every directive by category and links each one to its own reference, so you can
find the right directive for what you need to control.

For the rest of the policy syntax, see the
[values](/en/docs/web-security/policies/content-security-policy/introduction/csp-values)
a directive accepts and the
[headers](/en/docs/web-security/policies/content-security-policy/introduction/csp-headers)
that deliver it.

## Fetch directives [#fetch-directives]

Fetch directives control where a page may load a given resource type from. They
all take a space-separated source list (or `'none'`) and, unless noted below,
fall back to
[default-src](/en/docs/web-security/policies/content-security-policy/directives/default-src)
when you do not set them.

| Directive                                                                                              | Controls                                           | Falls back to |
| ------------------------------------------------------------------------------------------------------ | -------------------------------------------------- | ------------- |
| [default-src](/en/docs/web-security/policies/content-security-policy/directives/default-src)           | The fallback source list for most fetch directives | nothing       |
| [script-src](/en/docs/web-security/policies/content-security-policy/directives/script-src)             | JavaScript: elements, inline, eval, handlers       | `default-src` |
| [script-src-elem](/en/docs/web-security/policies/content-security-policy/directives/script-src-elem)   | `<script>` elements                                | `script-src`  |
| [script-src-attr](/en/docs/web-security/policies/content-security-policy/directives/script-src-attr)   | Inline event handler attributes                    | `script-src`  |
| [style-src](/en/docs/web-security/policies/content-security-policy/directives/style-src)               | Stylesheets and inline styles                      | `default-src` |
| [style-src-elem](/en/docs/web-security/policies/content-security-policy/directives/style-src-elem)     | `<style>` and `<link rel=stylesheet>`              | `style-src`   |
| [style-src-attr](/en/docs/web-security/policies/content-security-policy/directives/style-src-attr)     | Inline `style=` attributes                         | `style-src`   |
| [img-src](/en/docs/web-security/policies/content-security-policy/directives/img-src)                   | Images and favicons                                | `default-src` |
| [font-src](/en/docs/web-security/policies/content-security-policy/directives/font-src)                 | `@font-face` loads                                 | `default-src` |
| [media-src](/en/docs/web-security/policies/content-security-policy/directives/media-src)               | `<audio>`, `<video>`, `<track>`                    | `default-src` |
| [object-src](/en/docs/web-security/policies/content-security-policy/directives/object-src)             | `<object>` and `<embed>`                           | `default-src` |
| [connect-src](/en/docs/web-security/policies/content-security-policy/directives/connect-src)           | fetch, XHR, WebSocket, EventSource, Beacon         | `default-src` |
| [manifest-src](/en/docs/web-security/policies/content-security-policy/directives/manifest-src)         | Web app manifest                                   | `default-src` |
| [frame-src](/en/docs/web-security/policies/content-security-policy/directives/frame-src)               | `<frame>` and `<iframe>` sources                   | `child-src`   |
| [child-src](/en/docs/web-security/policies/content-security-policy/directives/child-src)               | Fallback for frame-src and worker-src              | `default-src` |
| [worker-src](/en/docs/web-security/policies/content-security-policy/directives/worker-src)             | Worker, SharedWorker, ServiceWorker scripts        | `child-src`   |
| [prefetch-src](/en/docs/web-security/policies/content-security-policy/directives/prefetch-src)         | Prefetched and prerendered resources               | `default-src` |
| [fenced-frame-src](/en/docs/web-security/policies/content-security-policy/directives/fenced-frame-src) | `<fencedframe>` sources                            | `frame-src`   |

`prefetch-src` is deprecated and removed from Chromium, and `fenced-frame-src` is
experimental and Chromium-only; the directive pages cover the current status of
each.

## Document directives [#document-directives]

These directives govern properties of the document itself rather than a fetch.
None of them fall back to `default-src`.

| Directive                                                                                      | Controls                               |
| ---------------------------------------------------------------------------------------------- | -------------------------------------- |
| [base-uri](/en/docs/web-security/policies/content-security-policy/directives/base-uri)         | The URLs a `<base href>` may set       |
| [sandbox](/en/docs/web-security/policies/content-security-policy/directives/sandbox)           | Applies sandbox flags to the document  |
| [plugin-types](/en/docs/web-security/policies/content-security-policy/directives/plugin-types) | Allowed plugin MIME types (deprecated) |

`base-uri` has no fallback, so omitting it leaves the page open to base-tag
injection. `sandbox` takes sandbox tokens rather than a source list and cannot be
set through a `<meta>` tag. `plugin-types` is deprecated; use `object-src 'none'`
instead.

## Navigation directives [#navigation-directives]

Navigation directives restrict where the page may navigate and who may navigate
to it. Neither falls back to `default-src`.

| Directive                                                                                            | Controls                          |
| ---------------------------------------------------------------------------------------------------- | --------------------------------- |
| [form-action](/en/docs/web-security/policies/content-security-policy/directives/form-action)         | Allowed `<form action>` targets   |
| [frame-ancestors](/en/docs/web-security/policies/content-security-policy/directives/frame-ancestors) | Which parents may embed this page |

`frame-ancestors` is the anti-clickjacking directive and supersedes
[X-Frame-Options](/en/docs/web-security/security-headers/x-frame-options).
It also cannot be set through a `<meta>` tag.

## Reporting directives [#reporting-directives]

Reporting directives say where the browser should send violation reports. They
are configured per policy and have no fallback.

| Directive                                                                                  | Controls                                                               |
| ------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------- |
| [report-to](/en/docs/web-security/policies/content-security-policy/directives/report-to)   | Names a reporting endpoint group from the Reporting API                |
| [report-uri](/en/docs/web-security/policies/content-security-policy/directives/report-uri) | Posts reports directly to a URI (deprecated, keep alongside report-to) |

`report-to` references a group defined in the
[Reporting-Endpoints](/en/docs/web-security/reporting-api/headers/reporting-endpoints) header.
`report-uri` is the legacy mechanism and is ignored where `report-to` is
supported. `report-to` recently became available across current Chrome, Firefox,
and Safari, so keep `report-uri` only for old browser versions. See the
[CSP headers overview](/en/docs/web-security/policies/content-security-policy/introduction/csp-headers)
for how the wiring fits together.

## WebRTC directives [#webrtc-directives]

WebRTC traffic is not covered by any fetch directive, so the spec draft adds a
dedicated directive for it. It takes `'allow'` or `'block'` rather than a
source list.

| Directive                                                                          | Controls                                               |
| ---------------------------------------------------------------------------------- | ------------------------------------------------------ |
| [webrtc](/en/docs/web-security/policies/content-security-policy/directives/webrtc) | WebRTC connections (spec-only, no browser support yet) |

## Other directives and Trusted Types [#other-directives-and-trusted-types]

These directives do not fit the categories above. None fall back to
`default-src`.

* [upgrade-insecure-requests](/en/docs/web-security/policies/content-security-policy/directives/upgrade-insecure-requests):
  a flag directive that rewrites insecure subresource and navigation URLs to
  HTTPS. It does not replace [HSTS](/en/docs/web-security/security-headers/strict-transport-security).
* [block-all-mixed-content](/en/docs/web-security/policies/content-security-policy/directives/block-all-mixed-content):
  a flag directive that blocks every HTTP subresource on an HTTPS page. It is
  deprecated, superseded by `upgrade-insecure-requests` and default mixed-content
  blocking.
* [require-trusted-types-for](/en/docs/web-security/policies/content-security-policy/directives/require-trusted-types-for):
  forces Trusted Types at DOM XSS sinks; its value is the token `'script'`.
  Recently became available across current Chrome, Firefox, and Safari.
* [trusted-types](/en/docs/web-security/policies/content-security-policy/directives/trusted-types):
  an allowlist of Trusted Types policy names that constrains which policies the page
  may create. Recently became available across current Chrome, Firefox, and Safari.

## Removed directives [#removed-directives]

Three directives were dropped from the platform without shipping and keep a
short reference page each, since they still appear in old policies and blog
posts.

| Directive                                                                                            | Status        | What replaced it                                                               |
| ---------------------------------------------------------------------------------------------------- | ------------- | ------------------------------------------------------------------------------ |
| [navigate-to](/en/docs/web-security/policies/content-security-policy/directives/navigate-to)         | ⚠️ Deprecated | Nothing                                                                        |
| [referrer](/en/docs/web-security/policies/content-security-policy/directives/referrer)               | ⚠️ Deprecated | The `Referrer-Policy` header                                                   |
| [require-sri-for](/en/docs/web-security/policies/content-security-policy/directives/require-sri-for) | ⚠️ Deprecated | The [Integrity-Policy](/en/docs/web-security/policies/integrity-policy) header |

A fourth, `disown-opener`, was dropped in favor of
[Cross-Origin-Opener-Policy](/en/docs/web-security/policies/cross-origin-opener-policy)
and does not get a dedicated page. `prefetch-src` and `plugin-types`, listed
above as deprecated, have their own pages too.

## Fallback chains [#fallback-chains]

When a directive is not set, the browser walks a chain to find a rule. The most
common CSP mistake is assuming `default-src` covers everything; it does not cover
the document, navigation, reporting, or Trusted Types directives, so each of
those must be set explicitly.

The graph covers every directive that participates in a fallback chain. ⚠️
marks a deprecated directive, 🧪 an experimental one; the directives with no
fallback are listed after the graph, and each directive page covers its exact
status.

```mermaid
flowchart LR
  FFS["fenced-frame-src 🧪"] --> FS["frame-src"]
  FS --> CS["child-src"]
  WS["worker-src"] --> CS
  SSE["script-src-elem"] --> SS["script-src"]
  SSA["script-src-attr"] --> SS
  CS -->|workers only| SS
  STE["style-src-elem"] --> ST["style-src"]
  STA["style-src-attr"] --> ST
  CS --> DS["default-src"]
  SS --> DS
  ST --> DS
  IMG["img-src"] --> DS
  FNT["font-src"] --> DS
  MED["media-src"] --> DS
  OBJ["object-src"] --> DS
  CON["connect-src"] --> DS
  MAN["manifest-src"] --> DS
  PFS["prefetch-src ⚠️"] --> DS
```

* `script-src-elem` and `script-src-attr` to `script-src` to `default-src`; the
  `-attr` variant skips `-elem` and falls back straight to `script-src`
* `style-src-elem` and `style-src-attr` to `style-src` to `default-src`, with
  the same skip
* `frame-src` to `child-src` to `default-src`
* `worker-src` to `child-src` to `script-src` to `default-src`; the `child-src`
  to `script-src` hop applies to worker loads only
* `fenced-frame-src` (experimental, Chromium-only) to `frame-src` to
  `child-src` to `default-src`
* `connect-src`, `font-src`, `img-src`, `manifest-src`, `media-src`,
  `object-src`, and the deprecated `prefetch-src` each fall back to
  `default-src`
* No fallback (set these explicitly): `base-uri`, `form-action`,
  `frame-ancestors`, `sandbox`, `report-uri`, `report-to`,
  `upgrade-insecure-requests`, `block-all-mixed-content`,
  `require-trusted-types-for`, `trusted-types`, `webrtc`

To check which directives a real policy is missing, run it through the
[CSP evaluator](/tools/csp-evaluator), or scan a live page for its headers with
the [CSP scanner](/tools/csp-scanner).

## See also [#see-also]

* [What is CSP](/en/docs/web-security/policies/content-security-policy/introduction/what-is-csp)
* [CSP values](/en/docs/web-security/policies/content-security-policy/introduction/csp-values)
* [CSP headers](/en/docs/web-security/policies/content-security-policy/introduction/csp-headers)
* [CSP suite](/platform/csp-builder)

## Sources [#sources]

* [MDN, Content-Security-Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Content-Security-Policy)
* [W3C, Content Security Policy Level 3](https://www.w3.org/TR/CSP3/)
* [web.dev, Mitigate cross-site scripting with a strict CSP](https://web.dev/articles/strict-csp)
