cómo borrar o reemplazar una imagen en caché

Question

Sé que hay muchas maneras de evitar el almacenamiento en caché de imágenes (como las etiquetas META), así como algunos trucos para asegurar que la versión actual de una imagen se muestra con cada página cargar (como image.jpg? x = timestamp), pero ¿hay alguna manera de borrar o reemplazar una imagen en la memoria caché de los navegadores para que ninguno de los métodos anteriores sea necesario?

Como ejemplo, digamos que hay 100 imágenes en una página y que estas imágenes se llaman "01.jpg", "02.jpg", "03.jpg", etc. Si la imagen es "42.jpg" se reemplaza, ¿hay alguna forma de reemplazarlo en la memoria caché para que "42.jpg" muestre automáticamente la nueva imagen en cargas de página sucesivas? No puedo usar el método de etiqueta META, porque necesito que ISN "T reemplazado permanezca almacenado en la memoria caché, y no puedo usar el método de indicación de fecha y hora, porque no quiero que TODAS las imágenes se vuelvan a cargar cada vez que la página cargas.

he devanaba los sesos y recorrieron Internet una manera de hacer esto (preferiblemente a través de JavaScript), pero no hubo suerte. ¿Alguna sugerencia?

Answer 1

la razón se utiliza el? x = truco marca de tiempo es porque esa es la única manera de hacerlo por imagen. Eso o generar dinámicamente nombres de imágenes y apuntar a una aplicación que muestre la imagen.

Sugiero que averigüe, lado del servidor, si la imagen ha sido modificada/actualizado, y si es así, entonces fuera ponga su etiqueta con el truco de la marca de tiempo "x" para forzar la nueva imagen.

Answer 2

Si va a escribir la página de forma dinámica, puede agregar la fecha y hora de la última modificación a la URL:

<img src="image.jpg?lastmod=12345678" ...

Answer 3

<meta> es absolutamente irrelevante. De hecho, no debe intentar usarlo para controlar la caché en absoluto (para el momento en que algo lee el contenido del documento, ya está en la memoria caché).

En HTTP, cada URL es independiente. Hagas lo que hagas con el documento HTML, no se aplicará a las imágenes.

Para controlar el almacenamiento en caché, puede cambiar las URL cada vez que cambie su contenido. Si actualiza las imágenes de vez en cuando, permita que se guarden en caché para siempre y use un nuevo nombre de archivo (con una versión, hash o una fecha) para la nueva imagen: es la mejor solución para archivos de larga duración.

Si sus cambios de imagen muy a menudo (cada pocos minutos, o incluso en cada solicitud), a continuación, enviar Cache-control: no-cache o Cache-control: max-age=xx donde xx es el número de segundos que la imagen es "fresco".

La URL aleatoria para archivos de corta vida es una mala idea. Contamina los cachés con archivos inútiles y fuerza que los archivos útiles se purguen antes.

Si tiene Apache y mod_headers o mod_expires, cree el archivo .htaccess con las reglas apropiadas.

<Files ~ "-nocache\.jpg"> 
    Header set Cache-control "no-cache" 
</Files> 

Sobre hará *-nocache.jpg archivos que no son aplicables a la caché.

También podría servir las imágenes a través de script PHP (tienen cachability horrible por defecto;)

Answer 4

Cambiar la ETAG de la imagen.

Answer 5

Estoy seguro de que la mayoría de los navegadores respetan el encabezado HTTP Last-Modified. Envíe esos y solicite una nueva imagen. El navegador lo almacenará en caché si la línea Last-Modified no cambia.

Answer 6

En el caso de que una imagen se vuelva a cargar, ¿hay alguna forma de BORRAR o REEMPLAZAR la imagen previamente almacenada en caché del lado del cliente? En mi ejemplo anterior, el objetivo es hacer que el navegador olvide lo que "42.jpg" es

Estás ejecutando firefox ¿verdad?

• Encuentra la Tools Menú
• Seleccionar Clear Private Data
• Desmarque todas las casillas de verificación excepto asegurarse Cache se comprueba
• Pulse OK

:-)

Con toda seriedad, Nunca había escuchado que existiera tal cosa, y dudo que haya s una API para eso. No puedo imaginarme que sea una buena idea para los desarrolladores de los navegadores dejarlos hurgar en su caché, y no hay ninguna motivación que pueda ver para que ellos implementen alguna vez esa característica.

NO PUEDO utilizar el método de etiqueta META O el método de indicación de fecha y hora, porque quiero almacenar todas las imágenes en caché en circunstancias normales.

¿Por qué no puede usar una marca de tiempo (o etag, que equivale a la misma cosa)? Recuerde que debe utilizar la marca de tiempo del archivo de imagen en sí, no solo Time.Now.
Odio ser el portador de malas noticias, pero no tienes otras opciones.

Si las imágenes no cambian, tampoco lo hará la marca de tiempo, por lo que todo se almacenará en caché "en circunstancias normales". Si las imágenes cambian, obtendrán una nueva marca de tiempo (que necesitarán por razones de almacenamiento en caché), pero esa marca de tiempo permanecerá válida por siempre hasta que alguien reemplace la imagen nuevamente.

Answer 7

No, no hay forma de forzar que un archivo en un caché del navegador sea eliminado, ya sea por el servidor web o por cualquier cosa que pueda poner en los archivos que envía. El caché del navegador es propiedad del navegador y está controlado por el usuario.

Por lo tanto, debe tratar cada archivo y cada URL como un recurso precioso que debe administrarse cuidadosamente.

Por lo tanto, la sugerencia de porneL de versionar los archivos de imágenes parece ser la mejor respuesta a largo plazo. El ETAG se usa en circunstancias normales, pero tal vez sus esfuerzos lo han anulado. Intente cambiar el ETAG, como se sugiere.

Answer 8

Cuando cambiar el nombre de archivo de la imagen no es una opción, utilice una variable de sesión del lado del servidor y una función de Javascript window.location.reload().En la siguiente manera:

Después de terminado de subir:

Session("reload") = "yes" 

En Page_Load:

If Session("reload") = "yes" Then 
    Session("reload") = Nothing 
    ClientScript.RegisterStartupScript(Me.GetType), "ReloadImages", "window.location.reload();", True) 
End If 

Esto permite que el navegador del cliente para actualizar sólo una vez, porque la variable de sesión se restablece después de una ocurrencia .

Espero que esto ayude.

Answer 9

Ver http://en.wikipedia.org/wiki/URI_scheme

Observe que puede proporcionar un nombre de usuario: contraseña @ combo como prefijo a la parte del dominio de la URI. En mi experimentación, he encontrado que la inclusión de este con una identificación falsa (o contraseña supongo) resultados en el tratamiento del recurso como única - rompiendo así el almacenamiento en caché como se desee.

utilizar simplemente un sello de tiempo como el nombre de usuario y por lo que yo puedo decir el servidor ignora esta parte de la URI, siempre y cuando la autenticación no está activada.

Btw - Tampoco pude usar los trucos anteriores con un problema de almacenamiento en caché del ícono del marcador de google que tenía cuando el truco de la marca de tiempo "param =" funcionó, pero causó problemas con la desaparición de las superposiciones. Nunca pude entender por qué sucedía esto, pero hasta ahora estoy muy bien usando este método. De lo que no estoy seguro es si el paso de credenciales falsas tendrá algún efecto adverso en el rendimiento del servidor. Si alguien sabe que me interesaría saber, aún no estoy en producción de alto volumen.

Por favor, informar de sus resultados.

Answer 10

añadir la URL imagen como esta

"imagen1.jpg?" + DateTime.Now.ToString ("ddMMyyyyhhmmsstt");

Apenas añada cadena aleatoria en la cadena de consulta

Gracias

Raju Jetla

Answer 11

Para reemplazar caché para pictore que puede almacenar en el lado del servidor algún valor de versión y cuando se carga la imagen acaba de enviar este valor en su lugar sello de tiempo. Cuando cambie su imagen, cambie su versión.

Answer 12

Al contrario de lo que dicen algunas de las otras respuestas, existe IS una forma de javascript en el lado del cliente para reemplazar una imagen en caché. El truco es crear un oculto , establezca su atributo src a la URL de la imagen, espera a que cargue, vuelva a cargar la fuerza llamando location.reload(true). Eso actualizará la copia en caché de la imagen. A continuación, puede reemplazar los elementos <img> en su página (o volver a cargar la página) para ver la versión actualizada de la imagen.

(Pequeña advertencia: si se actualizan elementos individuales <img>, y si hay más de uno con la imagen que se actualizó, debe borrarlos o eliminarlos TODOS, y luego reemplazarlos o restablecerlos. Si lo hace uno por uno, algunos navegadores copiar la versión en memoria de la imagen a partir de otras etiquetas, y el resultado es que no podría ver su imagen actualizada, a pesar de encontrarse en la memoria caché).

He publicado un código para hacer este tipo de actualización here.

Answer 13

He intentado algo ridículamente simple:

Ir a la carpeta FTP del sitio web y cambiar el nombre de la carpeta IMG para IMG2. Actualiza tu sitio web y verás que faltan las imágenes. A continuación, cambie el nombre de la carpeta IMG2 a IMG y ya está, al menos me funcionó en Safari.

Answer 14

Puede agregar un número al azar a la imagen, que es como darle una nueva versión. He implementado la lógica similar y está funcionando perfectamente.

<script> 
var num = Math.random(); 
var imgSrc= "image.png?v="+num; 
$(function() { 
$('#imgID').attr("src", imgSrc); 
}) 
</script> 

Answer 15

intento por debajo de soluciones,

myImg.src = "http://localhost/image.jpg?" + nueva Fecha(). getTime();

soluciones anteriores funciona para mí :)

Answer 16

probar este fragmento de código:

var url = imgUrl? + Math.random(); 

Esto se asegurará de que cada solicitud es única, por lo que tendrán la última imagen siempre.

Answer 17

que suelo hacer lo mismo que @ Greg nos dijo, y tengo una función para la que:

function addMagicRefresh(url) 
{ 
    var symbol = url.indexOf('?') == -1 ? '?' : '&'; 
    var magic = Math.random()*999999; 
    return url + symbol + 'magic=' + magic; 
} 

Esto funcionará desde el servidor acepta y que no utilice el parámetro "mágica" cualquier Otra manera.

Espero que ayude.