Usando script para almacenar imágenes en caché

Estoy usando TimThumb, que es un script PHP para cambiar el tamaño de las imágenes.

Almacena la imagen en caché, y mi aplicación web se basa en ese almacenamiento en caché para funcionar correctamente.

Cuando la imagen no se almacena en caché en el servidor, no funciona bien, me pregunto si hay una forma de obligar a timthumb a almacenar en caché una imagen y luego recuperarla, o si hay una forma de usar JavaScript para asegurar la imagen. se almacena en caché primero.

preguntado el 28 de julio de 12 a las 00:07

1 Respuestas

Para garantizar que el navegador precargue una imagen en la memoria caché, puede usar algunos objetos nativos de JavaScript.

var imgPreload = new Image();
imgPreload.src = PATH_TO_IMAGE;

Ahora cuando das un <img> etiquetar una src atributo que es lo mismo que PATH_TO_IMAGE, ya habrá sido precargado por el navegador.

<img src="PATH_TO_IMAGE" width="100%" >

También puede cargar algunas imágenes en su HTML y simplemente usar algunos trucos CSS para ocultarlas:

  • display:none

    or

  • visibility:hidden

entonces solo muéstrelos cuando estén completamente cargados. Podrías usar el .load() función para eso. Simplemente adjúntelo a la <img> etiqueta -

$("#imageSelector").load(function(){
  // image was fully loaded.
});

Respondido el 20 de junio de 20 a las 10:06

No estoy seguro de cómo utilizar este objeto html. ¿Uso la variable? imgPreload como si usara <img src="PATH_TO"/> ? - adola

La idea es que cuando llegue a mostrar esa imagen, ya habrá sido cargada por esas dos líneas de código. - Lix

Correcto, pero no puedo encontrar ninguna documentación sobre Image(); Estoy devolviendo una cadena con mis elementos html, y cuando incluyo imgPreload, vuelve [[object HTMLImageElement]] - adola

nvm, tienes que usar '<img src="'+imgPreload.src+'"/>' - adola

@ado: sí, lo siento, olvidé explicar que realmente no tienes que hacer nada más que ejecutar esas dos líneas de código. La imagen se cargará desde la misma URL si usa imgPreload.src o incluso pasar explícitamente la URL directa al archivo de imagen. - Lix

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.