Why is IE8 incorrectly complaining about loading non-secure elements?

Question

I manage an e-commerce site running under SSL.

The problem is happening on the final page of my site's shopping cart that loads under SSL. The problem is that Internet Explorer 8.0 (including version 8.0.6001.18702 and other versions of IE8, but reportedly not all versions of IE8) complain about at least one non-secure element loading, which is scaring away some of my prospective customers. IE8 displays a dialogue box after the page has apparently fully loaded (with seemingly no missing images) that says:

"Security Warning: Do you want to view only the web page content that was delivered securely? This webpage contains content that will not be delivered using a secure HTTPS connection, which could compromise the security of the entire web page. (YES/NO)"

I tried to track down all invalid images and links that may be loading via HTTP, but no to avail. Firebug Lite shows nothing non-secure. I'm starting to think this may be a bug within IE8 that was corrected in IE9, which does not complain.

TO REPRODUCE THIS ERROR: Click here using IE8 (or Chrome) to add an item to your shopping cart. On the resulting page, click on the GREEN button on the right that says, "Proceed to Secure Checkout." You will notice that you see the above "Security Warning" from IE8.

QUESTION: How can I determine what the browser is attempting to load non-securely, or how can I suppress the "Warning" message?

UPDATE: It seems the "Security Warning" is due to the suspended JavaScript execution on this page. But the same question still remains. How can the "Security Warning" message be suppressed or "debugged"?

Answer 1

Wireshark is usually pure overkill if its used to debug standard web browser based applications because it provides way to many information which are usually not required to exactly pinpoint the problem. A much better solution in this case would be to use Fiddler which is a simple yet a very powerful debugging proxy which is, aside from its many useful functionalities, also able to clearly distinguish between SSL and non-SSL traffic.

Its also able to simulate a "man in the middle" testing environment which effectively allows it to decipher SSL traffic. Of course the generated "on the fly" certificate is clearly marked as untrusted in all browsers to prevent misusing it.

EDIT: I followed the given instructions in order to provoke the problem yet I had no problems with any kind of security warnings in IE8. Also Fiddler is showing that all the resources are loaded through SSL.

Answer 2

I know this is an old post, but since there wasn't an answer posted that fixed my similar situation, I thought I'd shared what I found in case anyone else stumbles onto this page. If you use removeChild() to remove an HTML element that contains an inline style setting a background image, the warning occurs in older versions of IE8. You can get rid of the warning by moving the inline style setting the background image into a style class set in the HTML head or external style sheet.

See this Microsoft KB Page, which says the glitch only occurs in IE6 and IE7, but it happened to me on IE8 on XP, too, and the same fix worked.

Answer 3

I ran into a similar problem in the past with IE8, and what it appeared to be was an issue with cached items. I wasn't able to completely pin it down because, like you, I checked every asset and found nothing that was not loading via SSL. However, I noticed that if I prevented all caching and forced IE to load all assets from the server, the warning disappeared.

I don't know if there's a bug where certain items pulled from cache don't get recognized as secure, but it seemed to have something to do with it.

Disabling caching is obviously a bad way to solve a problem that only impacts a subset of browsers, but it might be a tip that could lead you in the right direction.

Answer 4

Click checkout at the top of the page?

Not in https anymore is it?

Answer 5

If you have SSL-backed pages, then every assets (js, css, images) should be served by HTTPS protocol too. It's the same behaviour for 90% browsers

Answer 6

As Jon stated:

If you use removeChild() to remove an HTML element that contains an inline style setting a background image, the warning occurs in older versions of IE8. You can get rid of the warning by moving the inline style setting the background image into a style class set in the HTML head or external style sheet.

While the Microsoft KB Page does provide the fix, the best solution is to implement it as follows (place in a script at the bottom of your page):

Ext.removeNode = Ext.isIE ? function(){
    return function(n){
        if(n && n.tagName != 'BODY'){
            n.outerHTML = "";
        }
    }
}() : function(n){
    if(n && n.parentNode && n.tagName != 'BODY'){
        n.parentNode.removeChild(n);
    }
}