How to allow http content within an iframe on a https site

Question

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

User · Answer

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.

User · Answer

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

User · Answer

add  lt meta http-equiv  quot Content-Security-Policy quot  content  quot upgrade-insecure-requests quot  gt  in head  reference  http   thehackernews com 2015 04 disable-mixed-content-warning html browser compatibility  http   caniuse com  feat upgradeinsecurerequests

User · Answer

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    lt  php  homepage   file get contents  http   www example com     echo  homepage    gt    index html    lt iframe src  scrapedcontent php  gt  lt  iframe gt

User · Answer

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       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  lt frame gt    lt iframe gt  or  lt object gt   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

User · Answer

All you need to do is just use Google as a Proxy server  https   www google ie gwt x u  YourHttpLink     lt iframe src  https   www google ie gwt x u  Your http link   gt  lt  frame gt    It worked for me   Credits - https   www wikihow com Use-Google-As-a-Proxy

User · Answer

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

User · Answer

Try to use protocol relative links  Your link is http   example com script js  use   lt script src  quot   example com script js quot  type  quot text javascript quot  gt  lt  script gt   In this way  you can leave the scheme free  do not indicate the protocol in the links  and trust that the browser uses the protocol of the embedded Web page  If your users visit the HTTP version of your Web page  the script will be loaded over http    and if your users visit the HTTPS version of your Web site  the script will be loaded over https     Seen in  https   developer mozilla org es docs Seguridad MixedContent arreglar web con contenido mixto

User · Answer

I know this is an old post  but another solution would be to use cURL  for example   redirect php    lt  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    lt iframe src   redirect php url http   www example com   gt  lt  iframe gt    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

User · Answer

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 amp 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

[html] How to allow http content within an iframe on a https site

Examples related to html

Examples related to security

Examples related to http

Examples related to iframe

Examples related to https