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

Как можно настроить обновление SVG изображений вместе с кэшем сайта, чтобы изменения были видны после очистки кэша, аналогично файлам CSS?
  • 18 июня 2024 г. 1:41
Ответы на вопрос 2
Чтобы обновить SVG файл в кэше браузера, необходимо изменить URL файла SVG. 

Для этого можно добавить к URL параметр запроса, который меняется при каждом обновлении файла. Например, можно добавить случайное число или дату и время последнего изменения SVG файла в виде параметра запроса. Это заставит браузер загружать обновленный файл, даже если у него уже есть кэшированная версия.

Пример:

```html
<img src="image.svg?version=123456">
```

При каждом изменении файла SVG нужно обновлять параметр запроса (например, менять значение version=123456 на version=654321).

Чтобы настроить обновление SVG изображений вместе с кэшем сайта, можно также использовать механизм кэширования с помощью файла .htaccess на сервере. Например, можно настроить кэширование на определенный период времени для статических файлов, включая SVG изображения, и при этом добавить возможность обновления кэшированных файлов с помощью заголовков кэширования.

Пример настройки кэширования в .htaccess:

```apache
<FilesMatch "\.(svg)$">
    Header set Cache-Control "max-age=604800, public"
</FilesMatch>
```

Этот пример устанавливает кэширование для файлов SVG на 7 дней (604800 секунд). При изменении файла SVG необходимо изменить его URL или обновить кэш браузера.
Что у вас в $url.icon? ссылка-на-svg#название-иконки? тогда, дописывая в конец этой строки ?{сгенерированный код} вы просто ломаете название иконки из svg-файла. Надо писать: 
ссылка-на-svg?{сгенерированный код}#название-иконки
Похожие вопросы