Два метода автоматической версии файлов JavaScript и CSS на простом PHP
Как часто ваши клиенты жаловались вам на то, что они не могут видеть новые изменения, внесенные вами на их веб-сайт? Это часто случается со мной, и, похоже, это обычное явление и для других веб-разработчиков. Например, возможно, я только что обновил файлы JavaScript и / или CSS, но браузер моего клиента все еще использует их кешированную версию (не позволяя им видеть какие-либо новые изменения), и они не понимают, почему они ищут на более старом сайте.
Наиболее распространенный способ решения этой проблемы - это версия файлов JavaScript и CSS. К сожалению, для меня, однако, создание версий всех файлов вручную каждый раз, когда мне нужно выполнить развертывание, утомительно и чревато ошибками. К счастью, в этой статье есть способ обойти это, поэтому без лишних слов давайте рассмотрим два способа автоматической версии JavaScript и файлов CSS в PHP.
Обратите внимание: мы рассмотрим, как автоматически обновлять файлы JavaScript и CSS, но два следующих метода можно легко адаптировать к изображениям (или любым другим файлам).
Способ 1
Этот метод нацелен на использование времени модификации файла JavaScript или CSS для реализации автоматического управления версиями. Идея состоит в том, чтобы автоматически добавлять строку запроса к каждому из наших файлов. Эта строка запроса представляет их собственную версию, номер которой определяется по времени их модификации. Поступая таким образом, мы обманываем браузер, заставляя его думать, что указываются новые файлы, хотя на самом деле браузеры обычно просто смотрят на полное имя каждого файла (что означает, что они будут соответственно кэшироваться).
Этого легко добиться с помощью следующих строк кода:
Изучив HTML-код веб-страницы, мы увидим:
Обратной стороной этого метода является то, что некоторые браузеры могут игнорировать добавленные строки запроса и использовать ранее кэшированную копию вместо новой версии с теми же файлами. Вот почему мы рассмотрим второй метод.
Способ 2
Этот метод более сложен и направлен на автоматическое добавление версии каждого файла JavaScript и CSS непосредственно к их имени. Опять же, номер версии генерируется с использованием времени модификации файла. Во-первых, нам нужно добавить несколько дополнительных строк в наш файл .htaccess, поскольку требуются некоторые правила mod_rewrite, разрешающие номера версий в именах наших файлов:
Apache теперь будет автоматически перенаправлять любые файлы с 10 цифрами (поскольку 10 цифр охватывают все временные метки с 9.09.2001 по 20.11.2266) перед .css или .js расширение обратно только к имени файла и расширению. При наличии этих правил URL .../style.css теперь можно переписать как .../style.0123456789.css, и Apache будет рассматривать их как одни и те же файлы. Кроме того, поскольку имя второго файла отличается от имени первого, браузер проигнорирует ранее кэшированную копию файла.
Теперь нам нужно изменить логику импорта CSS и JavaScript. Этого легко добиться с помощью специальной функции PHP:
Изучив HTML-код веб-страницы, мы увидим:
Заключение
Отсутствие возможности просматривать новые обновления на веб-сайтах может сбивать с толку клиентов, не говоря уже о разочаровании для веб-разработчиков! Однако, как показано в моей статье, есть способ решить эту проблему. Используя вышеуказанные методы, браузер сможет кэшировать наши файлы JavaScript и CSS, но при внесении каких-либо изменений он не будет использовать их кэшированные копии (это означает, что мы не столкнемся с проблемами, когда клиенты не смогут просмотреть новые изменения в сайт).
Надеюсь, эта статья оказалась для вас полезной, спасибо за внимание! Не стесняйтесь обращаться ко мне с любыми вопросами, комментариями или предложениями.
