Есть ли способ заставить браузеры обновлять / загружать изображения?

У меня проблема, когда пользователи сообщают, что их изображения не загружаются, а старые все еще там. При ближайшем рассмотрении новые снимки есть, они просто имеют то же имя, что и старый. Что я делаю при загрузке, так это переименовываю изображения в целях SEO. Когда они удаляют изображение, старый индекс становится доступным и используется повторно. Поэтому он имеет то же самое имя изображения.

есть ли способ (я думал, может быть, для этого может быть мета-тег) сказать браузер, чтобы не использовать его cahce?

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

34
browser browser-cache html image-caching

10 ответов

добавьте строку запроса с произвольным уникальным номером(или временем, или номером версии и т. д.):

<img src="image.png?80172489074" alt="a cool image" />

это приведет к новому запросу из-за другого URL-адреса.

94

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

  • С помощью заголовка expires с датой в прошлом предотвращает кэширование. Плохо!--4-->
  • Добавление параметра "перебора кэша"?342038402 может устранить проблему, но также может предотвратить кэширование изображения, что не то, что вы хотите. Плохой.
  • использование заголовка expires с коротким (скажем, 1 час) истекает лучше... через час пользователь увидит изображение, но ваш веб-сервер не должен будет обслуживать его каждый раз. Компромисс, но какое время работает? Не совсем осуществимо.

решение? Я могу придумать два хороших варианта:--1-->

  • посмотрите в eTags, и ваша способность использовать их. Они предназначены для этой ситуации. Браузер будет явно спрашивать ваш сервер, является ли файл обновленным или нет. Вы можете просто включить это в apache, если у вас его нет.
  • создать новый URL для каждого нового изображения (и используйте заголовок Far-future expires). Это то, над чем вы работаете.
19

вы можете поставить http-equiv на <meta> тег, который скажет браузеру не использовать кэш (или даже лучше-использовать его определенным образом), но лучше настроить сервер для отправки правильного http cache заголовки. Проверьте статья о кэшировании.

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

4

добавьте текущее время datetime к изображению src:

<img src="yourImage.png?v=<?php echo Date("Y.m.d.G.i.s")?>" />
3

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

установка заголовка expires в прошлом заставит браузер не использовать кэшированную версию.

Expires: Sat, 26 Jul 1997 05:00:00 GMT

вы можете обратиться к RFC получить более подробную информацию.

2

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

1

в PHP вы можете использовать этот трюк

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

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

1

в PHP вы можете отправить случайное число или текущую метку времени:

<img src="image.jpg?<?=Date('U')?>">

или

<img src="image.jpg?<?=rand(1,32000)?>">
0

Шли Наобум. Просто используйте случайное число и добавьте его с именем файла изображения. 

<img src="image.jpg?<?=rand(1,1000000)?>">
0

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

 <td><?php echo "<img heigth=90 width=260 border=1 vspace=2 hspace=2 src=".$row['address']."?=".rand(1,999)."/>" ?></td>
-1