2012-11-05 8 views
7

Mam aplikację, która wyświetla ten sam obraz w wielu lokalizacjach i może zmienić src obrazu.Dlaczego Chrome przesyła nowe żądanie tego obrazu SVG za każdym razem, ale nie w przypadku PNG?

Kiedy wskażę obraz w formacie PNG, który już wcześniej używałam, przeglądarka nie zada sobie nowych pytań, po prostu używa obrazu PNG, który jest już w pamięci podręcznej. Jednak gdy wskażę obraz obrazu SVG, z którego korzystałem wcześniej, przeglądarka (Chrome 22) wysyła nowe żądanie. Serwer zwraca kod 304 (niezmodyfikowany), więc nie trzeba pobierać nowego obrazu, ale to nadal wymaga dodatkowego przetwarzania.

ten może być łatwo testowane w tym jsFiddle: http://jsfiddle.net/jtmuw/1/

$('button').click(function() { 
    $('#a').attr('src', "myImage.svg"); 

    $('#b').attr('src', "myImage.png"); 
}); 

Jeśli otworzysz skrzypce z Chrome (lub przynajmniej v.22.0.1229.94 Chrome) i otworzyć swoją sieć zakładka, zobaczysz dwa obrazy zostały zażądane. Jeśli następnie kilka razy klikniesz "przeładuj obrazy", twoja karta sieciowa wyświetli wiele żądań dla obrazu SVG, ale bez dalszych żądań dotyczących obrazu PNG.

O ile wiem, te same nagłówki są zwracane przez serwer, więc nie widzę żadnego powodu dla różnicy.

Nie widzę tego na FF lub Safari, więc może to być problem z Chrome. Jednak wciąż mam wrażenie, że w nagłówkach brakuje pewnych podstawowych różnic i nie chodzi tylko o to, że Chrome bardzo dziwnie traktuje obrazy SVG.

+0

SVG jest ładowany tylko raz w przykładzie jsFiddle za pomocą Chromium 18. Ale widzę, że niektóre pliki JS są ładowane dwa razy. Drugie połączenie jest oznaczone jako "z pamięci podręcznej". Przypomina mi to [yepnopejs] (http://yepnopejs.com/), która ma wydarzenie, które ostatecznie zawiera plik. Może jest jakiś skrypt, który wykonuje drugi ładunek. – feeela

Odpowiedz

1

Być może możesz zmusić Chrome do buforowania pliku. W3Schools ma dość dobry przegląd tego, co następuje: http://www.w3schools.com/html/html5_app_cache.asp

Zasadniczo będziemy chcieli utworzyć plik manifestu (nazywają to ... „myCache.appcache” lub cokolwiek innego)

CACHE MANIFEST 
/path/to/svg/file.svg 

a następnie wskaż to w pliku html jako tak:

<html manifest="myCache.appcache"> 

to powie Chrome, że nawet gdy nie masz dostępu do Internetu, ten plik powinien być buforowane i dostępne w każdym razie.

+0

Czy to ci pomogło? :) –

1

Dołącz obraz SVG u góry dokumentu.

<html> 
<head> 
    ... 
</head> 
<body> 
    <img style="display:none" src="cached.svg"> 
    .... 
</body> 
<html> 
+0

Interesująca łatka! To zadziałało. '+ 1' – Sergio

Powiązane problemy