Content Security Policy

This section is only relevant if you use CSP directives on your site. If you don't have any CSP directives configured, you don't need to change that.

One common cause for WebSDK to fail is the browser’s Content-Security-Policy (CSP). If the CSP is configured incorrectly, the scripts responsible for loading the WebSDK cannot be executed. You can check for CSP errors by pressing the F12 button in Chrome to open the Dev Tools and look for the error message which that mentions Content-Security-Policy. The message would look something like this (in this case a wrong configuration for script-scr):

In order to resolve these CSP errors, you must add WebSDK scripts to your directives whitelist. WebSDK is affected by five directives:

  • connect-src
  • font-src
  • img-src
  • script-src
  • style-src

connect-src
The CSP connect-src directive restricts the URLs which can be loaded using script interfaces. It is needed to allow WebSDK code to communicate with WebSDK servers and send the collected data. This includes XHR requests.

connect-src 'self' https://analytics.foresee.com https://brain.foresee.com https://cxsurvey.foresee.com https://device.4seeresults.com https://gateway.foresee.com https://record.foresee.com https://survey.foreseeresults.com

For DBA Replay, add the following WebSocket URLs (wss) as well as the above URLs used for XHR requests:

wss://hoover.foresee.com
https://hoover.foresee.com

font-src
The CSP font-src directive specifies valid sources for fonts. This directive is needed for Verint XM Surveys in order to load custom fonts from a different domain.

font-src 'self' https://cxsurvey.foresee.com https://gateway.foresee.com

img-src
The CSP img-src directive specifies valid sources for images. This directive is needed for Verint XM Invites and Surveys that need to load custom images from a different domain.

img-src 'self' https://cxsurvey.foresee.com https://gateway.foresee.com https://s.foresee.com https://static.foresee.com

script-src
The HTTP Content-Security-Policy (CSP) script-src directive specifies valid sources for JavaScript. It is used to block any JavaScript files that do not originate from the domains you whitelisted. The WebSDK code does not originate from your site, but instead is loaded from WebSDK servers, and must be whitelisted. The correct directive for script-src would be like:

script-src 'self' 'unsafe-inline' 'unsafe-eval' https://analytics.foresee.com https://brain.foresee.com https://cxsurvey.foresee.com https://device.4seeresults.com https://gateway.foresee.com https://record.foresee.com https://survey.foreseeresults.com

It is important to also add unsafe-inline since WebSDK code is loaded by adding a script tag to your HTML.

style-src
The HTTP Content-Security-Policy (CSP) style-src directive specifies valid sources for stylesheets. This directive is needed for WebSDK and Verint XM Surveys since both rely on CSS Stylesheets from a different domain as well as inline styles.

style-src 'self' https://cxsurvey.foresee.com https://gateway.foresee.com

It is important to also add unsafe-inline since WebSDK style code is loaded by adding a style tag to your HTML.

If you add all directives for WebSDK, the CSP setting would look like this:

Content-Security-Policy: connect-src 'self' https://analytics.foresee.com https://brain.foresee.com https://cxsurvey.foresee.com https://device.4seeresults.com https://gateway.foresee.com https://record.foresee.com https://survey.foreseeresults.com wss://hoover.foresee.com https://hoover.foresee.com; font-src 'self' https://cxsurvey.foresee.com https://gateway.foresee.com; img-src 'self' https://cxsurvey.foresee.com https://gateway.foresee.com https://s.foresee.com https://static.foresee.com; script-src 'self' 'unsafe-inline' https://cxsurvey.foresee.com https://gateway.foresee.com; style-src 'self' 'unsafe-inline https://cxsurvey.foresee.co https://gateway.foresee.com;