Сжатие gzip и кэширование в Nginx и Apache

Сейчас, браузеры поддерживают сжатие файлов и картинок, т.к. он является частью спецификации протокола HTTP 1.1. Такое сжатие, а именно сжатие текстовых форматов (например CSS, Javascipt или HTML) сможет уменьшить их объем до 70%. Работает это следующим образом:

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

Сжатие на веб-сервере Nginx

Если используете Linux (Debian/Ubuntu/Mint или CentOS/RedHat/Fedora) то путь к файлу конфигурации будет:

# vim /etc/nginx/nginx.conf

При использовании FreeBSD путь к файлу конфигурации лежит в:

# vim /usr/local/etc/nginx/nginx.conf

Если хотите использовать сжатие, то необходимо в файл сервера или в отдельный виртуальный хост прописать следующие строки:

#GZIP
 gzip on;
 gzip_min_length 1000;
 gzip_proxied expired no-cache no-store private auth;
 gzip_types text/plain application/xml;
# Буфер для gzip
 gzip_buffers 32 4k;
# Уровень сжатия, от 1-9
 gzip_comp_level 9;
# Поддержку IE6
 gzip_disable "msie6";
# Версия для использования gzip (1.0 или 1.1)
 gzip_http_version 1.1;
# Использовать статику
 gzip_static on;
 gzip_vary on;
 gzip_types text/css text/javascript text/xml text/plain text/x-component application/javascript application/x-javascript application/json application/xml application/rss+xml font/truetype application/x-font-ttf font/opentype application/vnd.ms-fontobject image/svg+xml;

Кэширование в Nginx

Кэширование (которое включается с опцией expires) для заголовки для картинок и статических файлов в nginx. Конфиг выглядит следующим образом:

# Кэш 24ч\1 сутки
 expires 86400s;
# Добавляем заголовки (хеадеры)
 add_header Pragma public;
 add_header Cache-Control "max-age=86400, public, must-revalidate, proxy-revalidate";
 #add_header "X-UA-Compatible" "IE=Edge,chrome=1";

# Правила rewrite для версированного CSS + JS через дериктиву filemtime
 location ~* ^.+\.(css|js)$ {
 rewrite ^(.+)\.(\d+)\.(css|js)$ $1.$3 last;
# Задаем сколько будет храниться кэш 
 expires 31536000s;
# Выключаем логирование 
 access_log off;
 log_not_found off;
# Добавляем заголовки (хеадеры)
 add_header Pragma public;
 add_header Cache-Control "max-age=31536000, public";
 }

# Агрессивное кэширование для статических файлов
 location ~* \.(asf|asx|wax|wmv|wmx|avi|bmp|class|divx|doc|docx|eot|exe|gif|gz|gzip|ico|jpg|jpeg|jpe|mdb|mid|midi|mov|qt|mp3|m4a|mp4|m4v|mpeg|mpg|mpe|mpp|odb|odc|odf|odg|odp|ods|odt|ogg|ogv|otf|pdf|png|pot|pps|ppt|pptx|ra|ram|svg|svgz|swf|tar|t?gz|tif|tiff|ttf|wav|webm|wma|woff|wri|xla|xls|xlsx|xlt|xlw|zip)$ {
# Задаем сколько будет храниться кэш 
 expires 31536000s;
# Выключаем логирование 
 access_log off;
 log_not_found off;
# Добавляем заголовки (хеадеры)
 add_header Pragma public;
 add_header Cache-Control "max-age=31536000, public";
 }

Это включит кэш на веб-сервере на максимальный период для всех перечисленных файлов.

Сжатие на веб-сервере Apache

По умолчанию модуль mod_deflate должен быть включен в apache. Но лучше убедиться и выполнить проверку и поискать следующую строку в конфиге веб-сервера apache:

LoadModule deflate_module modules/mod_deflate.so

Мы можем определить, какие типы файлов нужно сжать:

AddOutputFilterByType DEFLATE text/html text/plain text/css application/javascript

Пропишите следующую конфигурацию в виртуальный хост Apache и это включит сжатие mod_deflate для вашего сайта.

<Directory /var/www/html/>
<IfModule mod_mime.c>
 AddType application/x-javascript .js
 AddType text/css .css
</IfModule>
<IfModule mod_deflate.c>
 # Compress HTML, CSS, JavaScript, Text, XML and fonts
 AddOutputFilterByType DEFLATE application/javascript
 AddOutputFilterByType DEFLATE application/rss+xml
 AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
 AddOutputFilterByType DEFLATE application/x-font
 AddOutputFilterByType DEFLATE application/x-font-opentype
 AddOutputFilterByType DEFLATE application/x-font-otf
 AddOutputFilterByType DEFLATE application/x-font-truetype
 AddOutputFilterByType DEFLATE application/x-font-ttf
 AddOutputFilterByType DEFLATE application/x-javascript
 AddOutputFilterByType DEFLATE application/xhtml+xml
 AddOutputFilterByType DEFLATE application/xml
 AddOutputFilterByType DEFLATE font/opentype
 AddOutputFilterByType DEFLATE font/otf
 AddOutputFilterByType DEFLATE font/ttf
 AddOutputFilterByType DEFLATE image/svg+xml
 AddOutputFilterByType DEFLATE image/x-icon
 AddOutputFilterByType DEFLATE text/css
 AddOutputFilterByType DEFLATE text/html
 AddOutputFilterByType DEFLATE text/javascript
 AddOutputFilterByType DEFLATE text/plain
 AddOutputFilterByType DEFLATE text/xml
 #The following line is enough for .js and .css
 AddOutputFilter DEFLATE js css
 AddOutputFilterByType DEFLATE text/plain text/xml application/xhtml+xml text/css application/javascript application/xml application/rss+xml application/atom_xml application/x-javascript application/x-httpd-php application/x-httpd-fastphp text/html
</IfModule>
<IfModule mod_setenvif.c>
 # Удалить ошибки браузера (требуется только для очень старых браузеров)
 BrowserMatch ^Mozilla/4 gzip-only-text/html
 BrowserMatch ^Mozilla/4\.0[678] no-gzip
 BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
</IfModule>
<IfModule mod_headers.c> 
 Header append Vary User-Agent env=!dont-vary
</IfModule> 
<ifModule mod_gzip.c>
 mod_gzip_on Yes
 mod_gzip_dechunk Yes
 mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
 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>
</Directory>

Используем кеш на стороне браузера в Apache

Как только пользователь откроет сайт будут скачиваться не только код страницы с html страницы, и так же css, картинки, js. И одно открытие страницы файла обращается к серверу от нескольких десятков и аж до нескольких сотен! такие запросы очень нагружают сервер, и так же дают дополнительное время на загрузку страницы у пользователя.

Создаем файл .htaccess в своей домашней директории сайта и добавляем:

# кеширование в браузере на стороне пользователя
<IfModule mod_expires.c>
 #Включаем поддержку директивы Expires
 ExpiresActive On
 # Задаем время для хранения файлов в кэше для каждого типа 
 ExpiresDefault "access 7 days"
 ExpiresByType application/javascript "access plus 1 year"
 ExpiresByType text/javascript "access plus 1 year"
 ExpiresByType text/css "access plus 1 year"
 ExpiresByType text/html "access plus 7 day"
 ExpiresByType text/x-javascript "access 1 year"
 ExpiresByType image/gif "access plus 1 year"
 ExpiresByType image/jpeg "access plus 1 year"
 ExpiresByType image/png "access plus 1 year"
 ExpiresByType image/jpg "access plus 1 year"
 ExpiresByType image/x-icon "access 1 year"
 ExpiresByType application/x-shockwave-flash "access 1 year"
</IfModule>
# Cache-Control
<ifModule mod_headers.c>
# Задаем 30 дней для данного типа файла
<filesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)$">
 Header set Cache-Control "max-age=2592000, public"
</filesMatch>

# Задаем 30 дней для данного типа файла
<filesMatch "\.(css|js)$">
 Header set Cache-Control "max-age=2592000, public"
</filesMatch>

# Задаем 2 дня для данного типа файла
<filesMatch "\.(xml|txt)$">
Header set Cache-Control "max-age=172800, public, must-revalidate"
</filesMatch>

# Задаем 1 день для данного типа файла
<filesMatch "\.(html|htm|php)$">
 Header set Cache-Control "max-age=172800, private, must-revalidate"
</filesMatch>
</ifModule>

# использование кеша браузеров
FileETag MTime Size
<ifmodule mod_expires.c>
<filesmatch ".(jpg|jpeg|gif|png|ico|css|js)$">
 ExpiresActive on
 ExpiresDefault "access plus 1 year"
</filesmatch>
</ifmodule>

#Запрет отдачи HTTP-заголовков Vary браузерам семейства MSIE
<IfModule mod_setenvif.c>
 BrowserMatch "MSIE" force-no-vary
 BrowserMatch "Mozilla/4.[0-9]{2}" force-no-vary
</IfModule>

Проверка gzip и кэширования в Nginx и Apache

Если в списке нет mod_expires или mod_headers – выполните в консоли сервера (подключившись по ssh) по очереди следующие команды (это установит/включит mod_expires, mod_headers):

# a2enmod headers
 # a2enmod expires
 # service apache2 restart

Для индексной странички видим, что gzip включён, но для URL из js нет:

$ curl -I -H 'Accept-Encoding: gzip,deflate' https://disnetern.ru/ | grep gzip

А после добавления gzip_types получаем такое:

$ curl -I -H 'Accept-Encoding: gzip,deflate' https://disnetern.ru/

ИЛИ еще:

# curl --header "Accept-Encoding: gzip,deflate,sdch" -I http://linux-notes.org

HTTP/1.1 200 OK
Server: nginx
Date: Thu, 25 Jun 2015 11:27:22 GMT
Content-Type: text/html; charset=UTF-8
Connection: keep-alive
Vary: Accept-Encoding
Set-Cookie: wfvt_3183169984=558be599d6523; expires=Thu, 25-Jun-2015 11:57:21 GMT; path=/; httponly
X-Pingback: http://linux-notes.org/xmlrpc.php
X-UA-Compatible: IE=edge,chrome=1
Expires: Fri, 26 Jun 2015 11:27:22 GMT
Cache-Control: max-age=86400
Pragma: public
Cache-Control: max-age=86400, public, must-revalidate, proxy-revalidate
Content-Encoding: gzip

Включить .htaccess в apache2

Для того, чтобы включить .htaccess в Apache2, надо отредактировать /etc/apache2/sites-available и называется 000-default.conf (по-умолчанию, если на сервере один сайт).

<Virtualhost *:80>
        ServerAdmin admin@site.com

        DocumentRoot /var/www

        <Directory /var/www>
                Options Indexes FollowSymLinks MultiViews
                AllowOverride All
                Order allow,deny
                allow from all
        </Directory>
</Virtualhost>

Перезагружаем apache:

service apache2 reload

Всё. Теперь Ваш .htaccess работает в любой под директории /var/www

Ключевым параметром в данном случае является AllowOverride All. Также можете найти и поправить секцию Directory в /etc/apache2/apache2.conf.

Помощь проекту

Поиск по сайту