This question already has answers here:
Overcoming "Display forbidden by X-Frame-Options"
(27 answers)
Closed 6 years ago.
I tried creating an iframe. I have created an iframe before. But this one doesn't seem to work no matter what I do.
<!DOCTYPE html>
<html>
<head>
<title>DSCOVR</title>
</head>
<body>
DSCOVR:
<iframe src="http://epic.gsfc.nasa.gov/index.html" width="100%" height="1000px">loading...</iframe>
</body>
</html>
Link to jsfiddle with my code
It doesn't seem to work with any other websites either.
Open your browser's developer tools. Look at the console.
Mixed Content: The page at 'https://jsfiddle.net/mmzj1uge/' was loaded over HTTPS, but requested an insecure resource 'http://epic.gsfc.nasa.gov/index.html'. This request has been blocked; the content must be served over HTTPS.
You can't embed insecure content into an otherwise secure page.
If you look at the warnings (with Safari), there is one that says:
[blocked] The page at about:blank was not allowed to display insecure content from http://epic.gsfc.nasa.gov/index.html.
Like Quentin said:
My guess is that JSFiddle won't embed HTTP stuff because JSFiddle's website is HTTPS secured, and if it did, it would compromise security.
Hope this helped!
Related
Hopefully I can explain this correctly. I have recently been moved to a Windows 10 VM from Windows 7 and I'm trying to get a site for my team at work to display properly in Edge. I have a WebPart linking to CSS that is displaying everything as one large list instead of a table with dropdowns. When I open the HTML page on its own in Edge it displays fine, but with code in SharePoint it is not working correctly. Any ideas of why this could happen?
What should display
What is displaying in SharePoint
EDIT
After opening developer tools I find that I am receiving a SEC7111 error code on my CSS file that is being linked. Looking other places for solutions to this too, but any help is greatly appreciated!
FINAL EDIT
With the SEC7111 error I found out that the "file://" links I used for the CSS weren't going to work because they weren't considered "secure" (Although I got the same error in IE, but never had this display issue..?) So, I moved my linked CSS file to a secure folder in another SharePoint site I have, linked the CSS from there, and now it's working!
There are some ways that you can use to solve your problem (It's better to share your code within your question to get a better answer). So, I offer you below solutions:
Solution 1
Please don't use file:// for the published site in the webserver. HTML rendered on the client so you cannot access the local files. so you should not use the file://. you can read more about security concerns and more details on the file protocol here: (https://en.wikipedia.org/wiki/File_URI_scheme)
Instead of using local file protocol, you can use the Absolute/Relative path to your CSS on the HTTP/HTTPS protocols
Solution 2
Add X-UA-Compatible meta tag or HTTP response header to force IE to run with legacy document mode: 5, 7, 8.
X-UA-Compatible meta tag:
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8" />
...
</head>
<body>
</body>
</html>
X-UA-Compatible HTTP response header:
<!DOCTYPE html>
<html>
<head>
<title>My favorite app</title>
</head>
<body>
<iframe src="https://stackoverflow.com/questions/36047483/parsing-a-websites-
html-tags-in-iframe"></iframe>
<div class="title">My App</div>
<div class="app">
<div class="image"><img src="images/app.png" alt="this is a
screenshot" class="image"></div>
</div>
</body>
</html>
i tried to use iframe tag but it doesn't work and a blank section is appeared as that image.
the blank section that appears to me in the browsers.
That's because Stack Overflow disallows use inside a frame by setting X-Frame-Options to sameorigin...
So only is allowed as iframe inside Stack Overflow itself, not from your code.
Long version:
When your browser try to access that URL from Stack Overflow, Stack Overflow returns some headers, one of them is X-Frame-Options: sameorigin, that instructs your browser to disallow to display that URL inside an IFrame, so your browser refuse to do it.
Its a SO server config (you can't do anything about it).
The Stack Overflow page you reference in the src attribute is not displayed in the iframe element because the Stack Overflow 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 the URL you tested:
Notice x-frame-options: SAMEORIGIN in the lower right part of the screenshot. With x-frame-options: SAMEORIGIN or 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/index.php/Tomcat.
I'm trying to enable HTTPS on my website, and I'm running into an issue where the https web page is importing js/css/fonts/etc from https locations, but the browser is seeing some (not all) of these as http links.
See example on JSFiddle:
<html>
<head>
<!-- This loads correctly as HTTPS content -->
<script type="text/javascript" src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<!-- This is blocked by the browser as Mixed Active Content, even though the page scheme is https -->
<script type="text/javascript" src="//highcharts.com/highslide/highslide-full.min.js"></script>
<!-- Explicitly setting `https` does not change the result -- it still considers this `http` -->
<script type="text/javascript" src="https://highcharts.com/highslide/highslide-full.min.js"></script>
</head>
<body>
<p>Lorem ipsum</p>
</body>
</html>
What is going on? Is the problem at the source? Why does it appear that the browser is arbitrarily replacing https with http? Is it pulling from its cache? (I've tried using Ctrl-F5; is there a better way to rule this out? Why would it not also have cached JQuery the same way?)
This looks to be the same question as How to fix "Blocked loading mixed active content" for css and js over https but the accepted solution there did not help. It's difficult to find other related questions because everything I see seems to just be explaining super-basic Mixed Active Content – that you can't use both http and https in the same page, which I already understand.
I got a code that refreshes the html page as per the seconds I desire. I am on an Mac and I use the TextEdit app to make the HTML file. This code works for www.apple.com but it does not work for say, https://www.bitcointalk.org or http://www.macrumors.com.
I am not sure why this is happening. All I am doing is replacing the apple URL with bitcointalk url. I know I can also do this refreshing via Safari extension, but I need this code to work.
Thanks a lot
The code I am using is:
<html>
<head>
<meta http-equiv="refresh" content="5">
</head>
<FRAMESET>
<FRAME src="http://www.apple.com/">;
</FRAMESET>
</html>
EDIT: What I am trying to do is, create this html and move it to my iPhone, so that I can do the web refresh through my phone. Right now there are only paid apps in the App store that lets you refresh a page automatically every few seconds/minute and they are not really that good.
As #esqew pointed out in their comment, the sites that aren't showing up forbid access via frames by setting the X-Frame-Options HTTP header to DENY or SAMEORIGIN.
See https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Overcoming “Display forbidden by X-Frame-Options”
I have this HTML code on a server (Heroku). From the iframe of www.example.com I click on the "login to google" button, but I get this error message:
Refused to display document because display forbidden by X-Frame-Options
I tried adding the <meta http-equiv="X-Frame-Options" content="GOFORIT"> on the header of www.example.com but still doesn't work. Any ideas? Thanks
<html>
<head>
<title>Test</title>
</head>
<body>
<iframe src="http://www.example.com" width=1000 height=1000></iframe>
</body>
</html>
You have to use real HTTP response headers. <meta http-equiv> isn't really equivalent.
How you set those depends on your server and/or server side programming language.
e.g. for Apache, with mod_headers:
Header set X-Frame-Options GOFORIT
… will do the job.