Skip to content
This repository

issue with datauri test on https in ie7 #362

niallcollins opened this Issue · 7 comments

5 participants

niallcollins Paul Irish barkan Chris Barber Stu Cox

I am using this Modernizer test to test if a data uri is supported in the rendering browser.

(function (undefined) {
    "use strict";
    // create an image object
    var datauri = new Image();

    // assign the error event to it
    datauri.onerror = function() {
        Modernizr.addTest('datauri', function() { return false; });

    // assign on load event to it
    datauri.onload = function() {
        Modernizr.addTest('datauri', function() { return (datauri.width === 1 && datauri.height === 1); });

    // set a base64 source to the image for the test
    datauri.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";

This works fine. However in IE7 when this test is run on https page, no issue on http pages, then I get a pop up asking "The page contains both secure and non secure items etc etc". When I remove the test the issue goes away.

Anyone have any ideas why and how I could fix it?

Paul Irish

i dont know an easy fix.

you could create an iframe where you execute that test... maybe? :/


The entry point to my site will be a http page. What if I performed the above check on this entry page, set a cookie and in future when the cookie exists read from this, otherwise perform the test?

Would this be a better and more performant option than creating an iframe on all pages as part of the test? Or even creating it on https pages.

Feedback appreciated on this.


considering that IE7 doesn't support datauris without a lot of shenanigans, would browser sniffing be an appropriate fallback here?


Yes I reluctantly in the end with browser sniffing. So at the start of my test, I checked for IE7 or before browsers and if the current page is https - then the datauri test failed. Otherwise, I progressed with the test. Not ideal but couldn't find another way out of this.

Chris Barber

I managed to fix this by adding

if(($.browser.msie !== undefined) && ($.browser.version == '7.0')) { return false; }

to the two methods which use data:image

Stu Cox

Just found this. Yeah, as @chrisbarber86 suggests, we might as well just blacklist IE7 with a UA sniff — we know it doesn't support data URIs anyway. I'll do it at some point.

Stu Cox stucox reopened this
Stu Cox stucox closed this
Stu Cox

Fixed by #876

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.