Menu
I am trying to use a simple iframe on my website. But it is not showing up. Please see the screenshot. This is my code:
<iframe src="https://www.w3schools.com"></iframe>
What am I doing wrong? Thanks
235
If the primary domain for your website is secure with SSL (https://) but the source URL for your Iframe is not, your website will display an error, or simply not display the content. To fix this, you'll need to update the Source URL for your Iframe content with the secure (https://) version.
You have to check for HTTP response header X-Frame-Option of those sites. if its value is "DENY or SAMEORIGIN", then you can not load those website in the iframes. DENY = No one can load the website in iframe. Even the same domain page wont be able to load.
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).
Your code is right, it's w3schools.com that's the problem. Opening up the developer console reveals this:
Refused to display 'https://www.w3schools.com/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
This means that w3schools.com will only work in a frame when the "origin" (the website your frame is on) is from w3schools.com. Otherwise, you'll just get a blank frame.
54
Pages from W3Schools are not displayed in iframe elements from different server because the W3Schools site implements an iframe blocking policy. In order to do this, it uses the X-Frame-Options. (See also how to block website from loading in iframe?.)
You can check whether a site implements this policy by inspecting its HTTP headers. For example, in Firefox, press F12 to open the inspection tools, then go to Network, select one of the objects that were sent over HTTP and look at the headers (or filter the headers for e.g. "x-frame"). Below is what this looks like for W3Schools:
Notice x-frame-options: SAMEORIGIN in the lower right part of the screenshot. With x-frame-options: SAMEORIGIN (or on some other sites x-frame-options: DENY) set on the server side, you will not be able to load pages from that site inside an iframe or a frame.
For more background, see X-Frame-Options – How to Combat Clickjacking, which also explains other values that can be used in the x-frame-options header.
If you want to test with a webpage from a server that does not block loading in iframes, try for example https://wiki.archlinux.org/.
39
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
