Заголовок Vary: User-Agent - что это такое?

Заголовок Vary User-Agent позволяет серверу предоставлять разные версии контента в зависимости от пользователя. Это важный инструмент для корректного кэширования и правильного отображения страниц на разных устройствах.

Вы освоите настройку Vary User-Agent через .htaccess, WordPress, PHP и Nginx, а также увидите примеры правильной конфигурации. Вы научитесь оптимизировать работу сайта, повышать его производительность и обеспечивать корректное отображение для всех пользователей.

Обновлено: 2024-03-18 00:11:30 Вадим Дворниковавтор материала

Что такое Vary: User-Agent?

• Это http-заголовок, указывающий на то, что для разных пользователей предоставляется разный контент.
• Он используется для мобильного SEO, когда веб-страницы имеют отдельные версии для маленьких экранов
• Он может помочь Google и другим поисковым системам определить мобильную версию веб-страницы.
• Может использоваться определения того, как нужно кэшировать веб-страницу.

Ниже показано как выглядит этот http-заголовок:

Vary: User-Agent

Он указывает на то, что веб-страница реализована в нескольких версиях.

Для чего используется заголовок Vary: User-Agent?

Google рекомендует использовать HTTP-заголовок Vary: User-Agent, если динамическое обслуживание используется для предоставления мобильного контента пользователям или для настройки мобильного URL-адреса. Но если веб-страницы используют адаптивный дизайн, то применение данного заголовка не имеет смысла. Так как сервер отправляет один и тот же контент всем пользователям.

Запрос

Сервер, предоставляющий различный контент для разных пользователей, получает запрос на URL-адрес (например, www.example.com). Затем сервер идентифицирует устройство и возвращает мобильную версию веб-страницы мобильному пользователю или десктопную пользователю ПК.

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

Кеш

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

Решением этой проблемы является кэширование.

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

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

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

Возвращаемся к HTTP-заголовку Vary

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

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

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

Поисковые системы

Если Google неправильно видит веб-страницы, это отрицательно сказывается на ранжировании сайта.

То, как Google понимает, о чем ваша веб-страница в значительной степени, зависит от ее HTML-кода. Например, если поисковик получает мобильную страницу вместо десктопной, то он составляет неправильное представление о веб-странице.

Чтобы решить эту проблему, используйте http-заголовок Vary: User-Agent.

Как использовать заголовок Vary: User-Agent

• Используйте этот http-заголовок, если вы динамически обслуживаете различный контент для одного и того же URL-адреса.
• Если перенаправляете мобильных пользователей на другой URL-адрес.
• Не используйте этот http-заголовок, если всегда отправляете одинаковый контент по одному URL (примеры: адаптивный дизайн или отсутствие мобильной версии сайта).

Настройка http-заголовка Vary: User-Agent в файле .htaccess (для сервера Apache)

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

Header append Vary User-Agent 

Настройка http-заголовка Vary: User-Agent в WordPress

В WordPress заголовки устанавливаются в файле functions.php. Для добавления Vary: User-Agent может использоваться приведенный ниже код.

function add_vary_header($headers) {
$headers['Vary'] = 'User-Agent';
return $headers;
}
add_filter('wp_headers', 'add_vary_header'); 

Настройка http-заголовка Vary: User-Agent в PHP

Если устанавливаете http-заголовок Vary только для определенных веб-страниц, используйте следующее решение.

<? php 
header («Vary: User-Agent, Accept»); 
?>

Настройка http-заголовка Vary: User-Agent в Nginx

Примечание. Для использования этого решения требуется ngx_headers_more, который не включен в установку по умолчанию.

Проверка HTTP-заголовка Vary

Чтобы увидеть, какой заголовок страницы использует Vary, введите URL-адрес в инструменте Mobile SEO .

Вадим Дворниковавтор-переводчик статьи «Vary User-Agent header»