Prevención del almacenamiento en caché del iframe en el navegador

¿Cómo previene que Firefox y Safari almacenen en caché el contenido del iframe?

Tengo una página web simple con un iframe en una página en un sitio diferente. Tanto la página externa como la interna tienen encabezados de respuesta HTTP para evitar el almacenamiento en caché. Cuando hago clic en el botón “Atrás” en el navegador, la página externa funciona correctamente, pero pase lo que pase, el navegador siempre recupera un caché de la página iframed. IE funciona bien, pero Firefox y Safari me están dando problemas.

Mi página web se ve así:

        

La variable var siempre cambia. A pesar de que la URL del iframe ha cambiado (y, por lo tanto, el navegador debe realizar una nueva solicitud a esa página), el navegador simplemente recupera el contenido en caché.

He examinado las solicitudes HTTP y las respuestas yendo y viniendo, y noté que incluso si la página externa contiene , el navegador aún webpage2.html?var=111 .

Esto es lo que he intentado hasta ahora:

  • Cambiar la URL del iframe con valor de var aleatorio
  • Agregar caducos, Cache-Control y encabezados de Pragma a la página web externa
  • Agregar caducos, Cache-Control y encabezados de Pragma a la página web interna

No puedo hacer ningún truco de JavaScript porque estoy bloqueado por la misma política de origen.

Me estoy quedando sin ideas. ¿Alguien sabe cómo evitar que el navegador guarde en caché el contenido iframed?

Actualizar

Instalé Fiddler2 como Daniel me sugirió que realizara otra prueba, y desafortunadamente, sigo obteniendo los mismos resultados.

Esta es la prueba que realicé:

  1. La página externa genera un número aleatorio usando Math.random() en JSP.
  2. La página externa muestra un número aleatorio en la página web.
  3. La página externa llama iframe, pasando en número aleatorio.
  4. La página interna muestra un número aleatorio.

Con esta prueba, puedo ver exactamente qué páginas se están actualizando y qué páginas están en la memoria caché.

Prueba visual

Para una prueba rápida, cargo la página, navego a otra página y luego presiono “volver”. Aquí están los resultados:

Página original:

  • Página externa: 0.21300034290246206
  • Página interna: 0.21300034290246206

Dejando la página, y luego retrocediendo:

  • Página externa: 0.4470929019483644
  • Página interna: 0.21300034290246206

Esto muestra que la página interna se está almacenando en caché, aunque la página externa la llame con un parámetro GET diferente en la URL. Por alguna razón, el navegador ignora el hecho de que el iframe está solicitando una nueva URL; simplemente carga el anterior.

Prueba de Fiddler

Efectivamente, Fiddler confirma lo mismo.

(Cargo la página)

La página externa se llama. HTML:

 0.21300034290246206  

http: //ipv4.fiddler: 1416 / page1.aspx? var = 0.21300034290246206 se llama.

(Me alejo de la página y luego respondo).

La página externa se llama. HTML:

 0.4470929019483644  

http: //ipv4.fiddler: 1416 / page1.aspx? var = 0.21300034290246206 se llama.

Bueno, a partir de esta prueba, parece que el navegador web no está almacenando en caché la página, sino que está almacenando en caché la URL del iframe y luego realizando una nueva solicitud en esa URL en caché. Sin embargo, todavía estoy perplejo en cuanto a cómo resolver este problema.

¿Alguien tiene alguna idea sobre cómo evitar que el navegador web guarde en caché las URL iframe?

Haga que la URL del iframe apunte a una página en su sitio que actúa como un proxy para recuperar y devolver el contenido real del iframe. Ahora ya no estás obligado por la misma política de origen.

Este es un error en Firefox:

https://bugzilla.mozilla.org/show_bug.cgi?id=356558

Pruebe esta solución alternativa:

   

He podido solucionar este error estableciendo un atributo de name único en el iframe, por cualquier razón, esto parece arruinar el caché. Puede usar cualquier dato dynamic que tenga como atributo de name , o simplemente la hora actual de ms o ns en el lenguaje de plantillas que esté utilizando. Esta es una solución más agradable que las anteriores porque no requiere directamente JS.

En mi caso particular, el iframe se está creando a través de JS (pero puedes hacer lo mismo a través de PHP, Ruby, lo que sea), así que simplemente uso Date.now() :

 return ''; 

Esto corrige el error en mi prueba; probablemente porque window.name en la ventana interna cambia.

Es un error en Firefox 3.5.

Eche un vistazo .. https://bugzilla.mozilla.org/show_bug.cgi?id=279048

Para que el iframe cargue siempre contenido nuevo, agregue la marca de tiempo actual de Unix al final de los parámetros GET. El navegador lo ve como una solicitud ‘diferente’ y buscará nuevo contenido.

En Javascript, podría verse así:

 frames['my_iframe'].location.href='load_iframe_content.php?group_ID=' + group_ID + '&timestamp=' + timestamp; 

Después de probar todo lo demás (excepto el uso de un proxy para el contenido del iframe), encontré una forma de evitar el almacenamiento en caché del contenido del iframe, desde el mismo dominio :

Use .htaccess y una regla de reescritura y cambie el atributo ifrme src .

RewriteRule test/([0-9]+)/([a-zA-Z0-9]+).html$ /test/index.php?idEntity=$1&token=$2 [QSA]

La forma en que uso esto es que la URL del iframe termina mirando de esta manera: example.com/test/54/e3116491e90e05700880bf8b269a8cc7.html

Donde [token] es un valor generado aleatoriamente. Esta URL evita el almacenamiento en caché del iframe, ya que el token nunca es el mismo y el iframe cree que es una página web totalmente diferente, ya que una única actualización carga una URL totalmente diferente:

example.com/test/54/e3116491e90e05700880bf8b269a8cc7.html
example.com/test/54/d2cc21be7cdcb5a1f989272706de1913.html

ambos conducen a la misma página.

Puede acceder a los parámetros de su URL oculta con $_SERVER["QUERY_STRING"]

Establecí el atributo iframe src más tarde en mi aplicación. Para deshacerse del contenido almacenado en caché dentro del iframe al inicio de la aplicación, simplemente lo hago:

 myIframe.src = ""; 

… en algún lugar al comienzo del código js (por ejemplo, en el manejador jquery $ ())

Gracias a http://www.freshsupercool.com/2008/07/10/firefox-caching-iframe-data/

Encontré este problema en el último Chrome así como en el último Safari en Mac OS X a partir del 17 de marzo de 2016. Ninguna de las correcciones anteriores funcionó para mí, incluida la asignación de src para vaciar y luego regresar a algún sitio, o agregar algún parámetro de nombre “aleatorio”, o agregar un número aleatorio al final de la URL después del hash, o asignar la ventana de contenido href al src después de asignar el src.

En mi caso, fue porque estaba usando Javascript para actualizar el IFRAME, y solo cambiaba el hash en la URL.

La solución alternativa en mi caso fue que creé una URL interina que tenía un segundo meta redireccionamiento a esa otra página. Sucede tan rápido que casi no noto el flash de la pantalla. Además, hice que el color de fondo de la página provisional sea el mismo que el de la otra página, por lo que lo nota aún menos.

También tuve este problema en 2016 con iOS Safari. Lo que pareció funcionar para mí fue darle un parámetro GET al iframe src y un valor para él como este

¿Has instalado Fiddler2 ?

Le permitirá ver exactamente qué se está solicitando, qué se envía de vuelta, etc. No parece plausible que el navegador realmente golpee su caché para diferentes URL.

¿Has intentado agregar las diversas opciones de encabezado HTTP para no-caché a la página iframe?

Si quieres volverte realmente loco, podrías implementar el nombre de la página como una URL dinámica que siempre se resuelve en la misma página, en lugar de la opción de cadena de consulta.

Suponiendo que está en una oficina, verifique si hay algún almacenamiento en caché a nivel de red. Créanme, es una posibilidad. Sus profesionales de TI podrán decirle si hay alguna infraestructura de red alrededor del almacenamiento en caché de HTTP, aunque como esto solo ocurre para el iframe, es poco probable.

    Intereting Posts