Content Security Policy (CSP)
Introduction
Content Security Policy is a security mechanism that adds an extra layer of protection to your application and helps to mitigate XSS and data injection attacks. In this article, you'll learn how to configure your existing CSP response header to play well with the Coview snippet.
CSP is not required
If you aren't sending a CSP header at the moment, you can skip this section - Coview would work perfectly well without it.
Configuration (short)
To allow Coview on your website, integrate the following policies into your existing CSP header definition:
Content-Security-Policy:
script-src: 'self' *.coview.com;
connect-src 'self' *.coview.com;
style-src: 'self' *.coview.com 'unsafe-inline';
img-src data: *.coview.com;
font-src 'self' *.coview.com;
media-src 'self' *.coview.com;
frame-src 'self' *.coview.com;
Configuration (extended)
CSP acts a bit like a firewall: once rules are defined, it blocks certain categories of network requests that do not fit to those rules.
The details and full configuration of the CSP rules depends not just on your own page (e.g., 'self'), but also on other media services, apps and widgets that you include on your website. This varies between Coview customers, for example with regards to Intercom.
Consequentially, the configuration mentioned above is meant as a minimal guideline that shows which rules the Coview app requires to work. The definition example should be used to extend (not replace!) your current definitions.
Properties
script-src
This policy allows the browser to download the snippet code from our servers.
Inline scripts
If you absolutely must use a
scripttag, make sure to whitelist it either by adding anonceor ahashattribute to it.It's worth noting that Chromium based browsers automatically computes missing hashes for each inline script and outputs them to the console.
connect-src
This allows the widget code to communicate with our servers.
style-src
This property permits the browser to load regular CSS stylesheets from our servers and apply changes via a style tag.
img-src
This policy makes it possible for our servers to deliver images, for example support agent avatars.
font-src
This policy permits loading of fonts from our servers.
media-src
Permit audio and video elements in our content.
frame-src
This allows iframes for our content.
Testing and monitoring
CSP has a Content-Security-Policy-Report-Only mode which instructs browser to only report suspicious requests without actually blocking anything. All relevant errors can be found in the browser's JS console. Take extra care when switching this mode on in a production environment.
Learn more
Updated over 4 years ago