The problem
Let’s say that I have a web server running a secure site (it’s using https, or SSL if you prefer). On this page I have an embedded Youtube video, and since Youtube doesn’t have https support it will use the unencrypted http instead. Why should this be a problem? Well for some people it isn’t a problem, but if you (for some strange reason) use Internet Explorer you will get a warning saying that the website contains mixed content and may not be secure. Of course, this warning could be a good thing, but 99,5% of the time it’s just a pain in the ass and might scare off your visitors or hide information you want them to see.
Solution
This solution is for Apache web servers but you can most likely do something similar for IIS using ISAPI_Rewrite.
First off, make sure that your Youtube links are stripped of the “http://” part. So your link should look like this “www.youtube.com/v/wRE4KCPKXhs” (without the quotation marks). What this means is that when your page tries to embed the Youtube video you web server will look after a local folder called “www.youtube.com/v/wRE4KCPKXhs”, which I guess that you don’t really have. But don’t worry we’re going to fix that.
In the root of your website open (or create) the file .htaccess (don’t forget the initial dot) and type in these rows:
RewriteEngine On
RewriteBase /
RewriteRule www.youtube.com/(.*) http://www.youtube.com/$1 [L]
This will tell your web server that when a user looks for the folder www.youtube.com/(anything) it will instead locally redirect them to http://www.youtube.com/(anything) but for the viewer it will look as if it came directly from your page and therefore bypass the mixed content warning that Internet Explorer gives.
I have so far only tested this on Internet Explorer 7 and 8, so I don’t know about how well it works with Internet Explorer 6 or 9 (but I don’t see why it wouldn’t work).
Another problem I’ve seen that causes this warning is when you use “javascript:void(0)” in your code, unfortunately I have no solution for this except rewriting your JavaScript.
Good luck, and feel free to post comments or questions below.
Keep posting stuff like this i really like it
Google has rolled out HTTPS support on YouTube.
You can now simply use the HTTPS version of any YouTube URL, such as:
https://www.youtube.com/v/wRE4KCPKXhs
and should now work without needing this (quite cool) hack.
Cool, I had totally missed that. This hack still works for all other non secure web pages though. Let’s say I wanted to put an image from another server which doesn’t have SSL, then it would work perfectly. But I’m guessing by visiting your website that you already know that!