Как очистить кэш браузера при повторной загрузке изображения с тем же именем файла в php? - PullRequest
Новая
       2

Как очистить кэш браузера при повторной загрузке изображения с тем же именем файла в php?

16 голосов
/ 29 июня 2010

У меня есть список предметов, который также содержит миниатюру изображения.Иногда мне нужно изменить миниатюру изображения, но имя файла остается прежним.Есть ли способ заставить браузер загружать только что загруженное изображение вместо того, чтобы брать его из кэша браузера?

Это очень уместно, когда люди обновляют свои аватары, что вызывает замешательство у некоторых пользователей, которые продолжают видетьих старый аватар, пока они не очистят кеш браузера или не перезапустят браузер.

Ответы [ 6 ]

25 голосов
/ 19 декабря 2010

Добавить уникальный номер в конец изображения1008 *

Кстати, это хорошо работает для принудительного обновления других статических файлов

т.е. HTML для CSS-файлов 

<link rel="Stylesheet" href="../css/cssfile.css?<?= md5_file('cssfile.css'); ?>" />
6 голосов
/ 29 июня 2010

Вы можете использовать время изменения файла: 

<?

$filename = 'avatar.jpg';
$filemtime = filemtime($filename);

echo "<img src='".$filename."?".$filemtime."'>";

//result: <img src='avatar.jpg?1269538749'>

?>

при изменении файла очистит кеш клиента

2 голосов
/ 29 июня 2010

Вы можете сделать недействительным кеш для всей страницы, изменив заголовки : 

<?php
header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past
?>
1 голос
/ 31 января 2014

Кэшированные изображения также становятся недействительными при обновлении страницы вручную (нажатие F5 в браузере).Это можно смоделировать с помощью метода Javascript location.reload (), запускаемого при загрузке тела.Чтобы избежать постоянной перезагрузки, это может произойти только один раз.Когда пользователь загружает новый аватар, запрос ReloadPending постоянно устанавливается в его / ее сеансе и сбрасывается при получении ответа. 

<?php
if ($session['ReloadPending']) 
{   $session['ReloadPending']=false; 
       echo "<body onload='location.reload(true);'>"; 
} else echo "<body>";
?>

Перезагрузка всей страницы после загрузки аватара вызовет мерцание страницы, ноэто происходит только один раз, что, я считаю, приемлемо.

1 голос
/ 29 июня 2010

При отправке изображения не отправляйте заголовок Expires.Также рассмотрите возможность отправки этого заголовка кэша: 

Cache-Control: must-revalidate

Это заставит браузер каждый раз запрашивать у вашего сервера изображение.Следите за заголовком If-Modified-Since в запросе;если изображение не изменено, ответьте HTTP-кодом 304.

Вся эта процедура (must-revalidate, If-Modified-Since, 304 answer) позволит браузеру кэшировать содержимое изображения, нов то же время спросите у своего сервера, изменился ли файл.

Другое, может быть, более простое, решение состоит в том, чтобы только установить заголовок Expires на в ближайшем будущем например, десять минут, и проинформируйте пользователя о десятиминутной задержке.Это ускорит большинство загрузок страниц, так как нет необходимости выполнять какой-либо HTTP-запрос для изображения.

0 голосов
/ 22 октября 2015

Я обнаружил, что один из лучших способов сделать это - использовать один и тот же URL для получения и публикации изображения (REST).

POST / my / image (Cache-control: no-cache, must-revalidate)

GET / my / image (Cache-control: must-revalidate)

...