Как заставить браузер видеть изменения CSS и Javascript?

Я обнаружил, что если вы добавите последнюю измененную метку времени файла в конец URL-адреса, браузер будет запрашивать файлы при его изменении. Например в PHP:

function urlmtime($url) {
   $parsed_url = parse_url($url);
   $path = $parsed_url['path'];

   if ($path[0] == "/") {
       $filename = $_SERVER['DOCUMENT_ROOT'] . "/" . $path;
   } else {
       $filename = $path;
   }

   if (!file_exists($filename)) {
       // If not a file then use the current time
       $lastModified = date('YmdHis');
   } else {
       $lastModified = date('YmdHis', filemtime($filename));
   }

   if (strpos($url, '?') === false) {
       $url .= '?ts=' . $lastModified;
   } else {
       $url .= '&ts=' . $lastModified;
   }

   return $url;
}

function include_css($css_url, $media='all') {
   // According to Yahoo, using link allows for progressive 
   // rendering in IE where as @import url($css_url) does not
   echo '<link rel = "stylesheet" type = "text/css" media = "' .
        $media . '" href = "' . urlmtime($css_url) . '">'."\n";
}

function include_javascript($javascript_url) {
   echo '<script type = "text/javascript" src = "' . urlmtime($javascript_url) .
        '"></script>'."\n";
}

Некоторые решения, которые я видел, включают добавление номера версии в конец файла в виде строки запроса.

<script type = "text/javascript" src = "funkycode.js?v1">

Вы можете использовать номер версии SVN для автоматизации этого для тебя, включив слово LastChangedRevision в ваш html-файл после того, как v1 появляется выше. Вы также должны настроить свой репозиторий для этого.

Надеюсь, это еще больше проясняет мой ответ?

Firefox также позволяет нажимать CTRL + R, чтобы перезагрузить все на определенной странице.

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

Когда вы выпускаете новую версию ваших библиотек CSS или JS, происходит следующее:

1. измените имя файла, чтобы включить уникальную строку версии
2. изменить файлы HTML, которые ссылаются на библиотеку, чтобы они указывали на файл с версией

(обычно это довольно просто для сценария выпуска)

Теперь вы можете установить срок действия CSS / JS на годы вперед. Каждый раз, когда вы изменяете контент, если ссылающийся HTML указывает на новый URI, браузеры больше не будут использовать старую кэшированную копию.

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

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

Мне было трудно понять, как предполагалось использовать код. (Я не использую систему контроля версий.) Таким образом, вы включаете метку времени (ts) при вызове таблицы стилей. Вы не планируете часто менять таблицу стилей:

<?php 
    include ('grom_file.php');
    // timestamp on the filename has to be updated manually
    include_css('_stylesheets/style.css?ts=20080912162813', 'all');
?>