By georgephillips


2013-08-20 05:04:17 8 Comments

I load some HTML into an iframe but when a file referenced is using http, not https, I get the following error:

[blocked] The page at {current_pagename} ran insecure content from {referenced_filename}

Is there any way to turn this off or any way to get around it?

The iframe has no src attribute and the contents are set using:

frame.open();
frame.write(html);
frame.close();

9 comments

@Star TechTricks 2020-03-29 20:20:47

All you need to do is just use Google as a Proxy server.

https://www.google.ie/gwt/x?u=[YourHttpLink].

<iframe src="https://www.google.ie/gwt/x?u=[Your http link]"></frame>

It worked for me.

Credits:- https://www.wikihow.com/Use-Google-As-a-Proxy

@Star TechTricks 2020-05-18 04:16:56

Where you are trying to use it.

@EgoPingvina 2020-07-15 13:18:26

It does not work.

@tanius 2014-09-04 17:51:08

Use your own HTTPS-to-HTTP reverse proxy.

If your use case is about a few, rarely changing URLs to embed into the iframe, you can simply set up a reverse proxy for this on your own server and configure it so that one https URL on your server maps to one http URL on the proxied server. Since a reverse proxy is fully serverside, the browser cannot discover that it is "only" talking to a proxy of the real website, and thus will not complain as the connection to the proxy uses SSL properly.

If for example you use Apache2 as your webserver, then see these instructions to create a reverse proxy.

@kolen 2018-07-03 15:52:41

mitmproxy is a debugging tool, not production proxying system. ngrok is tunnelling service, mostly for development servers, I don't understand how it can be useful for this.

@tanius 2019-10-12 18:30:10

@kolen It's not about the tools, it's about the idea of using a reverse proxy for this, not mentioned in the other answers yet. Changing to Apache now, which is a much more common way to do a reverse proxy.

@Matthew Peters 2014-08-07 18:27:27

Note: While this solution may have worked in some browsers when it was written in 2014, it no longer works. Navigating or redirecting to an HTTP URL in an iframe embedded in an HTTPS page is not permitted by modern browsers, even if the frame started out with an HTTPS URL.

The best solution I created is to simply use google as the ssl proxy...

https://www.google.com/search?q=%http://yourhttpsite.com&btnI=Im+Feeling+Lucky

Tested and works in firefox.

Other Methods:

  • Use a Third party such as embed.ly (but it it really only good for well known http APIs).

  • Create your own redirect script on an https page you control (a simple javascript redirect on a relative linked page should do the trick. Something like: (you can use any langauge/method)

    https://example.com That has a iframe linking to...

    https://example.com/utilities/redirect.html Which has a simple js redirect script like...

    document.location.href ="http://thenonsslsite.com";

  • Alternatively, you could add an RSS feed or write some reader/parser to read the http site and display it within your https site.

  • You could/should also recommend to the http site owner that they create an ssl connection. If for no other reason than it increases seo.

Unless you can get the http site owner to create an ssl certificate, the most secure and permanent solution would be to create an RSS feed grabing the content you need (presumably you are not actually 'doing' anything on the http site -that is to say not logging in to any system).

The real issue is that having http elements inside a https site represents a security issue. There are no completely kosher ways around this security risk so the above are just current work arounds.

Note, that you can disable this security measure in most browsers (yourself, not for others). Also note that these 'hacks' may become obsolete over time.

@georgephillips 2014-09-03 01:52:32

Great answer, thanks. Just to let you know in chrome the JS redirect method does not work just prevents the change (as it does when you try load it normally).

@tanius 2014-09-06 14:29:20

To get the "I'm feeling lucky" forwarder method to work, see this related answer. It will lead you to the first Google result, so it obviously only works only when your intended target target page is in the Google index already, and you find a query that returns it on top.

@Matthew Peters 2014-09-07 15:37:43

The I'm feeling lucky with just the API is a workaround in cases where you do not have access to write code and can only put in a uri.

@Matthew Peters 2014-09-11 14:51:27

@Jude, what does that link tell us?

@Jude 2014-09-12 06:06:21

@MatthewPeters, Good solution though. I used it with little bit modification https://www.google.com/webhp?#q=http://www.yourhttpsite.com&‌​btnI=I. I suppose btnI=Im+Feeling+Lucky no more working. I thinks that bit was replaced by btnI=I.

@Andreas Gohr 2014-11-25 15:07:09

The redirect trick seems to work in Firefox only. Chrome still denies loading the insecure content. Are there any other known workarounds?

@vrijdenker 2014-12-16 13:11:23

This is not a solution because it only works in Firefox

@Matthew Peters 2014-12-19 16:23:28

@vrijdenker, at the time, the proxy by google worked in more browsers. Like I said, over time solutions will become obsolete as these are mere hacks. The question itself is flawed because it assumes there is a permanent solution other than 'no, it cannot be done by design.'

@Brad Peabody 2014-12-29 20:55:45

It looks like this is not enforced if the https parent is localhost regardless of the http iframe but I haven't seen this documented anywhere. This is making test results inconsistent - any way to make this always enforced?

@kako-nawao 2015-02-10 15:39:04

Just wanted to signal out that the "Create your own redirect script on an https page you control" method no longer works with current versions of Chrom(e|ium) and Firefox, even using JS.

@matteo 2017-01-02 20:31:58

I guess this worked when posted, but it doesn't anymore. "Refused to display 'google.es/search?q=%25http://…' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'

@Tarun Gupta 2017-01-05 14:12:52

Using Google as the SSL proxy doesn't work for me either

@Sam Denty 2017-02-09 22:15:08

This answer is invalid to date, any other solutions

@Nitin 2017-05-16 19:44:35

The answer should have an option to be labeled as 'deprecated'. It creates confusion unless you read all the comments.

@duskwuff -inactive- 2018-01-26 08:05:24

I've added a note to the top of the post explaining what's changed.

@kolen 2018-07-03 15:55:26

Abusing search engine as automatic redirector is insane and horrible idea, regardless if it works or not.

@David Guan 2017-03-02 10:17:50

Using Google as the SSL proxy is not working currently,

Why?

If you opened any page from google, you will find there is a x-frame-options field in the header. Google response 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 <frame>, <iframe> or <object>. Sites can use this to avoid clickjacking attacks, by ensuring that their content is not embedded into other sites.

(Quote from MDN)

One of the solution

Below is my work around for this problem:

Upload the content to AWS S3, and it will create a https link for the resource.
Notice: set the permission to the html file for allowing everyone view it.

After that, we can using it as the src of iframe in the https websites. AWS

@Addeladde 2013-11-02 21:12:10

You will always get warnings of blocked content in most browsers when trying to display non secure content on an https page. This is tricky if you want to embed stuff from other sites that aren't behind ssl. You can turn off the warnings or remove the blocking in your own browser but for other visitors it's a problem.

One way to do it is to load the content server side and save the images and other things to your server and display them from https.

You can also try using a service like embed.ly and get the content through them. They have support for getting the content behind https.

@Addeladde 2014-05-13 13:41:23

if you scrape the content and show it on your site their is Always the risk of cross site scripting. So a god solution is to scrape the content on a separate url and present the data in an iframe from that url with https. In that way you prevent crosssite scripting on your mainsite and session hijacking.

@user2523022 2017-01-30 18:41:29

add <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> in head

reference: http://thehackernews.com/2015/04/disable-mixed-content-warning.html

browser compatibility: http://caniuse.com/#feat=upgradeinsecurerequests

@Felix 2017-02-20 21:12:54

This solution doesn't allow you to serve http content on a https site. All this does is force http requests as https requests. If the resource doesn't exist on https you'll just get a 404 error instead.

@Fernan Vecina 2017-12-14 03:41:09

This is actually works at least for my needs.. tested it with firefox and confirmed working. My issue is source URL isn't HTTPS compliance while my own website is using HTTPS.

@Mohamed Azharuddin 2019-09-09 07:10:31

Working like charm in chrome Version 76.0.3809.132 (Official Build)

@David R. 2015-05-19 06:10:51

I know this is an old post, but another solution would be to use cURL, for example:

redirect.php:

<?php
if (isset($_GET['url'])) {
    $url = $_GET['url'];
    $ch = curl_init();
    $timeout = 5;
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
    $data = curl_exec($ch);
    curl_close($ch);
    echo $data;
}

then in your iframe tag, something like:

<iframe src="/redirect.php?url=http://www.example.com/"></iframe>

This is just a MINIMAL example to illustrate the idea -- it doesn't sanitize the URL, nor would it prevent someone else using the redirect.php for their own purposes. Consider these things in the context of your own site.

The upside, though, is it's more flexible. For example, you could add some validation of the curl'd $data to make sure it's really what you want before displaying it -- for example, test to make sure it's not a 404, and have alternate content of your own ready if it is.

Plus -- I'm a little weary of relying on Javascript redirects for anything important.

Cheers!

@Sibidharan 2016-02-15 15:13:58

This is pretty working, but the links inside the site are getting invalid. For example, I have a domain called example.com which has a SSL. I am embedding a iframe with example.net which has no SSL. The example.com has a link like href="/path/file.html" and while clicking it, it is opening as https://example.com/path/file.html instead of http://example.net/path/file.html

@Anthony Mason 2016-07-13 19:55:35

The link cannot be relative if you would like this to work. In other words, specify the full URL within the href. If this is dynamic there are libraries to grab each segment of the URL in Javascript as well as server side.

@Raju yourPepe 2019-02-28 09:21:53

css of the target site under iframe is broken . Please check

@panpernicek 2014-08-14 03:09:15

Based on generality of this question, I think, that you'll need to setup your own HTTPS proxy on some server online. Do the following steps:

  • Prepare your proxy server - install IIS, Apache
  • Get valid SSL certificate to avoid security errors (free from startssl.com for example)
  • Write a wrapper, which will download insecure content (how to below)
  • From your site/app get https://yourproxy.com/?page=http://insecurepage.com

If you simply download remote site content via file_get_contents or similiar, you can still have insecure links to content. You'll have to find them with regex and also replace. Images are hard to solve, but Ï found workaround here: http://foundationphp.com/tutorials/image_proxy.php

@antidote 2019-07-25 12:46:32

This will not work, since many pages behind iframe don't want to be embedded in an iframe and thus set X-Frame-Options Header to SAMEORIGIN. Even if you are able to bypass this using the proxy, the page would try to load something like /insecurepage.css and your browser will request yourdomain/insecurepage.css

@Grant 2014-03-24 18:42:33

You could try scraping whatever you need with PHP or another server side language, then put the iframe to the scraped content. Here's an example with PHP:

scrapedcontent.php:

<?php
$homepage = file_get_contents('http://www.example.com/');
echo $homepage;
?>

index.html:

<iframe src="scrapedcontent.php"></iframe>

@dotancohen 2014-05-11 06:54:38

How will you handle images, included JS and CSS files, hyperlinks, and AJAX requests?

@Grant 2014-06-10 02:57:47

@dotancohen you're right, it isn't a perfect solution, but I think it is the best for this situation. Some sites you won't run into the problems you discussed.

@ChristoKiwi 2015-01-12 00:56:43

This works, but its effectively double loading the content and therefore loading time as your server scrapes and then re-serves the content...

Related Questions

Sponsored Content

35 Answered Questions

[SOLVED] An invalid form control with name='' is not focusable

  • 2014-03-03 13:29:20
  • mp1990
  • 535081 View
  • 685 Score
  • 35 Answer
  • Tags:   html validation

8 Answered Questions

23 Answered Questions

[SOLVED] How to make JavaScript execute after page load?

27 Answered Questions

[SOLVED] How to apply CSS to iframe?

  • 2008-10-20 08:27:14
  • John
  • 1219096 View
  • 1035 Score
  • 27 Answer
  • Tags:   html css iframe rss

8 Answered Questions

[SOLVED] How are parameters sent in an HTTP POST request?

38 Answered Questions

[SOLVED] How can I make a div not larger than its contents?

  • 2009-01-16 16:03:07
  • George Snider
  • 1469160 View
  • 2116 Score
  • 38 Answer
  • Tags:   html css width

11 Answered Questions

14 Answered Questions

[SOLVED] jQuery/JavaScript: accessing contents of an iframe

8 Answered Questions

[SOLVED] <meta charset="utf-8"> vs <meta http-equiv="Content-Type">

Sponsored Content