Подмена user agent: что делает user agent switcher и когда он нужен

Что меняет переключатель user agent, почему одной подмены мало для мобильного вида, при чём здесь client hints и как выбрать безопасное расширение.

User agent switcher — инструмент браузера, обычно расширение, который меняет строку user agent, отправляемую сайтам, чтобы сайт думал, что вы пользуетесь другим браузером или устройством. Разработчики используют его, чтобы увидеть контент, который отдаётся определённым браузерам, и проверить определение устройств. Но сама по себе подмена user agent не покажет мобильную вёрстку: область просмотра, размер экрана и плотность пикселей остаются прежними, поэтому для мобильного тестирования нужен инструмент, который меняет и их.

Что такое user agent

Каждый запрос браузера содержит заголовок User-Agent — текстовую строку с описанием браузера, движка и операционной системы. Свежий Chrome на Windows отправляет примерно такое:

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/<major version>.0.0.0 Safari/537.36

а Chrome на Android-телефоне примерно такое:

Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/<major version>.0.0.0 Mobile Safari/537.36

Странная смесь названий («Mozilla», «AppleWebKit», «like Gecko», «Safari») сложилась исторически: браузеры копировали строки друг друга, чтобы сайты, проверяющие один браузер, не отсекали остальные. Многие серверы смотрят на слово Mobile, чтобы решить, отдавать ли мобильную страницу.

Сокращённый User-Agent и client hints

Chrome, Edge и другие браузеры на Chromium теперь отправляют сокращённый user agent. Минорная версия заменена нулями, версия Android и модель устройства заморожены на общих значениях (это и есть Android 10; K выше), версия Windows зафиксирована. Подробные сведения переехали в User-Agent Client Hints — заголовки вроде:

Sec-CH-UA: бренд браузера и основная версия;
Sec-CH-UA-Mobile: ?1 на мобильных, ?0 на десктопе;
Sec-CH-UA-Platform: операционная система.

При необходимости сервер может запросить дополнительные подсказки (модель, полную версию). JavaScript читает те же сведения через navigator.userAgentData.

Для переключателей это важно. Инструмент, который меняет только заголовок User-Agent, а client hints оставляет «десктопными», отправляет противоречивую картину, и некоторые сайты это заметят. Хорошие инструменты меняют и то и другое.

Для чего полезна подмена user agent

Проверка определения устройств. Если сервер, CDN или плагин WordPress отдают телефонам другой HTML, подмена user agent покажет эту версию.
Воспроизведение баг-репорта. Посетитель пишет, что сайт ломается «в Samsung Internet». Подставив этот user agent, можно найти ветки кода, зависящие от user agent.
Проверка плашек «браузер не поддерживается» и полифилов для конкретных браузеров.
Проверка того, что видят боты, например user agent поискового робота, при отладке SEO или правил для ботов.

Чего подмена user agent не умеет

Смена user agent не меняет:

ширину области просмотра, поэтому медиазапросы CSS не срабатывают;
screen.width, devicePixelRatio и поддержку касаний, которые видит JavaScript;
движок отрисовки: если притвориться Safari, Chrome не начнёт рисовать как WebKit.

Поэтому окно десктопного Chrome с user agent iPhone часто показывает странный гибрид: мобильный HTML от сервера, растянутый на десктопную ширину. Для настоящего мобильного вида нужна эмуляция области просмотра, плотности пикселей и user agent вместе. Это делает режим устройства в Chrome DevTools, а также расширение для мобильного просмотра, например Mobile View Extension: оно одним действием применяет user agent конкретного устройства, поддерживаемые client hints, размер экрана, плотность пикселей и профиль касаний. Подходы сравниваются в статье расширение-симулятор или DevTools.

Нужно ли вообще расширение?

Для разовой проверки нет. Chrome DevTools умеет подменять user agent для текущей вкладки в разделе Network conditions, а режим устройства задаёт его автоматически, когда вы выбираете телефон. Шаги описаны в статье как изменить user agent в Chrome.

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

Как выбрать расширение для подмены user agent

Переключатели user agent видят и изменяют каждый ваш запрос, поэтому выбирайте их, как любое расширение с широким доступом:

Политика конфиденциальности. В ней должно быть ясно сказано, что данные о просмотрах не собираются. Избегайте переключателей, которые встраивают рекламу или аналитику.
Client hints. Меняет ли расширение заголовки Sec-CH-UA-* и navigator.userAgentData, а не только строку User-Agent?
Правила для сайтов или вкладок, чтобы не забыть поддельный user agent включённым на сайте банка.
Актуальные пресеты. Старые пресеты со строками Chrome 60 или iOS 11 вызывают предупреждения об устаревшем браузере.
Свежие обновления в Chrome Web Store.

Приватность: защищает ли случайный user agent?

Расширения со «случайным user agent» обещают усложнить отслеживание. Эффект ограничен. Скрипты фингерпринтинга используют множество сигналов (размер экрана, шрифты, часовой пояс, видеокарту), и user agent, который не сходится с остальными, может сделать ваш браузер более заметным, а не менее. Для приватности лучше подходят браузеры со встроенной защитой от фингерпринтинга, чем подмена строк.

Частые вопросы

Что делает user agent switcher?

Он меняет сведения о браузере и устройстве, которые ваш браузер отправляет сайтам, чтобы они воспринимали вас как другой браузер или устройство.

Покажет ли подмена user agent мобильную версию сайта?

Она покажет HTML, который сервер отдаёт мобильным устройствам, но не мобильную вёрстку, потому что ширина области просмотра не меняется. Используйте эмуляцию устройства или расширение для мобильного просмотра, которое меняет и область просмотра.

Безопасно ли пользоваться переключателем user agent?

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