Отключить кеш для некоторых изображений

Ответ 1

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

Итак, например -

<img src="image.png" />

Стал бы

<img src="image.png?dummy=8484744" />

или

<img src="image.png?dummy=371662" />

С точки зрения веб-сервера доступен один и тот же файл, но с точки зрения браузера кэширование не может выполняться.

Генерация случайного числа может происходить либо на сервере при обслуживании страницы (просто убедитесь, что сама страница не кэшируется...), либо на клиенте (с использованием JavaScript).

Вам нужно будет проверить, может ли ваш веб-сервер справиться с этим трюком.

Ответ 2

Стратегии кэширования браузера могут контролироваться HTTP-заголовками. Помните, что это всего лишь подсказка. Поскольку браузеры в этой (и любой другой) области крайне несовместимы, вам потребуется несколько заголовков, чтобы получить желаемый эффект для ряда браузеров.

header ("Pragma-directive: no-cache");
header ("Cache-directive: no-cache");
header ("Cache-control: no-cache");
header ("Pragma: no-cache");
header ("Expires: 0");

Ответ 3

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

Решение 2 бесполезно. Добавление заголовков nocache к файлу изображения не только очень сложно реализовать, но и совершенно нецелесообразно, поскольку требует, чтобы вы заранее предсказывали, когда оно понадобится, при первой загрузке любого изображения. который, как вы думаете, может измениться в будущем.

Введите Etags...

Абсолютно лучший способ, который я нашел для решения этой проблемы, - это использовать ETAGS внутри файла .htaccess в каталоге изображений. Далее Apache сообщает об отправке уникального хэша в браузер в заголовках файла изображения. Этот хэш изменяется только при изменении файла изображения, и это изменение вызывает браузер для перезагрузки изображения при следующем запросе.

<FilesMatch "\.(jpg|jpeg)$">
FileETag MTime Size
</FilesMatch>

Ответ 4

Если вам нужно сделать это динамически в браузере с помощью javascript, вот пример...

<img id=graph alt="" 
  src="http://www.kitco.com/images/live/gold.gif" 
  />

<script language="javascript" type="text/javascript">
    var d = new Date(); 
    document.getElementById("graph").src = 
      "http://www.kitco.com/images/live/gold.gif?ver=" + 
       d.getTime();
</script>

Ответ 5

Я проверил все ответы, и лучший из них казался (а это не так):

<img src="image.png?cache=none">

.

Однако, если вы добавите параметр cache = none (который является статическим "ничем" ), это ничего не влияет, браузер все еще загружается из кеша.

Решение этой проблемы:

<img src="image.png?nocache=<?php echo time(); ?>">

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

Однако моя проблема была немного иной: Я загружал на лету сгенерированное изображение диаграммы php и управлял страницей параметрами $_GET. Я хотел, чтобы изображение читалось из кеша, когда параметр URL GET остается неизменным и не кэшируется при изменении параметров GET.

Чтобы решить эту проблему, мне нужно было хэш $_GET, но поскольку это массив, это решение:

$chart_hash = md5(implode('-', $_GET));
echo "<img src='/images/mychart.png?hash=$chart_hash'>";

Edit

Хотя приведенное выше решение работает просто отлично, иногда вы хотите обслуживать кешированную версию UNTIL, файл изменен. (с вышеупомянутым решением, он полностью отключает кеш для этого изображения) Таким образом, для обслуживания кэшированного изображения из браузера UNTIL есть изменение в использовании файла изображения:

echo "<img src='/images/mychart.png?hash=" . filemtime('mychart.png') . "'>";

filemtime() получает время изменения файла.

Ответ 6

Я знаю, что эта тема старая, но она очень хорошо зарекомендовала себя в Google. Я узнал, что это хорошо работает в вашем заголовке;

<meta Http-Equiv="Cache-Control" Content="no-cache">
<meta Http-Equiv="Pragma" Content="no-cache">
<meta Http-Equiv="Expires" Content="0">
<meta Http-Equiv="Pragma-directive: no-cache">
<meta Http-Equiv="Cache-directive: no-cache">

Ответ 7

Изменение источника изображения - это решение. Вы действительно можете сделать это, добавив к изображению временную метку или случайное число.

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

Ответ 8

Я просто искал решение этого, и ответы выше не работали в моем случае (и у меня недостаточно репутации, чтобы прокомментировать их). Оказывается, что, по крайней мере, для моего брэнда и браузера, который я использовал (Chrome OSX), единственное, что, казалось, предотвращало кеширование, было:

Cache-Control = 'no-store'

Для полноты я теперь использую все 3 "no-cache, no-store, must-revalidate"

Итак, в моем случае (работа с динамически генерируемыми изображениями из Flask в Python), я должен был сделать следующее, чтобы, надеюсь, работать как можно большим количеством браузеров...

def make_uncached_response(inFile):
    response = make_response(inFile)
    response.headers['Pragma-Directive'] = 'no-cache'
    response.headers['Cache-Directive'] = 'no-cache'
    response.headers['Cache-Control'] = 'no-cache, no-store, must-revalidate'
    response.headers['Pragma'] = 'no-cache'
    response.headers['Expires'] = '0'
    return response

Ответ 9

У меня возникла эта проблема и преодолела подобное.

var newtags='<div class="addedimage"><h5>preview image</h5><img src="'+one+'?nocache='+Math.floor(Math.random() * 1000)+'"></div>';

Ответ 10

Я использовал это, чтобы решить мою аналогичную проблему... отображение счетчика изображений (от внешнего поставщика). Он не обновлялся всегда правильно. И после добавления случайного параметра все работает нормально:)

Я добавил строку даты, чтобы обеспечить обновление, по крайней мере, каждую минуту.

пример кода (PHP):

$output .= "<img src=\"http://xy.somecounter.com/?id=1234567890&".date(ymdHi)."\" alt=\"somecounter.com\" style=\"border:none;\">";

В результате получается ссылка src, например:

http://xy.somecounter.com/?id=1234567890&1207241014

Ответ 11

Если у вас есть URL с жестким кодом, например: http://example.com/image.jpg, вы можете использовать php для добавления заголовков к вашему изображению.

Сначала вам нужно будет сделать apache для обработки вашего jpg как php. Глянь сюда: Возможно ли выполнить PHP с расширением file.php.jpg?

Загрузите изображение (imagecreatefromjpeg) из файла, затем добавьте заголовки из предыдущих ответов. Используйте заголовок функции php для добавления заголовков.

Затем выведите изображение с помощью функции imagejpeg.

Обратите внимание, что очень небезопасно передавать php файлы jpg. Также имейте в виду, что я не тестировал это решение, поэтому вам решать, чтобы он работал.

Ответ 12

Добавьте еще одно решение в связку.

Добавление уникальной строки в конце - идеальное решение.

example.jpg?646413154

Следующее решение расширяет этот метод и обеспечивает как кеширование, так и выборку новой версии при обновлении изображения.

Когда изображение будет обновлено, filemtime будет изменено.

<?php
$filename = "path/to/images/example.jpg";
$filemtime = filemtime($filename);
?>

Теперь выведите изображение:

<img src="images/example.jpg?<?php echo $filemtime; ?>" >

Ответ 13

Простой, отправьте одно местоположение заголовка.

Мой сайт, содержит одно изображение, а после загрузки изображения не изменяется, затем я добавляю этот код:

<?php header("Location: pagelocalimage.php"); ?>

Работайте для меня.