Отправляет email-рассылки с помощью сервиса Sendsay

.NET: Записки программиста

  Все выпуски  

Браузеры, кнопка "Back" и кеширование страниц


Браузеры, кнопка "Back" и кеширование страниц

Браузеры, кнопка Back и кеширование страниц Это - браузеры. Они отображают наши станицы.
А это - кеш браузера. Он старается, чтобы наши страницы отображались быстрее.
А это - AJAX. Он тоже старается, чтобы наши страницы отображались быстрее.
Но иногда, приходится стараться, чтобы они так не старались. Об одном таком случае и пойдет речь.

Итак, представте, что на вашем сайте есть страница, которая сама периодически обновляет список с online-информацией. Да через тот же AJAX. Чтобы представлять было проще, возьмем конкретный пример - текущие результаты футбольных матчей, которые обновляются примерно раз в две минуты. Online-результаты футбольных матчей на FanNet.org Болельщик открывает страницу - и на ней всегда актуальная информация. Теперь, он уходит на другую страницу, скажем, посмотреть описание какого-то матча. А потом ему хочется вернуться и он нажимает кнопку "Back". И видит, что последний раз результаты матчей обновлялись в момент, когда он уходил с этой страницы.

На первый взгляд - ничего страшного. Ясное дело, браузер взял страницу из кеша и поправить это - дело минуты.

Как вы уже догадались, все немного сложнее, иначе бы этого поста просто не было.

Первым делом, я решил запретить кеширование страницы. Результат был несколько странным - под IE все работало нормально, под FF - ничего не изменилось.

Ну вот, опять приходится читать документацию, вздохнул я и начал читать. В результате оказалось, что разработчики разных браузеров оптимизируют логику работы "Back" каждый по своему:
  • IE 8.x\7.x обращает внимание на настройки кеширования и берет страницу из кеша только если кеширование разрешено
  • FF 3.x просто берет страницу из кеша, даже если кешировать ее нельзя
  • Opera 9.x тоже берет страницу из кеша
Причем каждая команда как-то объясняет свой вариант и естественно считает его самым лучшим.

Порывшись в сети, я нашел простое решение:
// Refrech page after back button
function reloadIfBack()
{
var e = document.getElementById("refreshed");
if (e.value=="no")
{ e.value="yes"; }
else
{ e.value="no"; location.reload(); }
}
$(document).ready(reloadIfBack);

<input type="hidden" id="refreshed" value="no" />
Тут есть чуть jQuery, но даже, если вы с ней не знакомы, код должен быть понятен:
  1. Добавляем на страницу hidden поле, в котором сохранено состояние страницы "не обновлялась"
  2. На событие "страница загружена" вешаем метод "reloadIfBack"
  3. Этот метод проверяет, значение hidden поля. Если значение "no" - станица взята с сервера, тогда просто меняем его на "yes". Если "yes" - значит страница взята из кеша, сбрасываем поле и перезагружаем страницу
После этого под IE и FF все заработало, а вот под Opera осталось как и прежде. Оказалось, что у Opera система кеширования сильно переработана и отличается от IE и FF. Они очень гордятся тем, что страницы после "Back" открываются почти мгновенно, в минусах - идеи как обновить страницу я так и не нашел. Вернее я встретил одно описание, но мне настолько не понравилась его суть (это решение выбрасывало исключения под IE и FF, так что его приходилось брать в мертвый catch {}), что даже не стал ее проверять.

Потратив еще немного времени, я решил оставить все как есть, успокоив себя тем, что Opera распространена не так сильно, да и проблема не большая - все равно страница вскоре обновится. Но если у вас будут идеи, как заставить работать и Opera - пишите, буду рад это обсудить.


В избранное