¿Cuáles son exactamente las reglas para evitar la advertencia de "contenido mixto" en IE debido a imágenes de fondo?

Esto está relacionado con SSL and mixed content due to CSS background images pero esa pregunta no tuvo respuesta aceptada y la que estoy preguntando es un poco más específica.¿Cuáles son exactamente las reglas para evitar la advertencia de "contenido mixto" en IE debido a imágenes de fondo?

En algunas circunstancias, al acceder a un sitio web HTTPS, IE lanzará la advertencia de "contenido mixto" si a un elemento se le asigna un estilo con una imagen de fondo. He encontrado one forum reference que dijo que la advertencia puede evitarse si se pone la referencia en una hoja de estilo, por ejemplo

#someElement a { 
    width:11px; 
    height:11px; 
    display:block; 
    overflow:hidden; 
    background:url(../images/sprites_list.png) no-repeat; 
    cursor:hand; 
    cursor:pointer; 
    background-position:0px -72px; 
}

pero no si se intenta crear la línea elemento, a la

$('#someElement').append("<a title='something' style='background: url(../images/sprites_list.png) no-repeat; ... // etc

y de hecho , esto funciona para mi He visto otros que dicen que debe usar una URL absoluta de https para referirse a la imagen, en lugar de una relativa.

¿Cuál es la historia real aquí? ¿Hay alguna explicación "oficial" o al menos una referencia a cuáles son las reglas? O, en su defecto, ¿existe un conjunto estándar de directrices que, si se siguen, hace que sea extremadamente improbable que se active la advertencia?

Fuente

2011-08-05 Dan

También puede usar un protocolo relativo: http://paulirish.com/2010/the-protocol-relative-url/ – js1568

Interesante. Voy a investigar eso. Pero realmente necesito URLs relativas porque es un archivo CSS estático y no "sé" la base de URL absoluta para el resto de mi contenido estático. – Dan

Para su información, la URL relativa al protocolo _no_tratará con este error IE8 en particular si está configurando imagen de fondo a través de JavaScript. Debe utilizar la URL completa, incluidos el esquema y el host, para evitar la advertencia de contenido mixto IE8 cuando se realizan manipulaciones de estilo JS. ('element.style.backgroundImage =" //example.com/foo.png "' advertirá.) – medmunds

El uso del URI completo evitará el problema de IE8 y siguientes al crear incorrectamente un URI falso como about: /relative/file.png que desencadena la advertencia de contenido mixto. Este problema se corrigió en IE9.

Fuente

2011-08-05 20:59:04 EricLaw

Gracias esta es la respuesta que estoy buscando. Pero, ¿qué es exactamente 'sobre: relativo'? No he oído hablar de eso antes. Por cierto buen trabajo con Fiddler: es un salvavidas en mis pruebas IE 7 y 8. – Dan

Creo que el "pariente" era solo el pseudocódigo de Eric para algún camino relativo arbitrario. Entonces, escribes "/path/to/file.ext", y supongo que IE convierte eso en "about: /path/to/file.ext", lo cual es obviamente estúpido. – Tom

@Tom es correcto. El problema es que los URI relativos se combinan con un marcado temporal en blanco. Entonces, sobre: blank + /path/to/file.ext produce sobre: /path/to/file.ext, que se trata incorrectamente como inseguro. – EricLaw

Creo que la razón por la que obtiene diferentes resultados no es porque el único método sea "más seguro", sino porque el URL infractor no está presente en el documento base cuando IE lo carga. Supongo que recibirás la advertencia si colocas ese A directamente en el documento en lugar de escribirlo después de que la página se haya cargado.

Si estoy en lo cierto en mi diagnóstico, esto significaría que no existe una peculiaridad todavía no documentada de las reglas sobre el contenido mixto.

También: las URL relativas al protocolo son increíbles. Solo en general.

Fuente

2011-08-05 19:55:41 Tom

Entonces, ¿la regla es que no puedo agregar nuevas referencias al contenido en línea sobre la marcha, incluso si esos enlaces están bajo HTTPS? Si esa es la regla, podría vivir con eso, pero me gustaría obtener alguna confirmación. Además, si esa es la regla, ¿por qué no afecta las etiquetas ordinarias '' que agrego a mi HTML? – Dan

No iría tan lejos como para decir que no deberías hacerlo. Solo creo que eso explica el comportamiento diferente que estás viendo. Leyendo tu comentario en 65Fbef05, estoy un poco perplejo. – Tom

Después de incontables horas del mismo problema, no pude resolver el problema. Luego comencé a elegir mi código fuente y lo encontré. Estoy usando HTML5, y estoy usando un shiv dentro de un comentario condicional para hacer que los elementos HTML5 funcionen en IE8 y hacia abajo.

<!--[if lte IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

Mi problema era que IE8 y abajo estaba lanzando un error. Ese problema se resolvió cambiando la anterior en un https, con lo siguiente:

<!--[if lte IE 8]><script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

Yo no lo he probado, pero me imagino que el siguiente podría funcionar también.

<!--[if lte IE 8]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

Podría salvar a alguien por el camino. Si no, ¡buena suerte!

Fuente

2013-11-17 16:39:02

¿Cuáles son exactamente las reglas para evitar la advertencia de "contenido mixto" en IE debido a imágenes de fondo?

Respuesta

Cuestiones relacionadas