Link in iframe ok, but does not display in embedded page - html

I am trying to embed a map into a travel blog using an iframe. The underlying web page is fine, but it doesn't display in the iframe. I suspect it is a size problem, and I've tried adjusting various parameters. Does anyone know what I can try next?
I am able to recreate the problem under jsfiddle.
<iframe src="https://trackmytour.com/cgkvp/e" width="100%" height="300" style="border: 1px solid black;">
</iframe>

A quote from the console when trying to load that iframe :
Cross-Origin request blocked: The Same-Origin-Rule forbids reading of the extern resource at https://trackmytour.com/static/vue/js/chunk-vendors.2eefddd2.js. (Reason: CORS-Header 'Access-Control-Allow-Origin' missing).
Thats the reason that you cannot see it in the iframe.
More details about that can be found here. If you are not the owner of the website and have access to the webserver, there is no way to circumvent this problem : What you are trying to do is not possible, sorry ...

Related

Basic iframe Not Loading One Webpage

I am trying to load an iframe for an ESPN fantasy league into a website I made for our league members. I can load pretty much any page I want except for this one, which is a link right to our league.
<iframe src="https://games.espn.go.com/flb/leagueoffice?leagueId=27520&seasonId=2015" name="grforum" scrolling="auto" frameborder="no" align="center" height = "100%" width = "100%">
Any idea what could be causing this or how I would be able to get it to load? Thank you very much.
If you open up your JavaScript console, you'll see that the web page (ESPN) does not permit cross-origin framing - i.e. they don't allow you to load that within an iframe on your website.
Load denied by X-Frame-Options: http://games.espn.go.com/flb/leagueoffice?leagueId=27520&seasonId=2015 does not permit cross-origin framing.

Cannot pull webpage into an iframe?

I am trying to pull a webpage into an iframe on another webpage but it just keeps giving me a blank box. Any idea why this is not working?
My page: (https://www.skmgroupwork.com/facebook/identifix/fix/)
iframe code:
<iframe src="https://www.identifix.com/FOTW/FixFrame.aspx" width="700" height="600" scrolling="no" id="inneriframe" frameborder="0"></iframe>
www.identifix.com blocks external domains using their site in an iframe.
You can see here that they have set X-Frame-Options: SAMEORIGIN which blocks all external domains iframing their site.
Read more about X-Frame-Options header here.
maybe the problem is in the domain of the webpage you want load, proib with other page for exclude problems, some domains of webpage block of call for iframes !!

Scrollbar not visible in iframe

I am trying to use iframe with src pointing to a website made in dojo framework. My URL is on different server and and my iframe is on different server. I am just using URL to load URL's content inside iframe. But I can't see the scrollbar with iframe although the page content is more than iframe.
My code is:
<div style="overflow:visible; width: 100%;">
<iframe src="http://172.27.135.85:2040/feg/ngfeeui/public/" width="80%" height="400px" frameborder="0" scrolling="auto" style="overflow: auto;"></iframe>
</div>
Can someone help me if this issue is due to some javascript or css used in dojo framework? If needed I can post the full code of URL also, what I am able to see in firebug.
Sorry this is in an answer, I don't have the points to comment yet. Does your browser support iframes? Check here: http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_iframe_scrolling

iframe and external website

So I have this code:
<iframe id="theFrame" src="http://localhost" style="width:100%;" frameborder="0">
</iframe>
and the localhost site loaded in the iframe just fine..
but then when I change the src to an external website
<iframe id="theFrame" src="http://www.youtube.com" style="width:100%;" frameborder="0">
</iframe>
The website did not load.
What did I do wrong? I know that you can use external websites in an iframe since Google Image Search does so...
How can I get external sites to work in my iframe?
The reason why external websites such as:
youtube.com
google.com
stackoverflow.com
etc.
are not loading in your frame, is because they are intentionally leveraging some sort of Frame Killer.
Example (uses jQuery):
<style> html{display:none;} </style>
<script type="text/javascript">
$(document).ready(function () {
if(window.self == window.top) {
document.documentElement.style.display = 'block'; }
else {
window.top.location = window.self.location; }
});
</script>
Suggested reading:
Framekiller (Wikipedia)
Busting a tough FRAME killer
If you run the code snippet below:
<iframe src="https://www.youtube.com"></iframe>
Then look at dev tools, it will throw the error:
Refused to display 'https://www.youtube.com/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
This is because the site you are trying to access limits embedding (via iframe, frame, embed, object) to the same origin using the X-Frame-Options header. So youtube.com can load iframes with youtube.com pages just fine, but nobody else can. Only site admins for the embedded site can change that setting.
If you have admin for the site you are embedding, you can whitelist the the host site:
X-Frame-Options: allow-from https://my-host-site.com/
This has to be sent as a HTTP Header by the server of the page you are trying to embed. It will not work as a meta tag inside the HTML head. This is how the browser knows the site you are embedding ok'd the site that is hosting to show the page in the iframe.
You are probably experiencing the same issues I am having, Most likely the iframe is being blocked by the X-frame-options or being blocked by the Deny property. For example if you access facebook from an outside source it will come back with a DENY response in google chrome
It appears to be a youtube-only problem; src="http://www.mozilla.org" works for me in your code. If you want to display youtube videos in iframes, they'll probably want you to use "embed" option on the video page?

How could I hide the url of a site within an iframe?

I have a site that has an iframe linking to another site with the following example iframe code:
<html>
<body>
<iframe src="http://google.com" width="100%" height="600">
</iframe>
</body>
</html>
So, for the above example, how could I prevent visitors from finding the url: http://google.com ?
You can't. Suffice to browse the source code and see it. And even if you try to put this in an obfuscated javascript file which will dynamically set the src property of the iframe nothing can't be hidden from the Net tab in FireBug. So I would recommend you not wasting your time with this.
You can write e.g. PHP or Apache rewrite to fetch the page from backend server. This has very little CPU overhead.
You could nest an iframe in another site / page and point the iframe on your current page to that one.
This would obfuscate it to some degree but if someone is intent on finding the URL, chances are they will.