← Todos los artículos

User agent switcher: qué hace y cuándo lo necesitas

Qué cambia un user agent switcher, por qué por sí solo no te da una vista móvil, qué papel tienen los client hints y cómo elegir una extensión segura.

Un user agent switcher es una herramienta del navegador, normalmente una extensión, que cambia la cadena de user agent que tu navegador envía a las webs, para que un sitio crea que usas otro navegador u otro dispositivo. Se usa en desarrollo para ver el contenido que se sirve a navegadores concretos y para comprobar la detección de dispositivos. Pero cambiar el user agent no muestra por sí solo un diseño móvil: el viewport, el tamaño de pantalla y la densidad de píxeles siguen igual, así que para probar en móvil necesitas una herramienta que cambie también eso.

Qué es un user agent

Cada petición que hace tu navegador incluye una cabecera User-Agent, una cadena de texto que describe el navegador, el motor y el sistema operativo. Un Chrome reciente en Windows envía algo así:

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

y Chrome en un móvil Android, algo así:

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

La extraña mezcla de nombres («Mozilla», «AppleWebKit», «like Gecko», «Safari») es histórica: los navegadores copiaron las cadenas de otros para que las webs que detectaban un navegador concreto no dejaran fuera al resto. La palabra Mobile es lo que miran muchos servidores para decidir si envían una página móvil.

User-Agent reducido y client hints

Chrome, Edge y otros navegadores Chromium envían ahora un user agent reducido. La versión menor se sustituye por ceros, la versión de Android y el modelo del dispositivo se congelan en valores genéricos (es el Android 10; K de arriba) y la versión de Windows es fija. La información detallada pasó a los User-Agent Client Hints, cabeceras como:

  • Sec-CH-UA: marca y versión principal del navegador
  • Sec-CH-UA-Mobile: ?1 en móvil, ?0 en escritorio
  • Sec-CH-UA-Platform: el sistema operativo

Los servidores pueden pedir más hints (modelo, versión completa) si los necesitan. JavaScript lee la misma información con navigator.userAgentData.

Esto importa para los switchers. Una herramienta que solo cambia la cabecera User-Agent y deja los client hints diciendo «escritorio» envía una imagen contradictoria, y algunas webs lo notarán. Las buenas herramientas cambian ambas cosas.

Para qué sirve un user agent switcher

  • Comprobar la detección de dispositivos. Si tu servidor, tu CDN o un plugin de WordPress sirve otro HTML a los móviles, cambiar el user agent te muestra esa versión.
  • Reproducir un informe de error. Alguien dice que la web falla «en Samsung Internet». Usar ese user agent puede destapar ramas de código que dependen del user agent.
  • Probar avisos de «navegador no compatible» y polyfills para navegadores concretos.
  • Ver lo que ven los bots, como el user agent de un rastreador, al depurar SEO o reglas para bots.

Lo que un user agent switcher no puede hacer

Cambiar el user agent no cambia:

  • el ancho del viewport, así que tus media queries de CSS no reaccionan
  • screen.width, devicePixelRatio ni el soporte táctil que ve JavaScript
  • el motor de renderizado: hacerse pasar por Safari no hace que Chrome renderice como WebKit

Por eso, una ventana de Chrome de escritorio con user agent de iPhone suele mostrar un híbrido extraño: el HTML móvil del servidor estirado sobre un diseño de ancho de escritorio. Para una vista móvil de verdad hace falta emular a la vez el viewport, la densidad de píxeles y el user agent. Eso hace el modo dispositivo de Chrome DevTools, y también una extensión de vista móvil como Mobile View Extension, que aplica en un paso el user agent del dispositivo, los client hints compatibles, el tamaño de pantalla, la densidad de píxeles y el perfil táctil. Los dos enfoques se comparan en extensión de simulador móvil o DevTools.

¿Hace falta una extensión?

Para una prueba puntual, no. Chrome DevTools puede sustituir el user agent de la pestaña actual en Network conditions, y el modo dispositivo lo pone automáticamente al elegir un móvil. Los pasos están en cómo cambiar el user agent en Chrome.

Una extensión compensa si cambias a menudo, quieres reglas por sitio o necesitas que el ajuste se mantenga con DevTools cerrado.

Cómo elegir una extensión de user agent switcher

Los user agent switchers ven y modifican cada petición que haces, así que elígelos como cualquier extensión con acceso amplio:

  1. Política de privacidad. Debe decir claramente que no recoge datos de navegación. Evita los que inyectan publicidad o analítica.
  2. Client hints. ¿Cambia las cabeceras Sec-CH-UA-* y navigator.userAgentData, y no solo la cadena User-Agent?
  3. Reglas por sitio o por pestaña, para no olvidarte un user agent falso activo en la web de tu banco.
  4. Preajustes actualizados. Los preajustes viejos con cadenas de Chrome 60 o iOS 11 provocan avisos de «navegador obsoleto».
  5. Actualizaciones recientes en Chrome Web Store.

Privacidad: ¿te protege un user agent aleatorio?

Las extensiones de «user agent aleatorio» prometen dificultar el rastreo. El efecto es limitado. Los scripts de fingerprinting usan muchas señales (tamaño de pantalla, fuentes, zona horaria, GPU), y un user agent que no encaja con el resto puede hacer tu navegador más singular, no menos. Para la privacidad, los navegadores con protección integrada contra el fingerprinting funcionan mejor que cambiar cadenas.

Preguntas frecuentes

¿Qué hace un user agent switcher?

Cambia la información del navegador y del dispositivo que tu navegador envía a las webs, para que te traten como otro navegador u otro dispositivo.

¿Cambiar el user agent me muestra la versión móvil de una web?

Muestra el HTML que el servidor envía a los móviles, pero no el diseño móvil, porque el ancho del viewport no cambia. Usa la emulación de dispositivos o una extensión de vista móvil que cambie también el viewport.

¿Es seguro usar un user agent switcher?

La técnica es inofensiva; el riesgo está en la extensión. Elige una con una política de privacidad clara, permisos mínimos y actualizaciones recientes, y desactívala cuando no la necesites.

Mira tu próximo sitio en versión móvil.

Añade la extensión y abre vistas de dispositivos en la misma pestaña en la que ya trabajas.