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

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

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

Ответ 1

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

<?php

echo "<img src=../thumbnail.jpg?" . time() . ">";

сделать это только в форме для обновления аватара

работает для меня

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

то есть. html для файлов css

<link rel="Stylesheet" href="../css/cssfile.css?<?= md5_file('cssfile.css'); ?>" />

Ответ 2

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

<?

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

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

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

?>

когда файл будет изменен, будет очищен кеш клиента

Ответ 3

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

<?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
?>

Ответ 4

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

Cache-Control: must-revalidate

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

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

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

Ответ 5

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

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

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

Ответ 6

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

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

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