2012-03-29 6 views
4

Ich baue eine Javascript-App für eine Seite und wenn die Anwendung startet, benutze ich eine einzige Javascript-Datei, um jede andere Datei, die ich brauche, im laufenden Betrieb zu laden. Wenn ich auf "Aktualisieren" klicke, wird laut Firebug meine HTML-Seite sowie JavaScript-Seiten mit einem 304 Not Modified Error geladen und mein JavaScript funktioniert nicht mehr.Stoppen Sie Javascript und HTML vom Laden vom Cache

Ich verstehe, dass dies auf Browser-Caching zurückzuführen ist, aber wie kann ich das vermeiden? Ich lade die ursprüngliche HTML-Seite mit einem einzigen Skript Aufruf

<script src="js/config.js" type="text/javascript"></script> 

und anschließend alle anderen aus diesem Skript dynamisch laden

window.onload = function() { 
    var scripts = ['http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js', 'js/core.js', 'js/sandbox.js']; //Application scripts 
    var loaded = 0; 
    //Callback is executed after all scripts have been loaded. 
    var callback = function() { 
     if (loaded + 1 == scripts.length) { 
      //Create Modules 
      CORE.loader("js/modules/Login.js", function() { 
       CORE.createModule('loginForm', Login); 
      }); 

      //Create HTML bindings. 
      CORE.createBinding('appContainer', '#Login', 'login.html'); 
      CORE.bindHTML(window.location.hash); //Loads hash based page on startup 
     } else { 
      loaded++; 
      loadScript(scripts[loaded], callback); 
     } 
    }; 

    loadScript(scripts[0], callback); 

    function loadScript(scriptSrc, callback) { 
     var script = document.createElement('script'); 
     script.type = 'text/javascript'; 
     script.async = true; 
     script.src = scripts[loaded]; 

     if (script.readyState) { 
      script.onreadystatechange = function() { 
       if (script.readyState == 'loaded' || script.readyState == 'complete') { 
        script.onreadystatechange = null; 
        callback(); 
       } 
      }; 
     } else { 
      script.onload = function() { 
       callback(); 
      }; 
     } 

     document.getElementsByTagName('head')[0].appendChild(script); 
    } 
}; 

Ich weiß, dass Google Mail-Cookies verwendet, dies zu verhindern. Hat jemand eine Idee, wie man diesen Ansatz annimmt? Sollte ich das Cookie auf dem Server setzen und es dann mit JS auf jeder Seite überprüfen, laden/aktualisieren und etwas wie window.location.refresh() verwenden, wenn das Cookie mir sagt, dass die Seite aus dem Cache geladen wurde?

+0

Sie die Seite nicht aktualisiert werden, anstatt nachzuladen. –

+0

Ich kann nicht erwarten, dass ein Benutzer der Anwendung nicht aktualisiert wird. Dies ist ein Fehler, der gelöst werden muss, nicht im Browser funktioniert. – ryandlf

+0

'304 Not Modified' ist kein Fehler. – user123444555621

Antwort

9

Caching ist aus Performance-Gründen wichtig. Ich würde empfehlen, dass Sie eine Versionsnummer in Ihrer Abfragezeichenfolge übergeben und die Versionsnummer bei jedem Update erhöhen. Dadurch wird der Browser gezwungen, die Anfrage erneut zu senden, und es wird aus dem Cache geladen, wenn es bereits dieselbe Version hat.

1
<META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE"> 

Fügen Sie dies Ihrem HTML-KOPF hinzu.

+0

Dies verhindert nicht, dass der Browser 304 nicht geänderte Fehler zwischenspeichert und weiterleitet. – ryandlf

+0

304 Not Modified ist einfach eine Antwort "Sie sollten diese Cache-Adresse haben", es ist kein Fehler. –

0

Sie müssen script.src = scripts[loaded];nach setzen die onreadystatechange/onload Handler hinzufügen. Andernfalls wird das Ereignis ausgelöst, bevor die Handler hinzugefügt werden, da die zwischengespeicherte Version sofort geladen wird.

2

Ich stimme mit allen anderen Antworten überein. 304 ist kein Fehler und es gibt viele Gründe, warum dieses Verhalten korrekt ist.

Das gesagt, es gibt einen einfachen "Hack", den Sie verwenden können. Fügen Sie einfach einen eindeutigen URL-Parameter an den JS-Aufruf an.

var timestamp = +new Date; 
var url = "http://mysite.com/myfile.js?t=" + timestamp; 

Auch dies ist ein Hack. Leistungstechnisch ist das schrecklich.

+0

Ich benutze diesen Ansatz in meinen dynamischen Skript-Lade-Dienstprogrammen und es funktioniert großartig, aber in dieser Situation, wenn man bedenkt, dass es das Herzstück der Anwendung betrifft, suche ich nach einem etwas effizienteren Ansatz. – ryandlf

8

erweitern auf @Ramesh's answer:

ein erneutes Laden der JS-Datei zu erzwingen, statt des Cache, verwenden Sie diesen HTML:

<script src="js/config.js?v=42" type="text/javascript"></script> 

Das nächste Mal, wenn Sie Änderungen an der Datei machen nur +1 die v. Dies funktioniert übrigens auch mit CSS-Dateien.

0

Nachdem ich monatelang mit dem Cacheproblem zu kämpfen hatte und fast alles versuchte (einschließlich eines Skripts, das die URLs mithilfe eines Parameters änderte), fand ich einen Beitrag, der das mithilfe des IIS erläutert.

  • Starten Sie den IIS-Manager (Sie INETMGR aus dem Startmenü funktioniert für mich)
  • Navigieren Sie zu gewünschten Stelle im Baum Anschlüsse
  • öffnen Output Caching
  • Featureeinstellungen bearbeiten
  • Uncheck Cache aktivieren und aktivieren Kernel-Cache
  • Wenn Sie die Änderungen nicht speichern können, vergewissern Sie sich, dass die Datei web.config nicht als schreibgeschützt markiert ist
  • IISRESET ist für die erforderlichen Änderungen zu

Dies ist der Original-Beitrag, der erwähnt, dass es für IIS 7.5 (Windows 7) https://forums.iis.net/t/959070.aspx?How+do+you+disable+caching+in+IIS+

Eines der Dinge relevant ist, ich versuchte vor Das war das Hinzufügen von .html und .js in Output Caching und das Aktivieren von "Prevent All Caching". Wenn es nach dem IISRESET nicht funktioniert, versuchen Sie das, obwohl ich nicht sicher bin, dass es tatsächlich erforderlich ist.

EDIT:

Wenn es nicht, noch gehen zu HTTP-Response-Header in dem IIS funktioniert und fügen Sie neue Aktionen:

  1. Name: Cache-Control, Wert: no-cache

  2. Name: abläuft, Wert: 0

Verwandte Themen