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.
Related
I've just created my own website with my own domain with IONOS.
On the side, I had created a webpage which was hosted using XAMP, so currently to view my webpage I have to use the URL http://localhost/project1/index.html#
However, I'd like to integrate it into my website if possible?
For example have a section on my webpage where I show a thumbnail of the webpage and when clicked it takes me to www.mywebsite.co.uk/project1
I'm not sure how to go about this though?
You can use Iframe.
See Html Standard and w3schools for more detail about it.
like:
<iframe src="https://www.w3schools.com" title="W3Schools Free Online Web Tutorials"></iframe>
The <iframe> tag specifies an inline frame. An inline frame is used to embed another document within the current HTML document.
<iframe src="www.mywebsite.co.uk/project1" title="My HTML Page"></iframe>
This is my current website: http://acrossuhubsubmissions.tumblr.com/ .
As you see, I'm using iFrames to embed part of the Dropbox onto my tumblr website. The Dropbox page is a public sharing page. The html code that I'm using to display the Dropbox:
<left>
<iframe src ="https://www.dropbox.com/sh/d9ulw65twvxrrhi/AACHsXLlXUSan4Zx4hGC8BDja?lst" width="777px" height="777px" scrolling="yes" >
<p>Your browser does not support iframes.</p>
</iframe></left>
I used the exact same code for the Google speadsheet webpage, and that seemed to show up. Does anyone know why the Dropbox webpage isn't showing up on my tumblr page?
I was able to embed a Dropbox video like this;
First, create a share link to the video, then modify the link by changing the ?dl=0 at the end to ?raw=1 and then using this code...
<iframe width="800" height="450"
src="https://www.dropbox.com/s/nwg6px2i8si18w9/Oh%20Deer%21.mp4?raw=1
&autoplay=1" frameborder="0" allowfullscreen></iframe>
NOT recommended for high bandwidth uses, as you might be banned from Dropbox (read this https://www.dropbox.com/help/security/banned-links.)
It is not possible to display that dropbox link in an iFrame not originating from outside the dropbox.com domain. The reason why is because they include the following header in their response:
X-Frame-Options SAMEORIGIN
see https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options for more information on this header. Browser supporting this flag will not load the content in an iframe.
See the documentation on dropbox how to user their api to embed content:
https://www.dropbox.com/developers/dropins
Better use OneDrive, it gives you embed link. [I know it's an old question but it might be helpful if you didn't knew it already]
You can use the "public link".
Copy the file into the dropbox public folder and now you can use the public link to embed in a frame.
I am trying to iframe a page containing a streaming video. The streaming video does not work when I view the iframe. It works fine when the original page is viewed directly in browser. What am I missing here? Is the stremaing video protected by some mechanism that does not let is display within the iframe?
Please also suggest any alternative solution to be able to display external streaming videos on my site.
Thanks!
The iframe code is
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<BODY>
<iframe src="http://aajtak.intoday.in/livetv.php" width='800px' height='1000px' />
</BODY>
</HTML>
In your screenshot, you are showing you are trying this from a file:// URL.
I don't know which security shenanigans are involved (The browser's or Flash's), but I'm fairly sure it will go away if you use a http:// URL instead.
Working JSFiddle
It's because of Cross Origin problem. Since you are using file://, it cannot play the video from 'http://' or 'https://'. If you can run your page in 'http://' or 'https://' at localhost, you will make it easy to work. In addition, if it does not work, you can set 'cross-origin' as 'anonymous'.
I am trying to develop a page in which I can show more than 3 website at a time,
as below:
<ul>
<li>
<iframe src="http://www.facebook.com/" /><p> iframe is not supported</p>
</li>
<li>
<iframe src="http://www.yahoo.com/"></iframe>
</li>
<li>
<iframe src="http://www.google.co.in"></iframe>
</li>
</ul>
The problem is that it shows yahoo.com and google.co.in, but does not display Facebook in the iframe.
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.
SAMEORIGIN = only a page which is in same domain can load this website in iframe.
Since some websites have decided to disable embedding them in iframes theres nothing you can do with pure html solutions. You could create a serverside script (in PHP) that pulls the target site via your webserver and then use the html etc.
The only way I can think of that would enable you to check wether the site has loaded is to search the iframe for a specific element that exists on the target website (for example a div with a specific id or class on the Facebook's front page). The reason would be that different websites can handle being embedded into iframes differently and while some might display some content, some may display nothing etc and the only way to be sure is to check for real elements.
facebook does not want you to load their main site in frames
<iframe src="http://m.facebook.com/" width="200" height="300" scrolling="auto" frameborder=0></iframe>
width="200" height="300" can be adjusted accordingly.*
What this does is load the mobile version of facebook in the frame instead of the main site.
Reference
You can use the object tag:
<object data = "https://facebook.com"></object>
You will not able to do that, you can only iframe like button... someother not whole site.
I ran into an issue where one of my customer's browser does not support iFrames (rather his Outlook does not). Without using iFrames, how can i display another page's content inside Html? Original iFrames insert looked as following:
<iframe src="http://mybox:8081/blah/report.jsp" width="1000" height="420">
<p>Your browser does not support iframes.</p>
</iframe>
Please advise. Thank you.
You cannot without using an iFrame.
Your options are even more limited because you're working with an email client. HTML in email clients are very finicky.
It seems you are using an email client, which definitely doesn't support iFrames, but for reference, you can do this with jQuery on a website.
$(document).ready(function() {
$(".yourSelector").load("/pages/pageyouwanttoloadhtmlof.html");
});
Please note that .load will strip out scripts in most cases (there are uses that won't), and also note that you cannot load content from different domains than yours. (There are ways around this with things like jsonP, but that gets quite complicated, and you pretty much still have to control both domains.
You can use a DIV to display it, another page content should set using DIV's inner html property