Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iframe refuses to display

Tags:

html

iframe

I am trying to load a simple iframe into one of my web pages but it is not displaying. I am getting this error in Chrome:

Refused to display 'https://cw.na1.hgncloud.com/crossmatch/index.do' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self' https://cw.na1.hgncloud.com".   Invalid 'X-Frame-Options' header encountered when loading 'https://cw.na1.hgncloud.com/crossmatch/index.do': 'ALLOW-FROM https://cw.na1.hgncloud.com' is not a recognized directive. The header will be ignored. 

This is the code for my iframe:

<p><iframe src="https://cw.na1.hgncloud.com/crossmatch/" width="680" height="500" frameborder="0"></iframe></p> 

I am not really sure what that means. I have loaded plenty iframes before and never received such errors.

Any ideas?

like image 915
Jose M. Avatar asked Aug 11 '15 14:08

Jose M.


People also ask

Why does iframe refuse connect?

Most probably web site that you try to embed as an iframe doesn't allow to be embedded. You need to update X-Frame-Options on the website that you are trying to embed to allow your Power Apps Portal (if you have control over that website).

Why do IFrames not work?

The iFrame has not configured – see suggestions in console – iFrame is most likely disabled. Your browser does not support frames, so you will not be able to view this page – You are using a browser that doesn't support iFrame. iFrame not loading in Chrome unless the window is resized – Resize the window to load iFrame.

How do you fix a refused frame?

How to fix error Refused to frame '<URL>' because it violates the following Content Security Policy directive: frame-src / default-src / child-src. Correction of the error «Refused to frame '<URL>'» is obvious - you need to add the blocked host-source from '<URL>' to the directive, in which it blocks.


2 Answers

It means that the http server at cw.na1.hgncloud.com send some http headers to tell web browsers like Chrome to allow iframe loading of that page (https://cw.na1.hgncloud.com/crossmatch/) only from a page hosted on the same domain (cw.na1.hgncloud.com) :

Content-Security-Policy: frame-ancestors 'self' https://cw.na1.hgncloud.com X-Frame-Options: ALLOW-FROM https://cw.na1.hgncloud.com 

You should read that :

  • https://developer.mozilla.org/en-US/docs/Web/Security/CSP
  • https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy
like image 59
Vince Avatar answered Sep 25 '22 11:09

Vince


The reason for the error is that the host server for https://cw.na1.hgncloud.com has provided some HTTP headers to protect the document. One of which is that the frame ancestors must be from the same domain as the original content. It seems you are attempting to put the iframe at a domain location that is not the same as the content of the iframe - thus violating the Content Security Policy that the host has set.

Check out this link on Content Security Policy for more details.

like image 42
David Avatar answered Sep 22 '22 11:09

David