2009-05-15 57 views
41

Estoy usando IE 8 en Vista, y cada vez que cambio un archivo javascript y luego comienzo la depuración, tengo que presionar Ctrl + F5 para que vuelva a cargar mi javascript. ¿Hay alguna manera de hacer que vuelva a cargar automáticamente JavaScript cuando empiece la depuración, pero no pierdas las ganancias de rendimiento cuando solo navegas por la red?Cómo forzar IE a recargar javascript?

Sí, sí, sé que probablemente no te guste IE, pero ten en cuenta que la pregunta no es "¿Cuál es el mejor navegador?".

Respuesta

45

Agregue una cadena al final de su URL para romper el caché. Yo suelo hacer (con PHP):

<script src="/my/js/file.js?<?=time()?>"></script> 

Así que vuelve a cargar cada vez que mientras yo estoy trabajando en ello, y luego se lo quite cuando se va a producir. En realidad, lo abstraigo un poco más, pero la idea sigue siendo la misma.

Si consulta la fuente de este sitio web, añaden el número de revisión al final de la URL de una manera similar para forzarnos a realizar cambios siempre que actualicen los archivos javascript.

+0

Buena opción, solo significa que los navegadores _nunca_ almacenarán en caché el archivo, lo que significa que "perderá las ganancias de rendimiento al navegar por la red". – Alconja

+3

Pierdes las ganancias de rendimiento cuando "solo navegas por el sitio web en el que estás trabajando actualmente" es más parecido a. –

+0

Ok, supuse que tenías la intención de ir a vivir con esto. (recuerde que los usuarios finales también tendrán problemas de caché, por lo que no es una mala idea asegurarse de que cuando los archivos .js cambien, el navegador del usuario de alguna manera sepa que también obtengan la versión más reciente). – Alconja

15

Cuando trabaje con una página web o un archivo javascript, desea que se vuelva a cargar cada vez que lo cambie. Puede cambiar la configuración en IE 8 para que el navegador nunca se almacene en caché.

Siga estos sencillos pasos.

  1. Seleccione Herramientas-> Opciones de Internet.
  2. En la pestaña General, haga clic en el botón Configuración en la sección Historial de navegación.
  3. Haga clic en el botón "Cada vez que visite la página web".
  4. Haga clic en el botón Aceptar.
+3

Eso no hace lo que crees que hace. Vea www.enhanceie.com/redir/?id=httpperf para una discusión de cada una de las configuraciones. – EricLaw

+0

hice esto pero aún tengo que actualizar la página o presionar F5? –

1

En javascript Creo que no es posible, porque los navegadores modernos tienen un policy on security en javascripts ... y borrar el caché es muy violador.

Usted puede tratar de añadir

<META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 

En su cabecera, sino que tendrá la pérdida de rendimiento.

26

La idea general de Paolo (es decir, cambiar efectivamente alguna parte de la solicitud uri) es su mejor opción. Sin embargo, sugiero usar un valor más estático, como un número de versión que actualice cuando haya cambiado el archivo de secuencia de comandos para que pueda obtener los aumentos de rendimiento del almacenamiento en caché.

Así que, o algo como esto:

<script src="/my/js/file.js?version=2.1.3" ></script> 

o tal vez

<script src="/my/js/file.2.1.3.js" ></script> 

Yo prefiero la primera opción, ya que significa que puede mantener el archivo en lugar de tener que cambiar el nombre constantemente (que para ejemplo mantiene un historial de versiones consistente en su control de origen). Por supuesto, cualquiera de los dos (como los describí) implicaría actualizar tus declaraciones de inclusión cada vez, por lo que es posible que desees encontrar una forma dinámica de hacerlo, como reemplazar un valor fijo por uno dinámico cada vez que implementes (usando Ant o lo que sea)

+0

¿ funciona también en Firefox y Chrome? – BrianK

+0

@BrianK - debería estar bien. – Alconja

+0

Voy a tomar esta idea y probar en el evento de carga de página (en .Net) para crear un número de versión basado en la fecha y hora (una mezcla de idea de usted y Paolo) porque esto se está convirtiendo en un verdadero dolor de cabeza. No necesariamente para mí personalmente, pero cuando actualizo el JS a nuestros evaluadores, se olvidan de presionar CTRL F5 y luego enviar errores de regreso una vez que se han corregido ... (¡Solo necesito asegurarme de sacar esto antes de la producción!) –

0

Para eliminar la necesidad de presionar repetidamente F5 en una pestaña IE mientras se desarrolla un sitio web, use ReloadIt.

enter image description here

Para cada página web que aparece en el IE, puede configurar un nombre de archivo, un directorio o un conjunto de ellos. Si se produce algún cambio en cualquiera de esas rutas configuradas, ReloadIt actualiza la pestaña IE. Una herramienta simple. Simplemente funciona.

Esto recargará todo, no solo javascript.

4

Si solo desea hacer esto en su navegador (es decir, no forzar esto en sus usuarios), entonces NO establecería su código para no utilizar el caché. Como dijo José, hay una pérdida de rendimiento.

Y no apagaría el almacenamiento en caché de IE por completo, porque se pierde esa ganancia de rendimiento para cada sitio web que visita. Se puede decir de IE para refrescar siempre desde el servidor para una sesión de sitio o la navegación específica:

  1. IE abierta Herramientas de Desarrollo
  2. Elija caché en el menú
  3. Haga clic para ver "Siempre Actualizar desde el servidor"

O, por el teclado de acceso directo-philes (como yo) por ahí ..

  • F12, Alt + C, flecha abajo, Alt + R.

nota de precaución: Habiendo dicho esto ... Tenga en cuenta que en cualquier momento se desarrollan/prueba de una manera diferente que el sitio estará al alcance de la producción, se corre el riesgo de obtener resultados mixtos. Un buen ejemplo es este problema de almacenamiento en caché. Encontramos un problema donde IE almacenaba en caché nuestras llamadas Ajax y no actualizaba los resultados de un método GET. Si HAD hubiéramos desactivado el almacenamiento en caché en IE, nunca hubiéramos visto este problema en desarrollo, y lo habríamos desplegado en una producción como esta.

+0

En su "Nota de precaución", esta es la razón por la cual muchas tiendas de desarrollo tienen un entorno de prueba especial, donde el objetivo es reflejar la producción tanto como sea posible. Por ejemplo, si desarrolla/prueba en Windows, pero su servidor de producción es Linux, entonces debe tener otro entorno de prueba que se ejecute en Linux. – michaelok

+0

El elemento 'F12 ...' funciona para mí, IE 8. No funciona para IE11. – youngzy

1

Esto debería ser el truco para ASP.NET. El concepto es el mismo que se muestra en el ejemplo de PHP. Dado que la URL es diferente cada vez que se carga la secuencia de comandos, ninguno de los dos buscadores debe almacenar en caché el archivo. Estoy acostumbrado a poner mi código JavaScript en archivos separados, y desperdicié una gran cantidad de tiempo con Visual Studio hasta que me di cuenta de que no volvería a cargar los archivos JavaScript.

 
<script src="Scripts/main.js?version=<% =DateTime.Now.Ticks.ToString()%>" type="text/javascript"></script> 

ejemplo completo:

 
<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" 
    CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %> 

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> 

    <script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script> 
    <script src="Scripts/main.js?version=<% =DateTime.Now.Ticks.ToString()%>" type="text/javascript"></script> 
    <script type="text/javascript"> 

     $(document).ready(function() { 
           myInit(); 
          }); 

    </script> 
</asp:Content> 

obvously, esta solución sólo debe utilizarse durante la fase de desarrollo, y debe ser eliminado antes de publicar el sitio.

0

Agregue una fecha de modificación del archivo js al final de su URL. Con PHP se vería algo como esto:

echo '<script type="text/javascript" src="js/something.js?' . filemtime('js/something.js') . '"></script>'; 

Cuando la secuencia de comandos se volverá a cargar cada vez que se actualice.

0

Si está ejecutando ASP.Net, consulte el módulo de Agrupación y Minificación disponible en ASP.Net 4.5.

http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification

Se puede declarar un "paquete" que apunta a su archivo JavaScript. Cada vez que su archivo cambia, generará un nuevo sufijo de cadena de consulta ... pero solo lo hará cuando cambie el archivo. Esto hace que sea muy simple implementar actualizaciones, porque ni siquiera tiene que pensar en actualizar sus etiquetas con los nuevos números de versión.

También puede agrupar múltiples archivos .js en un archivo y minimizarlos, todo en un solo paso. Lo mismo para css.