Content-Security-Policy errors integrating Omnichannel LiveChat in my web

Description

I’m trying to integrate the Omnichannel LiveChat widget in my we and I’m having a hard time trying to set up the CSP. I’ve tried setting the metas in the page, setting the headers in my apache server (all combinations: VirtualHost / .htaccess / securiry.conf), and although the server is replying with the correct headers (at least I think they’re correct), the web is always showing me this error and the widget never loads:

Refused to frame ‘https://rocket.gelpiu.com/’ because an ancestor violates the following Content Security Policy directive: “frame-ancestors ‘none’”.

Server Setup Information

  • Version of Rocket.Chat Server: 3.8.0
  • Operating System: Debian 10
  • Deployment Method: Git Clone
  • Number of Running Instances: 1
  • DB Replicaset Oplog:
  • NodeJS Version: 12.19
  • MongoDB Version: 4.2.10
  • Proxy: none
  • Firewalls involved: none

Any additional Information

Response Headers:

  1. Accept-Ranges:
    bytes

  2. Access-Control-Allow-Origin:

  3. Connection:

Keep-Alive

  1. Content-Encoding:

gzip

  1. Content-Length:

10668

  1. Content-Security-Policy:

frame-ancestors ‘self’ gelpiu.com;

  1. Content-Type:

text/html

  1. Date:

Thu, 19 Nov 2020 08:00:27 GMT

  1. ETag:

“b049-5b470ea2f9fc8-gzip”

  1. Keep-Alive:

timeout=5, max=100

  1. Last-Modified:

Thu, 19 Nov 2020 07:45:41 GMT

  1. Server:

Apache/2.4.38 (Debian)

  1. Vary:

Accept-Encoding

  1. X-Frame-Options:

SAMEORIGIN

  1. X-Frame-Options:

allow-from *

Hi dani. I just went through this myself tonight. What I did to solve was use security.conf to set the apporpriate Content-Security-Policy header and then in my apache2 virtual hosts file for Rocket.Chat I unset the Content-Security-Policy header.

Sounds a little backwards, but at least for me the issue was that somewhere the Content Security Policy directive: “frame-ancestors ‘none’” header was being set, as well as me purposefully setting the correct CSP frame ancestors header that includes the domain to embed the livechat widget on, but preference was being given to the CSP frame-ancestors ‘none’ line. unsetting the header in the virtual host seemed to remove the none header & the correct one was left alone just fine.

hope that helps & works for you or that you already resolved.
-brandon

Thanks! Now the Content-Security-Error has gone away… BUT, I have a 404 error when displaying the iframe in my web… But if I open the url in a new browser tab, it works perfectly. I’ll check my .htaccess to ensure it is not interferring.

Fixed!!

Just in case someone ends up here…
I had my base domain (gelpiu.com) set as my allowed livechat domains, but this wasn’t enough. When I’ve added the subdomain (www.gelpiu.com), it started working.

Thanks!