Как добавить кэширование браузера плеча для CDN in.реврайт?

у меня ниже кода в моем .htaccess

ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"

on

cdn.domain.com/abc.jpg (expiration not specified)
cdn.domain.com/abc.png (expiration not specified)

та же проблема для JS, CSS и других.

что мне нужно поставить .htaccess поэтому в основном достигают оценки в этом.

3 ответов


если вы хотите использовать кэширование браузера Leverage для CDN, хорошо кэшировать файлы, добавляя некоторые заголовки кэширования, такие как Cache-Control, Expires и Last-Modified.

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

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

# Leverage browser caching using mod_headers #
<IfModule mod_headers.c>
    <FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
        Header set Expires "Wed, 15 Apr 2020 20:00:00 GMT"
        Header set Cache-Control "public"
    </FilesMatch>
</IfModule>
# End of Leverage browser caching using mod_headers #

ниже пример тестирование:

# 1 YEAR
<FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$">
Header set Cache-Control "max-age=31536000, public"
</FilesMatch>

# 1 WEEK
<FilesMatch "\.(jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>

# 3 HOUR
<FilesMatch "\.(txt|xml|js|css)$">
Header set Cache-Control "max-age=10800"
</FilesMatch>

# NEVER CACHE - notice the extra directives
<FilesMatch "\.(html|htm|php|cgi|pl)$">
Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate"
</FilesMatch>

Тестирование Заголовков

вы можете проверить, находится ли заголовок Cache-Control: max-age в ваших файлах, выполнив команду "curl", такую как:

curl -I http://foo.bar.netdna-cdn.com/file.ext

HTTP/1.1 200 OK
Date: Fri, 16 Sep 2014 14:12:20 GMT
Content-Type: text/css
Connection: keep-alive
Cache-Control: max-age=604800, public  ← 1 Week caching time 
Expires: Thu, 21 May 2015 20:00:00 GMT
Vary: Accept-Encoding
Last-Modified: Thu, 24 Jan 2013 20:00:00 GMT
GMT; path=/; domain=.domain.com
Server: NetDNA-cache/2.2
X-Cache: HIT

вы использовали ниже код:

кэширование браузера с помощью Mod_Expires
Наиболее распространенным способом использования кэширования браузера является использование mod_expires. Следующий код можно добавить к вашему .htaccess и автоматически включит браузер кэширование для всех пользователей.

# Leverage browser caching using mod_expires #
<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpg "access plus 1 year"
    ExpiresByType image/jpeg "access plus 1 year"
    ExpiresByType image/gif "access plus 1 year"
    ExpiresByType image/png "access plus 1 year"
    ExpiresByType text/css "access plus 1 month"
    ExpiresByType application/pdf "access plus 1 month"
    ExpiresByType text/x-javascript "access plus 1 month"
    ExpiresByType application/x-shockwave-flash "access plus 1 month"
    ExpiresByType image/x-icon "access plus 1 year"
    ExpiresDefault "access plus 2 days"
</IfModule>
# End of Leverage browser caching using mod_expires #

Что такое кэширование в браузере?

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

enter image description here

есть определенные компоненты, которые должны быть включены для того, чтобы правильно использовать браузер кэширование. Например, необходимо указать средство проверки кэша, которое поможет браузеру определить, можно ли извлечь файл из локального кэша или необходимо сделать запрос на сервер. Кроме того, необходимо правильно задать заголовки Expires или Cache-Control для ресурсов. Использование обоих было бы излишним. Кроме того, Gtmetrix предпочитает истекает по сравнению с контролем кэша, поскольку он более широко поддерживается. Поэтому эта статья будет посвящена использованию заголовков Expires при демонстрации того, как используйте кеш браузера.

Кэш-Контроля
Cache-Control позволяет нам иметь немного больше контроля над нашим кэшированием браузера, и многим людям проще использовать его после установки.

# 1 Year for most static assets
<filesMatch ".(css|jpg|jpeg|png|gif|js|ico)$">
Header set Cache-Control "max-age=31536000, public"
</filesMatch>

Gzip Comporession (Полезно Для Magento)

<ifModule mod_gzip.c>
    mod_gzip_on Yes
    mod_gzip_dechunk Yes
    mod_gzip_item_include file \.(html?|txt|css|js|php|pl|asp|html)$
    mod_gzip_item_include handler ^cgi-script$
    mod_gzip_item_include mime ^text/.*
    mod_gzip_item_include mime ^application/x-javascript.*
    mod_gzip_item_exclude mime ^image/.*
    mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

<ifmodule mod_deflate.c>
    AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript
</ifmodule>

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

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

теперь пришло время включить модуль Expires headers в Apache (установите'ExpiresActive ' to ' On’), поэтому добавьте это к своему .файл htaccess:

<IfModule mod_expires.c>

# Enable expirations
ExpiresActive On 

</IfModule>

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

<IfModule mod_expires.c>

# Enable expirations
ExpiresActive On 

# Default directive
ExpiresDefault "access plus 1 month"

</IfModule>

это база. Теперь добавить все строки для каждого из ваших типов файлов (вы знаете, те, которые вы создали ранее для favicon, изображения, в CSS и в JavaScript). Вы получите фрагмент кода, который выглядит примерно так:

<IfModule mod_expires.c>

# Enable expirations
ExpiresActive On

# Default directive
ExpiresDefault "access plus 1 month"

# My favicon
ExpiresByType image/x-icon "access plus 1 year”

# Images
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"

# CSS
ExpiresByType text/css "access 1 month”

# Javascript
ExpiresByType application/javascript "access plus 1 year"

</IfModule>

теперь запустите еще один тест с GTmetrix и сравнить результаты. Это результат для моего тестового сайта после реализации заголовков Expires:

рекомендации

  • будьте агрессивны с кэшированием для всех статических ресурсов
  • срок действия не менее одного месяца (рекомендуется: доступ плюс 1 год)
  • не установить кэширование более чем на год вперед!

кэширование браузера с помощью WordPress Плагин

W3 Общий Кэш: Один из лучших плагинов кэширования со многими функциями, такими как кэширование, интеграция CDN (например, MaxCDN), которая ускорит производительность вашего сайта.

Примечание

  1. убедитесь в том, что mod_rewrite включен на вашем веб-сервере Apache, если нет, обратитесь в техническую группу веб-сервера, чтобы включить его, так как для завершения кэширования потребуется модуль перезаписи действие .
  2. предупреждение! если вы установили далекую будущую дату истечения срока действия для чего-то, а затем обновите один из этих файлов, вы должны изменить имя файла для браузера, чтобы повторно извлечь его.
    пример: если вы установите javascript на 1 год и обновите один из ваших файлов javascript, вам придется переименовать фактический файл. Хороший способ сделать это, версионность, т. е. myfile_v1.2.js, но проще всего быть осторожным с заголовками Expires (установочный что-то до 10 лет никогда не бывает хорошим вариантом ИМО).

вы заметили какие-либо улучшения для вашего сайта? Позаботились ли выше обо всех ваших файлах, перечисленных в разделе"используйте кеш браузера" и "добавить заголовки истекает"? позвольте мне знать в комментариях ниже.


вероятно, это не лучшая идея кэшировать файлы CDN на вашем хосте. Если вы можете использовать на вас хост CDN, чем лучше кэшировать файлы там, добавив некоторые заголовки кэширования, такие как Cache-Control, истекает, Последнего Изменения и так далее.

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