Jak sprawdzić, czy obraz jest pobierany z pamięci podręcznej WWW użytkownika lub jak uzyskać dokładny czas ładowania?

Question

Używam skryptu JavaScript, który mówi mi, czy określone adresy URL obrazu są buforowane w pamięci podręcznej przeglądarki użytkownika. Używam tego, ponieważ tworzę tablicę niezbuforowanych obrazów, które będą ładowane osobno, po wykonaniu ważniejszego procesu. Ten skrypt został napisany specjalnie dla Google Chrome, więc nie potrzebuję rozwiązania opartego na różnych przeglądarkach.

Moja obecna funkcja sprawdza czas ładowania obrazu i jeśli jest ona mniejsza niż kilka milisekund (obecnie 25 ms), zakładam, że jest ona pobierana z pamięci podręcznej.

Różnicę między obrazami z pamięci podręcznej i bez pamięci podręcznej można łatwo wykryć, sprawdzając panel Zasoby w Narzędziu programistów Chrome. Po ustawieniu czasu ładowania Chrome poinformuje, czy plik został pobrany z pamięci podręcznej, czy nie, wyświetlając podpowiedź wyglądającą tak: xx ms Latency, xx ms Download (from cache).

Zauważyłem, że w niektórych przypadkach czas opóźnienia jest dość długi (na przykład 64 ms przez zaledwie 2 ms czasu pobierania) i powoduje, że funkcja wykrywania jest bezużyteczna, ponieważ całkowity czas ładowania przekracza mój próg. Zwiększenie progu nie jest możliwe, ponieważ małe i niezapisane obrazy mogą być również ładowane w tym samym czasie.

Teraz masz mój problem, tu idzie moje pytanie:

-Czy można sprawdzić w 100% dokładny sposób (np jak panel zasobów chrom), że plik pochodzi z cache? (Myślę, że jeśli robi to panel, tam musi być jakiś sposób, ale nie mogłem go znaleźć w Internecie)

Albo

-Czy istnieje sposób, aby rozdzielić dwa opóźnienia (tj Latency vs. Pobierz), aby móc sprawdzić tylko rzeczywisty czas pobierania? Obliczanie czasu spędzonego między rozpoczęciem ładowania obrazu a zdarzeniem onload zwraca łączny czas.

---

Dziękuję za przeczytanie mojego pytania, a nawet jeśli nie masz dokładnego rozwiązania, myśli, pomysły, są mile widziane!

(PS: Nie jestem native speaker angielski, więc proszę nie wiń mnie za robienie błędów!)

Gael

Answer 1

Niestety do pomylenia odpowiedź.

Zrobiłem kilka testów i znaleziono następujące wyniki: Nagłówek 304 not modified pojawiają się tylko wtedy, gdy zasób jest nieświeże i zatwierdzone przez serwer poprzez If-None-Match/If-Modified-Since. Gdy zasób jest wciąż świeży i nie wymaga sprawdzania poprawności, zwracany kod stanu to 200 Ok.

Wydaje się jednak, że istnieje nagłówek Wiek, który wskazuje, że zasób jest buforowany. Sądzę, że mógłbym przełączyć się na PHP i zrobić coś takiego jak if status code is 304 or Age header exists then resource is cached. Ale co, jeśli nie ma nagłówka Cache-Control: max-age=xx? Czy istnieje nagłówek Wiek, tak szybko, jak zasób jest buforowany i świeży?

Przeprowadzimy dalsze dochodzenie w poniedziałek i aktualizujemy go tutaj.

Answer 2

Trzeba zbadać nagłówki HTTP, gdy obraz jest serwowane być 100% pewności. Niestety JavaScript nie ma dostępu do tych danych.

Patrz: Accessing the web page's HTTP Headers in JavaScript