> For the complete documentation index, see [llms.txt](https://huy312100.gitbook.io/software-development/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://huy312100.gitbook.io/software-development/security/security-headers/content-security-policy-csp.md).

# Content Security Policy (CSP)

CSP gives administrators control over the website by limiting the resources that users are allowed to load within the website. Whitelist can be included in website content. If implemented properly, this header will prevent Cross-Site Scripting (XSS), ClickJacking and HTML exploits... Although it does not completely eliminate these attack possibilities, it certainly minimizes the damage. . Most major browsers support CSP.

 Introduced in November 2012, CSP adds a layer of security against many website security vulnerabilities. CSP will become the most important tool for client-side security in the near future, as it can replace security headers such as: X-Frame-Options, X-XSS-Protection, to name a few. not enabled by default. All browsers do not support CSP, so verification is required before implementation.

## CSP Directive Reference <a href="#directive" id="directive"></a>

The `Content-Security-Policy` header value is made up of one or more directives (defined below), multiple directives are separated with a semicolon `;`

This documentation is provided based on the Content Security Policy Level 2 [W3C Recommendation](https://www.w3.org/TR/CSP2/), and the CSP Level 3 [W3C Working Draft](https://www.w3.org/TR/CSP3/)

### `default-src`

The `default-src` directive defines the default policy for fetching resources such as JavaScript, Images, CSS, Fonts, AJAX requests, Frames, HTML5 Media. Not all directives fallback to `default-src`. See the [Source List Reference](https://content-security-policy.com/#source_list) for possible values

```
default-src 'self' cdn.example.com;
```

### `script-src`

Defines valid sources of JavaScript.

```
script-src 'self' js.example.com;
```

### `style-src`

Defines valid sources of stylesheets or CSS

```
style-src 'self' css.example.com;
```

### `img-src`

Defines valid sources of images.

```
img-src 'self' img.example.com;
```

### `connect-src`

Applies to `XMLHttpRequest` (AJAX), `WebSocket`, `fetch()`, `<a ping>` or `EventSource`. If not allowed the browser emulates a `400` HTTP status code.

```
connect-src 'self';
```

### `font-src`

Defines valid sources of font resources (loaded via `@font-face`).

```
font-src font.example.com;
```

### `object-src`

Defines valid sources of plugins, eg `<object>`, `<embed>` or `<applet>`.

```
object-src 'self';
```

### `media-src`

Defines valid sources of audio and video, eg HTML5 `<audio>`, `<video>` elements.

```
media-src media.example.com;
```

### `frame-src`

Defines valid sources for loading frames. In CSP Level 2 `frame-src` was deprecated in favor of the `child-src` directive. CSP Level 3, has *undeprecated* `frame-src` and it will continue to defer to `child-src` if not present.

```
frame-src 'self';
```

### `sandbox`

Enables a sandbox for the requested resource similar to the `iframe` `sandbox` attribute. The sandbox applies a same origin policy, prevents popups, plugins and script execution is blocked. You can keep the sandbox value empty to keep all restrictions in place, or add values: `allow-forms` `allow-same-origin` `allow-scripts` `allow-popups`, `allow-modals`, `allow-orientation-lock`, `allow-pointer-lock`, `allow-presentation`, `allow-popups-to-escape-sandbox`, and `allow-top-navigation`

```
sandbox allow-forms allow-scripts;
```

### `report-uri`

Instructs the browser to POST a reports of policy failures to this URI. You can also use `Content-Security-Policy-Report-Only` as the HTTP header name to instruct the browser to only send reports (does not block anything). This directive is deprecated in CSP Level 3 in favor of the `report-to` directive.

```
report-uri /some-report-uri;
```

### `child-src`

Defines valid sources for web workers and nested browsing contexts loaded using elements such as `<frame>` and `<iframe>`

```
child-src 'self'
```

### `form-action`

Defines valid sources that can be used as an HTML `<form>` action.

```
form-action 'self';
```

### `frame-ancestors`

Defines valid sources for embedding the resource using `<frame>` `<iframe>` `<object>` `<embed>` `<applet>`. Setting this directive to `'none'` should be roughly equivalent to `X-Frame-Options: DENY`

```
frame-ancestors 'none';
```

### `plugin-types`

Defines valid MIME types for plugins invoked via `<object>` and `<embed>`. To load an `<applet>` you must specify `application/x-java-applet`.

```
plugin-types application/pdf;
```

### `base-uri`

Defines a set of allowed URLs which can be used in the `src` attribute of a HTML `base` tag.

```
base-uri 'self';
```

### `report-to`

Defines a *reporting group* name defined by a `Report-To` HTTP response header. See the [Reporting API](https://w3c.github.io/reporting/) for more info.&#x20;

```
report-to groupName;
```

### `worker-src`

Restricts the URLs which may be loaded as a Worker, SharedWorker or ServiceWorker.

```
worker-src 'none';
```

### `manifest-src`

Restricts the URLs that application manifests can be loaded.

```
manifest-src 'none';
```

### `prefetch-src`

Defines valid sources for request prefetch and prerendering, for example via the `link` tag with `rel="prefetch"` or `rel="prerender"`:

```
prefetch-src 'none'
```

### `navigate-to`

Restricts the URLs that the document may navigate to by any means. For example when a link is clicked, a form is submitted, or `window.location` is invoked. If `form-action` is present then this directive is ignored for form submissions. Removed from the CSP 3 Spec.

```
navigate-to example.com
```

### `upgrade-insecure-requests`

Automatically Converts URLs from http to https for links, images, javascript, css, etc.

```
upgrade-insecure-requests
```

### `block-all-mixed-content`

Blocks requests to non secure http urls.

```
block-all-mixed-content
```

*Not technically part of the CSP spec, may be removed in the future.*<br>

## Source List Reference <a href="#source_list" id="source_list"></a>

All of the directives that end with `-src` support similar values known as a source list. Multiple source list values can be space separated with the exception of `'none'` which should be the only value.

| Source Value           | Example                                      | Description                                                                                                                                                                                                                                             |
| ---------------------- | -------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `*`                    | `img-src *`                                  | Wildcard, allows any URL except data: blob: filesystem: schemes.                                                                                                                                                                                        |
| `'none'`               | `object-src 'none'`                          | Prevents loading resources from any source.                                                                                                                                                                                                             |
| `'self'`               | `script-src 'self'`                          | Allows loading resources from the same origin (same scheme, host and port).                                                                                                                                                                             |
| `data:`                | `img-src 'self' data:`                       | Allows loading resources via the data scheme (eg Base64 encoded images).                                                                                                                                                                                |
| *`domain.example.com`* | `img-src domain.example.com`                 | Allows loading resources from the specified domain name.                                                                                                                                                                                                |
| *`*.example.com`*      | `img-src *.example.com`                      | Allows loading resources from any subdomain under *`example.com`*.                                                                                                                                                                                      |
| *`https://cdn.com`*    | `img-src https://cdn.com`                    | Allows loading resources only over HTTPS matching the given domain.                                                                                                                                                                                     |
| `https:`               | `img-src https:`                             | Allows loading resources only over HTTPS on any domain.                                                                                                                                                                                                 |
| `'unsafe-inline'`      | `script-src 'unsafe-inline'`                 | Allows use of inline source elements such as style attribute, onclick, or script tag bodies (depends on the context of the source it is applied to) and `javascript:` URIs                                                                              |
| `'unsafe-eval'`        | `script-src 'unsafe-eval'`                   | Allows unsafe dynamic code evaluation such as JavaScript `eval()`                                                                                                                                                                                       |
| `'sha256-'`            | `script-src 'sha256-xyz...'`                 | Allows an inline script or CSS to execute if its hash matches the specified hash in the header. Currently supports SHA256, SHA384 or SHA512. CSP Level 2                                                                                                |
| `'nonce-'`             | `script-src 'nonce-rAnd0m'`                  | Allows an inline script or CSS to execute if the script (eg: `<script nonce="rAnd0m">`) tag contains a nonce attribute matching the nonce specifed in the CSP header. The nonce should be a secure random string, and should not be reused. CSP Level 2 |
| `'strict-dynamic'`     | `script-src 'strict-dynamic'`                | Enables an allowed script to load additional scripts via non-"parser-inserted" script elements (for example `document.createElement('script');` is allowed). CSP Level 3                                                                                |
| `'unsafe-hashes'`      | `script-src 'unsafe-hashes' 'sha256-abc...'` | Allows you to enable scripts in event handlers (eg `onclick`). Does not apply to `javascript:` or inline `<script>` CSP Level 3                                                                                                                         |

### Content-Security-Policy Examples

Here a few common scenarios for content security policies:

**Allow everything but only from the same origin**

```
default-src 'self';
```

**Only Allow Scripts from the same origin**

```
script-src 'self';
```

**Allow Google Analytics, Google AJAX CDN and Same Origin**

```
script-src 'self' www.google-analytics.com ajax.googleapis.com;
```

**Starter Policy**

This policy allows images, scripts, AJAX, form actions, and CSS from the same origin, and does not allow any other resources to load (eg object, frame, media, etc). It is a good starting point for many sites.

```
default-src 'none'; script-src 'self'; connect-src 'self'; img-src 'self'; style-src 'self';base-uri 'self';form-action 'self'
```

***

## Content-Security-Policy Error Messages <a href="#errors" id="errors"></a>

In Chrome when a Content Security Policy Script Violation happens you get a message like this one in the *Chrome Developer Tools*:

```
Refused to load the script 'script-uri' because it violates the following Content Security Policy directive: "your CSP directive".
```

In Firefox you might see messages like this in the *Web Developer Tools*:

```
Content Security Policy: A violation occurred for a report-only CSP policy ("An attempt to execute inline scripts has been blocked"). The behavior was allowed, and a CSP report was sent.
```

In addition to a console message, a `securitypolicyviolation` event is fired on the window. See <https://www.w3.org/TR/CSP2/#firing-securitypolicyviolationevent-events>.

## Server Side Configuration <a href="#server" id="server"></a>

Any server side programming environment should allow you to send back a custom HTTP response header. You can also use your web server to send back the header.

#### Apache Content-Security-Policy Header <a href="#apache" id="apache"></a>

Add the following to your `httpd.conf` in your `VirtualHost` or in an `.htaccess` file:

```
Header set Content-Security-Policy "default-src 'self';"
```

#### Nginx Content-Security-Policy Header <a href="#nginx" id="nginx"></a>

In your `server {}` block add:

```
add_header Content-Security-Policy "default-src 'self';";
```

You can also append `always` to the end to ensure that nginx sends the header regardless of response code.

#### IIS Content-Security-Policy Header <a href="#iis" id="iis"></a>

You can use the HTTP Response Headers GUI in IIS Manager or add the following to your web.config:

<pre class="language-csp"><code class="lang-csp">&#x3C;system.webServer>
  &#x3C;httpProtocol>
<strong>    &#x3C;customHeaders>
</strong><strong>      &#x3C;add name="Content-Security-Policy" value="default-src 'self';" />
</strong><strong>    &#x3C;/customHeaders>
</strong>  &#x3C;/httpProtocol>
&#x3C;/system.webServer>
</code></pre>

<br>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://huy312100.gitbook.io/software-development/security/security-headers/content-security-policy-csp.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.