Refused to frame: an ancestor violates CSP frame-ancestors
The page you embed sends a Content-Security-Policy with frame-ancestors, and your site is not in the list. Chrome and Edge block the frame and write this message in the console.
- Chrome
- Edge
- Firefox
- Safari
Updated
Framing 'https://example.com/' violates the following Content Security Policy directive: "frame-ancestors 'self'". The request has been blocked.
The frame shows a gray page: “example.com refused to connect.”
Framing 'https://example.com/' violates the following Content Security Policy directive: "frame-ancestors 'self'". The request has been blocked.
The frame shows “Firefox Can’t Open This Page”.
Content-Security-Policy: The page’s settings blocked the loading of a resource (frame-ancestors) at <unknown> because it violates the following directive: “frame-ancestors 'self'”
The frame stays blank. There is no message in the page.
Refused to load https://example.com/ because it does not appear in the frame-ancestors directive of the Content Security Policy.
On this page
What it means
Why it happens
Check the page
See the headers the page sends now
Fix it if you own the site
location / {
proxy_hide_header X-Frame-Options;
add_header Content-Security-Policy "frame-ancestors 'self' https://your-site.com" always;
}Write each site as a full origin, such as https://your-site.com. Do not use * unless any site may embed the page.
If you do not own the site
- Use the official embed URL
YouTube, Google Maps, Calendly, and others give a special embed link that allows frames.
- Link out instead
Open the page in a new tab with a normal link, or show a preview card that links to it.
- Ask the owner
Ask them to add your site to frame-ancestors. Send them this page.