Consent Docs
Open console

Set up a Content Security Policy

Add the sources the consent runtime needs to your Content Security Policy so the banner loads, is styled and can record a choice.

How-to2 min readFor web, backend and mobile developers

If your site sends a Content Security Policy, it has to allow what the runtime does. Without these sources the banner is missing or unstyled, or a choice is not recorded.

Allow the runtime#

  1. Add your deployment's origin to script-src. If a CDN serves the runtime, add the CDN's origin too.
  2. Add your deployment's origin to connect-src.
  3. Add 'unsafe-inline' to style-src.
  4. If your custom CSS or custom layout uses images, add their hosts to img-src. Add data: if you embed images.
  5. Reload a page with the browser console open.

The banner appears, styled, and the console shows no policy errors. For a site that loads the runtime from https://console.dpconsent.com/consent, the value of the Content-Security-Policy header has these directives, shown one per line:

script-src 'self' https://console.dpconsent.com/consent;
connect-src 'self' https://console.dpconsent.com/consent;
style-src 'self' 'unsafe-inline'

What each source is for#

Directive Allow Why
script-src The deployment's origin, and the CDN's if you use one loader.js, the versioned runtime and the IAB extension files
connect-src The deployment's origin The form request, consent writes and usage beacons
style-src 'unsafe-inline' The banner's styles are <style> elements the runtime creates inside its shadow root. It does not take a nonce
img-src The hosts of images in your custom CSS or custom layout Only when you use them

The runtime never uses eval, so 'unsafe-eval' is not needed.

Allow the tags you hold#

A held tag is released by inserting a new script element, so your policy applies to it as well.

  • A released external script must be allowed by your script-src.
  • A released inline script counts as an inline script. A policy without 'unsafe-inline' blocks it unless its hash is listed. Prefer external files with src.

Trusted Types stop held scripts from being released

A policy with require-trusted-types-for 'script' refuses two things the runtime does with plain strings. It cannot set the src or code of a script it releases, and it cannot parse a custom first layer. A choice that would release a held script then fails: the script does not run and the choice is not recorded. With a custom first layer, no banner is drawn. Define a default Trusted Types policy that lets these through, or leave Trusted Types off on pages that load the runtime.

Held frames are not affected by Trusted Types.

↑↓ to move, Enter to open