Vous êtes sur la page 1sur 5

Las diferencias de resolucin y tamao de pantalla entre los diferentes dispositivos mviles, como smart phones y tablets, y las

pantallas de los ordenadores son uno de los principales motivos que hacen que la experiencia de un usuario pueda no ser muy grata del dispositivo que utilice para conectarse a internet. Puede haber otros motivos que nos hagan requerir mostrar diferentes caractersticas a los usuarios segn el dispositivo que estn utilizando para acceder a nuestra web. Y eso es lo que vamos a aprender hoy. Vamos a ver como detectar los diferentes dispositivos mviles utilizando PHP. Para explicar el proceso he divido el artculo en dos partes: 1. Uso de la variable $_SERVER['HTTP_USER_AGENT'] para detectar dispositivos mviles. Explicamos como podemos detectar cualquier tipo de dispositivo construyendo nuestro propio cdigo. 2. Clase PHP-mobile-detect. Este proyecto open source nos ahorrar mucho trabajo y est listo para usar.
o

Ejemplo: Redireccin si el usuario utiliza un mvil o tablet

Uso de la variable $_SERVER['HTTP_USER_AGENT'] para detectar los diferentes dispositivos


La variable $_SERVER es una variable supergoblal (siempre disponible en cualquier parte de un script PHP) en forma de array y contiene diversa informacin del entorno del servidor y de ejecucin. Entre la informacin disponible en esta variable est la relativa al agente de usuario utilizado para acceder a la pgina. Para obtener esta informacin se utiliza $_SERVER['HTTP_USER_AGENT'] cuyo valor es el string contenido en la cabecera UserAgent de la solicitud HTTP recibida en el servidor. Por ejemplo, esta variable me devuelve la siguiente cadena si accedo con Firefox desde el PC que estoy utilizando en estos momentos:
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:17.0) Gecko/20100101 Firefox/17.0

Como ves, contiene la informacin del navegador, del sistema operativo y algunos datos ms. Podramos utilizar la funcin PHP get_browser() pero la variable $_SERVER est siempre disponible sin que necesitemos llamar a ninguna otra funcin, al menos para nuestro propsito de detectar dispositivos mviles es ms que suficiente y la funcin get_browser() se puede reservar para casos en los que necesitemos conocer caractersticas especficas del navegador (por ejemplo si acepta cookies o no, si tiene activado javascript, etc).

Una vez que tenemos la cadena del User-Agent podemos, por ejemplo, hacer un preg_match para detectar el dispositivo que nos interese. Por ejemplo, con el siguiente cdigo podramos saber si el usuario est usando un iPhone o un mvil con Android:
<?php $useragent = $_SERVER['HTTP_USER_AGENT']; $dispositivo = "ni iPhone ni android";

if (preg_match("/iPhone/", $useragent)) { $dispositivo = "iphone";

} elseif (preg_match("/android/", $useragent)) { $dispositivo = "android"; }

echo $dispositivo;

?>

Cmo ves no es nada difcil. La complicacin viene del nmero de dispositivos mviles existentes, lo que hace que nuestro cdigo se ample cada vez ms. Si queremos abarcar todos los dispositivos deberamos conocer los User-Agent de cada uno para poder hacer el correspondiente preg_match. Esta informacin tambin est disponible en .htaccess dnde tambin podemosdetectar dispositivos mviles con un RewriteCond. Pero no te preocupes por el problema de la cantidad creciente de dispositivos, alguien ya se tom la molestia. La clase PHP-mobile-detect es un proyecto de cdigo abierto mantenido y distribuido de forma gratuita en GitHub. Veamos un poco como utilizar esta clase.

La clase Mobile-Detect
En GitHub podemos encontrar muchos proyectos interesantes de cdigo abierto en los que adems podemos participar gracias a su funcionamiento estilo "red social". Uno de estos proyectos es la clase Mobile-Detect en PHP. Su uso es muy sencillo y abarca todos los dispositivos mviles actuales ms importantes a la vez que se actualiza con frecuencia para cubrir los nuevos que puedan aparecer.

La clase Mobile-Detect es un proyecto de cdigo abierto distribuida de forma gratuita. Si quieres puedes hacer un pequeo donativo para ayudar a que siga siendo gratuita. En la pgina del proyecto en GitHub puedes encontrar el enlace para hacer la donacin. El uso de esta clase es muy sencillo. Basta con descargar el archivo Mobile-Detect.php desde GitHub. Pon el archivo dnde quieras en tu servidor. Incluye este archivo en tu script php utilizando require o include segn tus necesidades y ya ests listo para detectar cualquier dispositivo mvil y tabletas:
<?php //si este script php y Mobile-Detect estn en la misma carpeta //si no, incluye la ruta correcta hacia el archivo include('Mobile_Detect.php'); $detect = new Mobile_Detect();

if ($detect->isMobile()) { //cualquier dispositivo mvil }

if ($detect->isTablet()) { //cualquier dispositivo tipo tableta } ?>

Con los mtodos anteriores puedes detectar cualquier dispositivo mvil o tablet. Si necesitas adems detectar de forma especfica la plataforma desde la que est accediendo el usuario a tu web puedes utilizar los siguientes mtodos:
if($detect->isiOS()){ //Estamos en un dispositivo con iOS de Apple como iPhone, iPod, ... }

if($detect->isAndroidOS()){ //Estamos en un dispositivo con Android de Google }

Tambin podemos detectar de forma especfica cada tipo de dispositivo. Para ver la lista completa soportada mira el archivo demo.php incluido en el paquete que has descargado desde GitHub. Por ejemplo:
$detect->isIphone(); $detect->isIpad(); $detect->isBlackBerry(); $detect->isKindle(); $detect->isOpera();

Otro mtodo interesante es el mtodo is(). Con l ponemos hacer lo mismo que con las funciones anteriores pero con la flexibilidad de poner el nombre que tu quieras, incluso si no est incluido en la clase de form nativa (este mtodo no es sensible a maysculas y minsculas, puedes poner iPhone, iphone o Iphone que tiene el mismo resultado). Por ejemplo:
//equivalente a $detect->isIphone() $detect->is('Iphone');

//equivalente a $detect->isChrome() $detect->is('Chrome');

//podemos detectar dispositivos an no incluidos de forma nativa en la clase $detect->is('miDispositivo');

Y no se queda aqu. La flexibilidad es tal que incluso podemos definir nuestra propia lista de User-Agent y forzar a la clase a utilizar esta lista. Ejemplo:
$userAgents = array( 'Mozilla/5.0 (Linux; Android 4.0.4; Desire HD Build/IMM76D) AppleWebKit/535.19 (KHTML, li ke Gecko) Chrome/18.0.1025.166 Mobile Safari/535.19', 'BlackBerry7100i/4.1.0 Profile/MIDP-2.0 Configuration/CLDC-1.1 VendorID/103', [...] ); foreach($userAgents as $userAgent){ $detect->setUserAgent($userAgent); $isMobile = $detect->isMobile(); $isTablet = $detect->isTablet();

//Resto de tu cdigo }

Quieres ms opciones? Tambin puedes obtener la versin de la plataforma o navegador:


$detect->version('iPad'); $detect->version('iPhone'); $detect->version('Android');

Ejemplo prctico: redireccionar si nos visitan desde un mvil


Un ejemplo bastante clsico sera la redireccin de los usuarios si nos visitan desde un mvil o un tablet. Esto se podra hacer con la clase Mobile-Detect tal y como se explic anteriormente ms la funcin header . Por ejemplo:
<?php include('Mobile_Detect.php'); $detect = new Mobile_Detect(); //redirigir el trafico a la version movil si nos visitan //desde un movil o un tablet if ($detect->isMobile() || $detect->isTablet()) { header("Location: http://movil.ejemplo.com"); } ?>

Aprende ms:

Vous aimerez peut-être aussi