Internet Explorer 7 enlaces Ajax solo cargan una vez

Question

Estoy escribiendo una aplicación y estoy intentando vincular la funcionalidad simple de AJAX. Funciona bien en Mozilla Firefox, pero hay un error interesante en Internet Explorer: cada uno de los enlaces puede solo haga clic una vez. El navegador debe reiniciarse completamente; simplemente, volver a cargar la página no funcionará. Escribí un very simple example application que demuestra esto.

Javascript reproduce a continuación:

var xmlHttp = new XMLHttpRequest(); 

/* 
item: the object clicked on 
type: the type of action to perform (one of 'image','text' or 'blurb' 
*/ 
function select(item,type) 
{ 

    //Deselect the previously selected 'selected' object 
    if(document.getElementById('selected')!=null) 
    { 
     document.getElementById('selected').id = ''; 
    } 
    //reselect the new selcted object 
    item.id = 'selected'; 

    //get the appropriate page 
    if(type=='image') 
     xmlHttp.open("GET","image.php"); 
    else if (type=='text') 
     xmlHttp.open("GET","textbox.php"); 
    else if(type=='blurb') 
     xmlHttp.open("GET","blurb.php"); 

    xmlHttp.send(null); 
    xmlHttp.onreadystatechange = catchResponse; 

    return false; 

} 
function catchResponse() 
{ 
    if(xmlHttp.readyState == 4) 
    { 
     document.getElementById("page").innerHTML=xmlHttp.responseText; 
    } 

    return false; 
} 

Cualquier ayuda sería muy apreciada.

Answer 1

Esto ocurre porque Internet Explorer ignora la directiva de no caché y almacena en caché los resultados de las llamadas ajax. Luego, si la siguiente solicitud es idéntica, solo servirá la versión en caché. Hay una solución fácil, y es simplemente agregar una cadena al azar al final de su consulta.

xmlHttp.open("GET","blurb.php?"+Math.random(); 

Answer 2

Parece que IE está almacenando en caché la respuesta. Si cambia sus llamadas a métodos POST, o envía los encabezados apropiados para decirle a IE que no almacene en caché la respuesta, debería funcionar.

Las cabeceras que envío para asegurarse de que no lo hace caché son:

Pragma: no-cache 
Cache-Control: no-cache 
Expires: Fri, 30 Oct 1998 14:19:41 GMT 

Nota la fecha de caducidad puede ser en cualquier momento en el pasado.

Answer 3

El problema es que IE hace cosas locas cuando el manejador de respuesta se establece antes de open se llama. No está haciendo eso para la primera solicitud xhr, pero como reutiliza el objeto xhr, cuando se llama a la segunda apertura, el manejador de respuestas ya está establecido. Eso puede ser confuso, pero la solución es simple. Crear un nuevo objeto XHR para cada solicitud:

movimiento del:

var xmlHttp = new XMLHttpRequest(); 

dentro de la función de selección.

Answer 4

xmlHttp.open ("GET", "blurb.php?" + Math.random();

Estoy de acuerdo con este .. funciona perfectamente como una solución a este problema. el problema es que el almacenamiento en caché de las URL de IE7 era terrible, ignorando el encabezado sin memoria caché y guardando el recurso en su caché usando su url como índice clave, por lo que la mejor solución es agregar un parámetro aleatorio a la URL GET

Answer 5

sección Leer sin problemas en [texto del enlace] [1] [1]: http://en.wikipedia.org/wiki/XMLHttpRequest

Answer 6

El encabezado de respuesta que mejor me ha funcionado en el caso de IE AJAX es Expires: -1, que probablemente no sea por especificación, pero se menciona en un artículo de soporte técnico de Microsoft (How to prevent caching in Internet Explorer). Esto se usa junto con Cache-Control: no-cache y Pragma: no-cache.

Answer 7

En jQuery.ajax, se puede establecer el "caché" establecer en false:

http://api.jquery.com/jQuery.ajax/

Answer 8

Usando Dojo, esto se puede hacer usando dojo.date.stamp, simplemente añadiendo lo siguiente a la url:

"...&ts=" + dojo.date.stamp.toISOString(new Date())