Czy moja strona ładowana jest z pamięci podręcznej przeglądarki?

Question

Mam odznakę "nowych przedmiotów" na stronie, którą chcę zaktualizować natychmiast, gdy strona zostanie załadowana z pamięci podręcznej (tj. Po naciśnięciu "Wstecz" lub "Przekaż", aby powrócić na tę stronę). Jaki jest najlepszy sposób na osiągnięcie tego?

Konfiguracja jest całkiem prosta. Układ aplikacji wyszukuje nowe elementy co 8 sekund i aktualizuje odpowiednio listę znaczników + elementów.

$(function() { 
    setInterval(App.pollForNewItems, 8000); 
}); 

Gdy ktoś odejdzie od tej strony, aby obejrzeć szczegóły przedmiotu, może się zdarzyć. Rzeczy są "nowe", dopóki użytkownik ich nie obejrzał, a aplikacja prawdopodobnie będzie miała kilku użytkowników jednocześnie (rodzaj przepływu pracy używanego w centrum obsługi telefonicznej lub biletów wsparcia).

Aby upewnić się, że odznaczenia są zawsze aktualne, mam:

$(window).bind('focus load', function (event) { 
    App.pollForNewItems(); 
}); 

..i jeśli to działa, sondowania nowych elementów na „obciążenie” jest użyteczne tylko wtedy, gdy strona jest ładowany z pamięć podręczną. Czy istnieje niezawodny, oparty na różnych przeglądarkach sposób sprawdzania, czy strona jest ładowana z pamięci podręcznej?

Answer 1

Częściowym, hackowskim rozwiązaniem jest posiadanie var z aktualnym czasem ustawionym na serwerze i ustawienie var z bieżącym czasem klienta na górze strony. Jeśli różnią się one o więcej niż pewien próg (1 minutę?), Możesz założyć, że jest to buforowana strona.

Przykład JS (używając ASP.Net składnia stronie serwera):

var serverTime = new Date('<%= DateTime.Now.ToUniversalTime().ToString() %>'); 
var pageStartTime = Date.UTC(new Date()); 
var isCached = serverTime < pageStartTime && 
       pageStartTime.getTime() - serverTime.getTime() > 60000; 

Alternatywnie, przy użyciu ciasteczek po stronie klienta (zakładając, że pliki cookie są włączone), można sprawdzić cookie z unikalnym kluczem dla bieżącej wersji strony. Jeśli nie istnieje, piszesz do niego plik cookie, a na każdym innym dostępie do strony istnienie pliku cookie wskazuje, że jest on ładowany z pamięci podręcznej.

E.g. (Zakłada cookies niektóre funkcje pomocnicze są dostępne)

var uniqueKey = '<%= SomeUniqueValueGenerator() %>'; 
var currentCookie = getCookie(uniqueKey); 
var isCached = currentCookie !== null; 
setCookie(uniqueKey); //cookies should be set to expire 
         //in some reasonable timeframe 

Answer 2

Osobiście chciałbym ustawić atrybut danych zawierający identyfikator produktu dla każdego elementu.

tj.

<ul> 
    <li data-item-id="123">Some item.</li> 
    <li data-item-id="122">Some other item.</li> 
    <li data-item-id="121">Another one..</li> 
</ul> 

Twoja funkcja App.pollForNewItems by chwycić atrybut pierwszego elementu data-item-id (jeśli Najnowszy są pierwsze) i wysłać go do serwera ze swoim pierwotnym wniosku.

Serwer zwróci następnie tylko te elementy, które można następnie dodać do listy.

Nadal nie rozumiem, dlaczego chcesz wiedzieć, czy przeglądarka ma buforowaną wersję strony.

Czy istnieje również powód do wiązania się z load zamiast z ready?

• Christian

Answer 3

Można zapytać przeglądarkę internetową, aby nie buforować stronę.Spróbuj tych nagłówków HTTP:

Szczególnie Cache-control: no-store jest interesujący, ponieważ informuje przeglądarkę, aby nie przechowywać w pamięci strony w ogóle, co zapobiega nieświeży strony ładowany gdy klikniemy przycisk wstecz/do przodu.

Jeśli zrobisz to zamiast tego, nie będziesz musiał odpytywać danych za wczytanie strony.

Answer 4

Navigation Timing jest teraz w większości przeglądarek (IE9 +) http://www.w3.org/TR/navigation-timing/#sec-navigation-info-interface

if (!!window.performance && window.performance.navigation.type === 2) { 
    // page has been hit using back or forward buttons 
} else { 
    // regular page hit 
} 

Answer 5

dobra odpowiedź: https://stackoverflow.com/a/9870920/466363

Można również użyć Timing nawigacji do pomiaru latencji sieci w najdrobniejszych szczegółach.

Oto dobry artykuł: http://www.html5rocks.com/en/tutorials/webperformance/basics/

Jeżeli różnica czasu między fetchStart i responseStart jest bardzo niska, strona została ładowane z pamięci podręcznej, na przykład.

przez stewe

Answer 6

spróbuj wykonać skrypt w pliku js.