Очистка кеша через параметры

Мы хотим кэшировать бюст при производственных развертываниях, но не тратить кучу времени на поиски системы для этого. Я подумал о том, чтобы применить параметр к концу файлов css и js с текущим номером версии:

<link rel="stylesheet" href="base_url.com/file.css?v=1.123"/>

Два вопроса: эффективно ли это сломает кеш? Будет ли параметр заставлять браузер никогда не кэшировать ответ с этого URL-адреса, поскольку параметр указывает, что это динамический контент?

Параметр ?v=1.123указывает строку запроса, и поэтому браузер будет думать, что это новый путь, скажем, от ?v=1.0. Таким образом, он загружается из файла, а не из кеша. Как ты хочешь.

И браузер будет предполагать, что источник останется прежним при следующем вызове, ?v=1.123и должен кэшировать его с этой строкой. Таким образом, он будет оставаться в кеше, независимо от настройки вашего сервера, до тех пор, пока вы не перейдете к нему ?v=1.124или так далее.

Два вопроса: эффективно ли это сломает кеш?

Да. Даже Stack Overflow использует этот метод, хотя я помню, что у них (с их миллионами посетителей в день и миллиардами различных версий и конфигураций клиентов и прокси) были некоторые странные случаи, когда даже этого было недостаточно, чтобы сломать кеш. Но общее предположение состоит в том, что это сработает и является подходящим методом для нарушения кэширования на клиентах.

Будет ли параметр заставлять браузер никогда не кэшировать ответ с этого URL-адреса, поскольку параметр указывает, что это динамический контент?

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

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

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

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

Как уже говорили другие, перебор кеша с помощью параметра запроса обычно считается плохой идеей (tm), и это было уже давно. Лучше отражать версию в названии файла. Html5 Boilerplate , среди прочего, не рекомендует использовать строку запроса.

Тем не менее, все рекомендации, которые я видел и цитирующие источник, похоже, основаны на своей мудрости из статьи Стива Содерса 2008 года. Его выводы основаны на поведении доверенных лиц в то время, и они могут быть актуальны или не актуальны в наши дни. Тем не менее, в отсутствие более свежей информации изменение имени файла является безопасным вариантом.

Он будет очищать кеш один раз, после того как клиент загрузит ресурс, каждый второй ответ будет обслуживаться из кеша клиента, если:

1. параметр v обновлен.
2. клиент очищает кеш

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

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

Это очень сильно зависит от того, насколько надежным должно быть ваше кеширование. Например, прокси-сервер squid (и, возможно, другие) по умолчанию не кэширует URL-адреса, обслуживаемые строкой запроса - по крайней мере, так было, когда была написана эта статья. Если вы не возражаете против определенных вариантов использования, вызывающих ненужные пропуски кеша, продолжайте работу с параметрами запроса. Но очень легко настроить схему очистки кеша на основе имени файла, которая позволяет избежать этой проблемы.

Найдено сравнение 2 методов (строки запроса против имени файла) здесь :

Версия как строка запроса имеет две проблемы.

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

Во-вторых, в некоторых более сложных сценариях развертывания, когда у вас есть несколько внешних и / или несколько внутренних серверов, обновление происходит не мгновенно. Вы должны иметь возможность одновременно обслуживать как старую, так и новую версию своих ресурсов. Посмотрите, например, как это влияет на вас при использовании Google App Engine.

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

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

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

1.2.3/css/styles.cssобслуживает тот же файл, что css/styles.cssи первый каталог, который удаляется и игнорируется файлом htaccess

Включение версионных файлов

<?php
  $version = "1.2.3";
?>

<html>
  <head>
    <meta http-equiv="cache-control" content="max-age=0" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="expires" content="0" />
    <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
    <meta http-equiv="pragma" content="no-cache" />
    <link rel="stylesheet" type="text/css" href="<?php echo $version ?>/css/styles.css">
  </head>
  <body>
    <script src="<?php echo $version ?>/js/main.js"></script>
  </body>
</html>

Обратите внимание, что этот подход означает, что вам нужно отключить кеширование вашей индексной страницы - Использование тегов <meta> для отключения кеширования во всех браузерах?

файл .htaccess

RewriteEngine On

# if you're requesting a file that exists, do nothing
RewriteCond %{REQUEST_FILENAME} !-f 
# likewise if a directory that exists, do nothing
RewriteCond %{REQUEST_FILENAME} !-d 

# otherwise, rewrite foo/bar/baz to bar/baz - ignore the first directory
RewriteRule ^[^/]+/(.+)$ $1 [L] 

Вы можете использовать тот же подход на любой серверной платформе, которая позволяет переписывать URL

(условие перезаписи адаптировано из mod_rewrite - перезаписать каталог в строку запроса, кроме / #! / )

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

<script type="text/javascript">
// front end cache bust

var cacheBust = ['js/StrUtil.js', 'js/protos.common.js', 'js/conf.js', 'bootstrap_ECP/js/init.js'];   
for (i=0; i < cacheBust.length; i++){
     var el = document.createElement('script');
     el.src = cacheBust[i]+"?v=" + Math.random();
     document.getElementsByTagName('head')[0].appendChild(el);
}
</script> 

 <script>
    var storedSrcElements = [
         "js/exampleFile.js",
         "js/sampleFile.js",
         "css/style.css"
          ];

    var head= document.getElementsByTagName('head')[0];
    var script;
    var link;
    var versionNumberNew = 4.6;

    for(i=0;i<storedSrcElements.length;i++){
     script= document.createElement('script');
     script.type= 'text/javascript';
     script.src= storedSrcElements[i] + "?" + versionNumberNew;
     head.appendChild(script);
    }     


     </script> 


       ### Change the version number  (versionNumberNew) when you want the new files to be loaded  ###

Надеюсь, это поможет вам ввести внешний JS файл.

<script type="text/javascript"> 
var cachebuster = Math.round(new Date().getTime() / 1000); 
document.write('<scr'+'ipt type="text/javascript" src="external.js?cb=' +cachebuster+'"></scr' + 'ipt>');
</script>

Источник - код Cachebuster на JavaScript