What reasons could an iframe have for not loading? - html

I think the question is pretty simple: what reasons could an iframe have for not loading its content?
This came up because I have an iframe in my site's "thank you" page to track conversions. For some reason, when using dev tools in Chrome I can't find any content inside the body or head tags inside the iframe.
But if I click on the iframe's URL, the conversion is correctly activated and I see the message "Conversion logged: true".
Could there be something in my own site preventing the iframe from loading? How can I assure that the iframe will load correctly? Could using an img pixel instead solve this problem?

Because your iframe is coming from a different domain, it is possible the domain you are attempting to serve the iframe from has a security policy which prevents you from embedding it in your page.
There are two potential technologies related to this.
X-FRAME-OPTIONS HTTP header: page owners can specify that their content should not show in an iframe or only show in an iframe on the same origin (domain).
Content Security Policy (CSP): has "frame-src" (non-standard implementation in Firefox) and "frame-options" (standardized) directives. It allows setting policies for iframes similar to X-FRAME-OPTIONS.
In essence, if you're serving content from a third-party site you don't control, it's possible they may have an HTTP header or security policies in place that would prevent the iframe content from showing in your page.
More Resources:
CSP support (caniuse.com)
Other possibilities (which I think are unlikely since it worked when you loaded the page directly):
Ad-blocking browser extensions
"Do Not Track" policy
Browser extensions that block tracking tools

Tracking elements are often blocked by browser add-ons like Adblock Plus and NoScript.
For being more specific in your case, we need an example page that is demonstrating the problem.

Related

Can you navigate other websites from your page using an iframe?

I am trying to make a webpage from which I can browse my social media feeds, email inbox and news sources through iframes. Is this at all possible? I have noticed that youtube and facebook for instance do not allow their sites to be displayed in an iframe. Are there any alternatives to make this work?
Thank you for taking the time to read.
If a simple isn't working then there isn't any way of doing it in Javascript either. The most likely reason for the iframe not working is because the target site is sending a header to prevent other sites iframing it:
X-Frame-Options: DENY
A lot of sites will do this to prevent a common vulnerability known as UI Redressing or Click Hijacking. Some sites will also include some frame busting Javascript as a backup security measure to the HTTP header.
The X-Frame-Options HTTP response header can be used to indicate whether or not a browser should be allowed to render a page in a or . Sites can use this to avoid clickjacking attacks, by ensuring that their content is not embedded into other sites.

HSTS in iFrame src

I'm building an app that needs to serve websites in an iframe. Since the websites are decided by the user, they usually enter only the domain name, like google.com, or facebook.com. To render the website in an iframe i need to add http:// to this (I can't add https://, since the website may not be served over ssl which will cause it to not render at all.)
For this reason, I am forced to not use ssl on my website, since due to the mixed content policy, I can't add iframes that request http. I wish to know if there's a way to force hsts in the iframe src. For example, if I request http://example.org, the iframe will automatically render https://example.org (since it exists.)
HTTPS doesn't allow you to serve HTTP content. All content on the page must be a secure connection, including iFrame. This is browser standard so there's no work around to be had. Either your page has to be HTTP or the iFrame has to be HTTPS.

Google Chrome cross domain cookie issue with iframe

I know this has been asked a few times, but on all the answers I found there was someone asking if it would still work and somebody else saying that it doesn't, so I was wondering if there is a solution to this problem that still works with the latest version of chrome:
Lets say we have website with an iframe embedded in it, the iframe source is from another host. The page inside the iframe needs cookies to work, but Google Chrome seems to refuse to set cookies that are set within the iframe. (This only happens when "block 3rd party cookies" is checked which seems to be happening on its own because I have multiple reports from different users who didn't touch the advanced options)
I have control over both of the sites, though I can only modify the html on the page that contains the iframe, no server side stuff.
Things I have tried so far that didn't work:
Emedding an image from the same host as the iframe's source
making a post request to the iframe
setting up a P3P header
I can also send messages using xdm, though I don't know if that could help.
If anyone has any further ideas it would be greatly apreciated! I feel like there must be a solution to this problem somewhere
Setting cookies inside an iFrame can be troublesome. However, iFrame can access cookies set outside the iFrame. You can show the page in a popup window which sets the necessary cookies (like authentication, etc) and then access these cookies from within the iFrame.
This is very helpful in case you want to authenticate user on some other domain. Just show a popup, authenticate and set cookies, then access these cookies on your site from iFrame.

stackoverflow page not appearing inside iframe

I used to display web pages in iframes. But when I tried to display my stackoverflow user info in an iframe, it went wrong. The content is not getting displayed. What may be the possible reason (or reasons) for this behavior? How can I display my page in an iframe? Is it possible to display it in iframe with pure html or is there any need for javaScript or AJAX or something like that? If this is not possible, is there any workaround for this?
Here is a Live Demo.
A possible reason for this could be same as that of Google. As some sites do not allow their sites to be iframed.
To quote from #Daan:
Google uses an X-FRAME-OPTIONS HTTP header to disallow putting their pages in iframes: https://developer.mozilla.org/en/The_X-FRAME-OPTIONS_response_header
Could be a case with SO too.

Open Facebook page in iframe or frame?

I want to have two facebook pages open at the same time as part of my html page.
So when you go to mypage.html, there will be displayed two facebook pages. Is this possible?
I get something like:
with code like:
<frameset cols="25%,75%">
or
<iframe height="*" src="http://www.facebook.com/photo.php?fbid=10150277739848763&set=pu.105012493762&type=1&theater" width="100%">
<p>Your browser does not support iframes.</p> </iframe>
I work on Facebook's security team and actually helped write the code that causes this. We do this (a form of frame busting) to prevent clickjacking attacks where an attacker can put Facebook in an iframe, hide it, and trick the user into clicking in the facebook frame and taking some action (e.g. posting a malicious link to their profile, etc).
While Jason's answer is going in the right direction, it's not true that browsers will give you access to the DOM of a page you insert in an iframe in your page. The Same Origin Policy dictates that javascript on one domain cannot access anything on a page on a different domain.
Facebook prevents you from linking directly to the actual site via IFRAME (or any frame). This is because any site putting Facebook in an IFRAME(or any frame) could use Javascript to access elements of the facebook page, including username and password fields.
There is no way around this. It is built in to the browsers themselves to send some information along in the request header that says it is being requested to be put in frame.
Gmail and several other sites do this as well.
There are specific situations where overriding the "x-frame-options" security policy is useful, such as in digital signage where it is desirable to show an organization's facebook page in a iframe alongside other signage iframes.
Clickjacking and phishing will not occur because the organization is displaying its own facebook page on its own browser-driven display devices.
If the browser doesn't provide an internal x-frame override on its "about:flags" page, you may need to install a browser extension to override x-frame-options on the signage device.