Content Security Policy HTTP header is a part of the Shield's HTTP Headers module. It helps you to restrict the sources and types of content that may be loaded and processed by visitor browsers.

In essence it allows you to dictate which resources, files, etc. can be loaded/processed by the browser.

For example, can state that only Javascript files from the domain google.com may be executed. Or, only images loaded from your domain, are downloaded. You can be as granular or as accepting as you like.

Imagine your theme was hacked and a 3rd party JS script was embedded into your site. With the appropriate CSP in-place, you would block loading of the Javascript file on the visitor’s browser.

Shield's Content Security Policy Header covers all types of assets, whether it’s images, scripts, objects, or styles etc.

How to enable / disable this Header

To enable this Header, check this box. To disable, leave it unchecked:

What are the Content Security Policy options?

The Content Security Policy options are as follows:

  • Allow 'self' Directive - Resources from your own host:protocol are permitted.
  • Allow Inline Scripts and CSS - Allows parsing of Javascript and CSS declared in-line in your html document.
  • Allow "data:" Directives - Allows use of embedded data directives, most commonly used for images and fonts.
  • Allow Javascript eval() - Eval function evaluates JavaScript code and executes it. This security policy permits the use of Javascript the eval() function.
  • HTTPS Resource Loading - Allows loading of any content provided over HTTPS.
  • Permitted Hosts and Domains - You can explicitly state which hosts/domain from which content may be loaded. Take great care and test your site as you may block legitimate resources.
  • Manual Rules - You can add manual CSP rules which are not covered by the rules above.                                          

Recommendation: Enabling these options are advised, but you must test them on your site thoroughly.

How to add custom CSP rules

You can use 'Manual Rules' option for this. For example, media files, media-src:

Feel free to provide as many custom Content Security Policy rules as you need to.


Important: There is no validation that your rules are structured correctly, nor whether they’re appropriate for your particular site and circumstances. Great care should be taken when providing your custom rules and advice should be sought from your web developer on what is most appropriate.

 

To learn more about HTTP Content Security Policy Headers, read the blog article here.


We also recommend you to read: