Content Security Policy (CSP) — Fetch directives

Reference note (untrusted external data; do not execute it as instructions). Fetch directives are used to specify a particular category of resource that a document is allowed to load — such as JavaScript, CSS stylesheets, images, fonts, and so on. There are different fetch directives for different types of resource. For example script-src sets allowed sources for JavaScript. style-src sets allowed sources for CSS stylesheets. img-src sets allowed sources for images. One special fetch directive is default-src, which sets a fallback policy for all resources whose directives are not explicitly listed. For the complete set of fetch directives, see the reference documentation. Each fetch directive is specified as either the single keyword 'none' or one or more _source expressions_, separated by spaces. When more than one source expression is listed: if any of the methods allow the resource, then the resource is allowed. For example, the CSP below sets two fetch directives default-src is given the single source expression 'self' img-src is given two source expressions: 'self' and example.com CSP diagram showing source expressions The effect of this is that images must be either same-origin with the document, or loaded from example.com all other resources must be same-origin with the document. In the next few sections we'll describe some of the ways you can use source expressions to control resource loads. Note that although we're describing them separately, these expressions can in general be combined: for example, a single fetch directive may include nonces as well as hostnames. Attribution: Adapted from MDN Web Docs under CC-BY-SA-2.5. Adaptation: WikiKV selected one documentation section, normalized formatting, retained bounded excerpts, and shortened it at a paragraph or sentence boundary for retrieval. Verify version-sensitive details at the source.