Content Security Policies for Browsealoud

Content Security Policies are becoming increasingly common on websites. They are intended to prevent code being injected into your website, control cross-site scripting and prevent clickjacking and other code injection attacks.



Because Browsealoud is a third party script you install on your website, it is possible for a CSP to stop Browsealoud working correctly. You may need to adjust your CSP to allow Browsealoud to work.



Browsealoud 2.5.4 onwards supports strict CSPs that disallow the use of evals and inline scripts. However, Browsealoud still needs to use certain media types and files from third party locations to function on your website.



Find out more about Content Security Policies.  

Recommended CSP

This is the default CSP that we recommend you use to integrate Browsealoud. Specific parts of this will be explained below.

A CSP can be applied on a page in a meta tag or in a http response header set on the web server. It is up to the website owner to decide the best way to implement their CSP. 

This CSP assumes that Browsealoud is loaded with secure protocol (https) and on a secure site and the website is using the Best Practice Browsealoud Configuration.

default-src 
   'self';
style-src 
   'self'
   https://plus.browsealoud.com
   https://fonts.googleapis.com;
font-src
   'self'
   https://fonts.gstatic.com
   data:;
Script-src
   https://plus.browsealoud.com
  https://www.browsealoud.com
   https://fonts.googleapis.com
   'sha256-XwQT/PsFMy+rKSB4vlW93i5lrzIRaGmPC3M2D0C3ZKU='
   https://www.google-analytics.com/
   https://www.googletagmanager.com/
   https://apis.google.com;
img-src
   'self'
   https://plus.browsealoud.com
   https://www.google-analytics.com/
   https://stats.g.doubleclick.net
   data:;
child-src
   'self'
   https://content.googleapis.com
   https://www.googletagmanager.com/ns.html;
Connect-src
   https://plus.browsealoud.com
   https://babm.texthelp.com
   https://*.speechstream.net
   https://stats.g.doubleclick.net
   https://www.google-analytics.com/;
media-src
   'self'
   https://*.speechstream.net;



CSP Explained

Individual parts of the CSP are explained below:

 

default-src 

  'Self';

Allow all content hosted on the website’s own domain to be loaded.

style-src 

  'self'

  https://plus.browsealoud.com

  https://fonts.googleapis.com;

Defines valid sources of stylesheets:


self - the website’s own domain

plus.browsealoud.com - Browsealoud user interface

fonts.googleapis.com - to support fonts required for the Browsealoud user interface

font-src

  'self'

  https://fonts.gstatic.com

  data:;

Defines valid sources of fonts:

 

self - the website’s own domain

plus.browsealoud.com - Browsealoud user interface

fonts.googleapis.com - fonts required for the Browsealoud user interface

data - required to allow the page to load resources such as Base64 encoded images.

script-src

  https://plus.browsealoud.com

  https://www.browsealoud.com

  https://fonts.googleapis.com

 

  'sha256-XwQT/PsFMy+rKSB4vlW93i5lrzIRaGmPC3M2D0C3ZKU='

  https://www.google-analytics.com/

  https://www.googletagmanager.com/

  https://apis.google.com;

Defines valid sources of JavaScript:

 

plus.browsealoud.com and www.browsealoud.com - to allow the main Browsealoud JavaScript to run

fonts.googleapis.com - for use of Google Fonts in the Browsealoud user interface

 

The rest of this section is required to permit Google Analytics to run (for anonymous usage logging) and Google Tag Manager (used to load the Google Analytics Script),

  https://apis.google.com;

This is required to permit Google Translate to work on your website. You can omit this if you do not use the Translate feature.

img-src

  'self'

  https://plus.browsealoud.com

  https://www.google-analytics.com/  

  https://stats.g.doubleclick.net

  data:;

This section defines where image files can be loaded from. 

 

self - the website’s own domain

plus.browsealoud.com - images loaded as part of the Browsealoud user interface

google-analytics.com and stats.g.doubleclick.net - required for analytics reporting.

data - required to allow resources such as Base64 encoded images.

child-src

  'self'

  https://content.googleapis.com

  https://www.googletagmanager.com/ns.html;

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

 

self - the website’s own domain

content.googleapis.com - required for the Translate feature, which uses Google Translate. 

googletagmanager.com - used to manage our Google Analytics and prevent it clashing with any analytics of your own.

connect-src

  https://plus.browsealoud.com

  https://babm.texthelp.com

  https://*.speechstream.net        

  https://stats.g.doubleclick.net

  https://www.google-analytics.com/;

Applies to XMLHttpRequest (AJAX), WebSocket or EventSource.

 

plus.browsealoud .com - to fetch information files to configure Browsealoud’s settings for your website.

babm.texthelp.com - this is where custom pronunciation data is loaded from

*.speechstream.net - This is a Texthelp-owned Speech Service called SpeechStream, which is used to generate speech. XML files are obtained from this to enable words to be highlighted during speech.

stats.g.doubleclick.net and www.google-analytics.com - for Browsealoud usage analytics.

media-src

  'self'

  https://*.speechstream.net;

This defines where media files are permitted to be loaded from.

 

self - the website’s own domain

*.speechstream.net - This is a Texthelp-owned Speech Service called SpeechStream, which is used to generate speech. MP3s will be retrieved from this service to enable speech playback.