Content Security Policy (CSP)
Unblu comes with predefined directives for the Content-Security-Policy HTTP response header of its various interfaces.
The Unblu CSP is always delivered in an HTTP response header. It isn’t possible to include it in a meta tag. |
Activating Unblu CSP directives
By default, Unblu doesn’t send a Content-Security-Policy header. To do so, set com.unblu.contentsecuritypolicy.mode to ON.
Activating CSP improves the security of Unblu by limiting access to resources that comply with the policies you specify. However, sometimes a policy may have unintended side-effects. It may block access to resources that are, in fact, required for your application to function correctly.
If you want to see whether activating the Unblu CSP results in problems, set com.unblu.contentsecuritypolicy.mode to REPORT_ONLY. Unblu then adds a Content-Security-Policy-Report-Only header rather than a Content-Security-Policy header. Violations of the CSP directives are displayed in the console of your browser’s developer tools, but the resource is still loaded. This way, you can verify that the directives won’t block access to required resources.
Minimum CSP directives for Unblu user interfaces
The minimum set of directives required for the Unblu user interfaces—the Agent Desk, Single Conversation Desk, Visitor Desk, Account Configuration interface, and Global Server Configuration interface—are as follows:
Content-Security-Policy header directives fur Unblu user interfaces
Content-Security-Policy: default-src 'none'; frame-ancestors 'none'; media-src 'none'; frame-src 'none'; font-src 'self'; img-src 'self' data:; style-src 'self' 'unsafe-inline'; connect-src 'self' ; script-src 'self' 'unsafe-eval' 'unsafe-inline'; worker-src 'self'Additional directives
The directives listed in the previous section aren’t sufficient for all features of Unblu. Depending on the feature or features in use, Unblu adds directives to the CSP header.
Video and voice calls
If you use Unblu’s video and voice call features, the CSP response header includes the domains of the call service provider that’s configured in com.unblu.conversation.call.callServiceProvider.
-
For LiveKit (the default call service provider) and ACS, the
connect-srcdirective is amended:Listing 2. Additional sources forconnect-srcdirective when using LiveKit or ACSconnect-src: 'self' <call-service-provider-domain(s)> (1)1 For LiveKit, the domains added are the ones from com.unblu.conversation.call.livekit.serverUrl. For example, in the case of the Unblu Cloud, <call-service-provider-domain(s)>iswss://ch/sfu/ustage/app. -
For Vonage, both
connect-srcandscript-srcdirectives are amended:Listing 3. Additional sources for CSP fetch directives when using Vonageconnect-src: *.opentok.com *.tokbox.com wss://*.tokbox.com; script-src: *.opentok.com *.tokbox.com wss://*.tokbox.com
Font sources
To load fonts from additional sources, add the domain or domains to com.unblu.contentsecuritypolicy.allowedDomainsForExternalFontSources. The domains are then added to the font-src fetch directive.
font-src: 'self' <allowedDomainsForExternalFontSources> (1)| 1 | <allowedDomainsForExternalFontSources> is replaced with the value of the configuration property. |
Frame sources
To allow additional sources for nested browsing contexts such as <frame> or <iframe> elements, add the sources to com.unblu.contentsecuritypolicy.allowedDomainsForExternalFrameSources. You can also allow agent-specific domains for iframe embedding. To do so, add the domains in question to com.unblu.contentsecuritypolicy.agentAllowedDomainsForIframeEmbedding.
If you add custom protocols (e.g. for Unblu Branch auto-open links), the protocols must be listed here so they aren’t blocked on Unblu sites. The protocols must be in the format <protocol>:.
frame-src: <allowedDomainsForExternalFrameSources> <agentAllowedDomainsForIframeEmbedding> (1)| 1 | <allowedDomainsForExternalFrameSources> and <agentAllowedDomainsForIframeEmbedding> are replaced with the values of the respective configuration properties. |
Image sources
To allow additional sources for images, add the domain or domains to com.unblu.contentsecuritypolicy.allowedDomainsForExternalImageSources. The domains are then added to the imgs-src fetch directive.
img-src: `self` <allowedDomainsForExternalImageSources> (1)| 1 | <allowedDomainsForExternalImageSources> is replaced with the value of the configuration property. |
Sources for native document co-browsing
For native document co-browsing, Unblu amends the CSP header with the following directives:
connect-src: blob: font-src: 'self' data:; script-src: 'self' blob:; img-src: ‘self’ data: blob:; worker-src: ‘self’ blob:If you set com.unblu.contentsecuritypolicy.loadCompressedJavaScriptFiles to false, the connect-src directive isn’t required, and the script-src directive doesn’t need the blob: source.
Sources for embedded co-browsing
For embedded co-browsing, Unblu amends the frame-ancestors and frame-src directives:
frame-ancestors: ‘self’; frame-src: ‘self’The directives for embedded content include the * wildcard for CSS, fonts, images, and media. This is the default value of com.unblu.contentsecuritypolicy.allowedDomainsForUiResources. If you wish to make the directives more restrictive, change the value of the property accordingly.
For example, if static resources for your public website are retrieved from imgs.static.company.com and resources.company.com, you can make the CSP directive more restrictive by one of the following means:
-
Add
*.company.comto com.unblu.contentsecuritypolicy.allowedDomainsForUiResources. -
Add both
imgs.static.company.comandresources.company.comto com.unblu.contentsecuritypolicy.allowedDomainsForUiResources.
The domains listed in the configuration property are added to the following fetch directives for embedded content:
-
media-src -
font-src -
img-src -
style-src
The frame-ancestors directive specifies valid parents that may embed the Agent or Visitor Desk using an <frame>, <iframe>, <object>, or <embed> element.
com.unblu.contentsecuritypolicy.agentAllowedDomainsForIframeEmbedding='none'
com.unblu.contentsecuritypolicy.visitorAllowedDomainsForIframeEmbedding='none'https://www.example.com to embed the Agent or Visitor Desk
com.unblu.contentsecuritypolicy.agentAllowedDomainsForIframeEmbedding=https\://www.example.com
com.unblu.contentsecuritypolicy.visitorAllowedDomainsForIframeEmbedding=https\://www.example.comSources for screen sharing
For screen sharing, Unblu amends the connect-src directive:
connect-src: 'self' wss://<publicServerBaseUrl><publicServerBaseUrl> is replaced with the value of com.unblu.identifier.publicServerBaseUrl.
Sources for conversation recordings
To permit viewing or listening to conversation recordings, Unblu adds the :blob source to the media-src directive:
media-src: 'self' :blobSources for specific message types
Some message types require additional sources.
-
File messages need the
'self'source in themedia-srcdirective:Listing 13. Additional source for file messagesmedia-src: 'self' -
For messages types that contain images fetched from an external domain, Unblu adds the configured domain or domains to the
img-srcdirective.
Sources for links that open automatically in Unblu Branch
For Branch links that open automatically, you can specify additional sources, such as external domains or custom protocols, in com.unblu.contentsecuritypolicy.allowedDomainsForExternalFrameSources.
Minimum CSP directives for visitor-facing integrations
For pages that integrate Unblu with the Unblu Floating or Embedded Visitor UI, there are two different sets of CSP directives, depending on whether Unblu Spark is deployed in a site-embedded or cross-origin setup.
CSP directives in a site-embedded setup
If Unblu is deployed in a site-embedded setup, the minimum set of CSP directives required for the Visitor UIs is as follows:
Content-Security-Policy: default-src 'none'; frame-ancestors 'none'; media-src 'none'; frame-src 'none'; font-src 'self'; img-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' ws://<publicServerBaseUrl>:*; script-src 'self'; worker-src 'none'In the header above, <publicServerBaseUrl> is the value of com.unblu.identifier.publicServerBaseUrl.
CSP directives in a cross-origin setup
In a cross-origin setup, the minimum set of CSP directives required for the Visitor UIs is as follows:
Content-Security-Policy: default-src 'none'; frame-ancestors 'none'; media-src 'none'; frame-src 'none'; font-src http://<publicServerBaseUrl>; img-src http://<publicServerBaseUrl>; style-src 'unsafe-inline' <publicServerBaseUrl>; connect-src ws:<publicServerBaseUrl>:* http://<publicServerBaseUrl> ws://<publicServerBaseUrl>:*; script-src http://<publicServerBaseUrl>; worker-src 'none'In the header above, <publicServerBaseUrl> is the value of com.unblu.identifier.publicServerBaseUrl.
Additional sources for Visitor UIs
The additional sources for notification sounds and video and voice calls are the same as for the Agent Desk described above.
CSP directives for error pages
Unblu Spark error pages are sent with the following CSP header:
Content-Security-Policy: default-src 'none'; media-src 'self'; frame-src 'none'; font-src 'self'; img-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src 'self'For error pages that are displayed when a user impersonating another user tries to access a page they aren’t allowed to access, the CSP response header also includes the following fetch directives:
script-src 'self' 'unsafe-inline'; connect-src 'self'CSP directives for static content
By default, static content is sent with the following CSP header:
Content-Security-Policy: default-src 'none'; media-src 'self'; frame-src 'none'; font-src 'self' data:; img-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src 'self'; connect-src 'self' ws: wss:The values ws: and wss: in the various headers are required by Apple Safari.