On my page I have given hierarchy:
Page - http://220.127.116.11/path
|- frame - //proxy.domain.training/path
|- frame - https://app.domain.training/path
Content-Security-Policy:frame-ancestors app.domain.training proxy.domain.training domain.training *.domain.training 18.104.22.168
Refused to display 'https://app.domain.training/path' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors app.domain.training proxy.domain.training domain.training *.domain.training 22.214.171.124".
I would suggest prepending the URL scheme(s) to the domains in your
Content-Security-Policy header. You may end up having to specify the domain twice to cover both
https, but it does seem to solve the problem.
I faced a similar problem; if the parent page was served over plain
http and the iframed page served the CSP header with the parent domain included but without the URL scheme, both Firefox and Chrome would give the error you quoted.
The biggest clue I found as to why this occurs is in Pale Moon's (a Firefox fork) release notes:
26.5.0 (2016-09-28) Fixes/Changes:
Implemented a breaking CSP (content security policy) spec change; when a page with CSP is loaded over http, Pale Moon now interprets CSP directives to also include https versions of the hosts listed in CSP if a scheme (http/https) isn't explicitly listed. This breaks with CSP 1.0 which is more restrictive and doesn't allow this cross-protocol access, but is in line with CSP 2 where this is allowed.
However, it seems that Pale Moon 26.5.0 still behaves similarly to Firefox and Chrome.
Scott Helme also blogged about a similar issue with Safari, but it sounds like this is now resolved.
One other thing to watch out for is if the framed page also serves
X-Frame-Options header. I believe Firefox and Safari are the only browsers that support both this header and CSP's
frame-ancestors header, and certainly in Firefox's case
X-Frame-Options does seem to take precedence. And with
X-Frame-Options ALLOW-FROM you are only allowed to specify one URI, so you may have to look at varying the headers for different browsers depending on your needs.