As many know, if you serve a page over https and the content loads resources (images, stylesheets, js, SWF objects, etc) over http, older versions of Internet Explorer will show the user a warning saying "This page contains both secure and non-secure items". This is discomforting to many non-technical users.

Usually, I can look at the HTML source and identify which item(s) are triggering this error. Sometimes a Flash object will load something else or some embedded javascript will put a new object in the DOM and trigger this.

What tools are good for quickly tracking down the source of the warning?

Firebug doesn't go deep enough on Flare requests. Fiddler might do the trick. What I'm really hoping for is that there's a special purpose tool just for this oh-so-common IE annoyance.
–
Doug HarrisAug 9 '10 at 16:54

"...older versions of Internet Explorer will show the user a warning..." - Any browser, any version AFAIK - providing the option is switched ON in the browser. (?)
–
w3dAug 9 '10 at 18:44

6 Answers
6

Fiddler is what I normally use. Its an http sniffer and will show you all the requests that make up your page. On a secure page they should be shown with a padlock to signify the use of SSL and be listed with the protocol HTTPS. Anything that isn't like this is being served in an insecure manner.

When I'm trying to find all the files that are requested by a page, FireBug is my #1 choice. But if you need more details, I recommend another Firefox extension called Live HTTP Headers. In the option of that Add-on you can filter the type of files you want to "track" so you can configure it to track http requests in an https environment.

Just make sure that you don't forget to close the add-on when you are done because if you keep it open, it'll take all of your system resources.

You can use a web debugging tool like Fiddler to track which element isn't going over HTTPS or check the server logs to see which one isn't using port 443.

If the warning persists, you may have to inspect your JavaScript & CSS code for references to any files, as explained here

Update: I noticed that when you run a test on WebPageTest.org for a HTTPS URL, the secure page elements are shown with a lock in front of their URL in the details page of the Waterfall chart. I've tested this with a secure page but not with one containing mixed content and I guess it will differentiate between the two. This maybe a better tool to use as no installation is required and as the service is online, it can work on any OS including Mac.

We've made a tool for that – SslCheck. We've got tired of checking every web page manually and created a crawler. It goes through all pages and shows you which ones have "non-secure" content. All you need to do is enter you root URL. Hope it saves someone some time.

You could open the page in another browser and check out that browsers debugging tools. Most other browsers offer some kind of list of the files that were included, sometimes including images. Of course, this won't work if you are including a bunch of other stuff that isn't included when only in IE.

Are you doing anything with Ajax or otherwise potentially involving dynamic iframes? There's an IE bug which will trigger the non-secure content warning if you have an iframe with no source set - so even if there isn't any content on the page from a non-secure domain you get the warning. Try setting the src to javascript:false.