Определяем устройство с помощью PHP

Определяем устройство с помощью PHP

Популярное

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

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

Итак, я пошёл в интернет за готовым ответом, поскольку издавна исповедую практику «Сначала попробовать чужие костыли готовые решения, а если не нашёл — писать самостоятельно». Собственно, что я нашёл в интернете — это использовать $_SERVER[«HTTP_USER_AGENT»] или вообще пользоваться JavaScript’ом.

Затем, на одном форуме нашёл таки описание интересного и простого php-скрипта, которым уже достаточно давно пользуюсь и хочу поделиться с вами. Называется он Mobile-Detect (ссылка на GitHub). Это очень легковесное и удобное решение, которое использует ту самую строчку HTTP_USER_AGENT в комплекте с определёнными заголовками.

Проект постоянно поддерживается и обновляется, ибо весьма полезная вещь.

Подключается скрипт очень просто — с помощью requred_once мы указываем путь к файлу, а затем инициализируем объект:

require_once 'lib/Mobile_Detect.php'; // Подключаем скрипт
$detect = new Mobile_Detect; // Создаём экземпляр класса

Настройка скрипта завершена. Теперь через использование $detect мы можем определять устройства. Нам доступны следующие переменные для определения типа устройств:

  • isMobile — переменная, которая определяет любое мобильное устройство — как смартфон, так и планшет;
  • isTablet — переменная, которая предназначена для определения только планшетных компьютеров.

Также существуют две переменные для определения операционной системы мобильного устройства:

  • isiOS — определяет устройства под управлением iOs (iPhone и iPad);
  • isAndroidOS — устройства на Android;
  • isWindowsMobileOS и isWindowsPhoneOS — тут можно не просто узнать, что эта мобильная система производства Microsoft, но даже указать его версии. WindowsMobile уже не столь актуальна, поскольку мелкомягкие перешли на единую платформу, но если вдруг к нам зайдут пользователи Pocket PC и Smartphone, то мы модем предложить для них уникальный сервис;
  • isBlackBerryOS — можно определить также смартфоны этого производителя. Для России аппараты BlackBerry не слишком актуальны, но возможно всё (вдруг вы или ваш заказчик — фанат или пользователь этого девайса, и нужно сделать что-то особенное для других пользователей);
  • isPalmOS и isSymbianOS — для устройств на таких операционных системах есть переменные для определения. Для меня это очень редкие устройства — настолько, что в жизни таких не видел (но это не точно), только на сайты заходят редкие пользователи этих устройств.

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

  • isiPhone и isiPad — можно чётко определить для каждого из устройств Apple, что показывать его пользователю;
  • isSamsung — для устройств производства Samsung, один из самых популярных производителей;
  • isLG — телефоны производства LG также весьма популярны и для них можно сделать что-то особое;
  • isVertu — посетитель вашего сайта обладатель телефона Vertu, нужно больше золота (и умножаем все цены в магазине на 10).

В реальности этих переменных намного больше — на демо-странице скрипта можно увидеть список поддерживаемых переменных.

Для тех, кто хочет убойной точности и избирательности, можно указывать нужные устройства через значения UserAgent, но по мне такая избирательность уж слишком чрезмерная (хотя бывает всякое).

Разработчики не перестают совершенствовать свой продукт и вполне вероятно, что скоро нам будет доступна возможность определения версий браузеров и устройств (в первую очередь для продукции Apple) — функции уже есть в последнем релизе, но пока они находятся на бета-тестировании.

Теперь давайте разберём на примере принцип работы скрипта. Допустим, мы должны выводить для посетителя сайта разные сообщения в зависимости от операционной системы его устройства. Это будет выглядеть так:

// Подключаем скрипт и создаём экземпляр класса
require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect;

// Условие - если это устройство от Apple
if( $detect->isiOS() ){
    echo 'Cтиль - это главное!';
}

// Условие - если это устройство от Google
if( $detect->isAndroidOS() ){
    echo 'Вся власть роботам!';
}

Этот пример немного бесполезный, но очень простой. Немного подумав, этот скрипт можно исползовать для более изящных решений, например, в зависимости от операционной системы подключать разные стили и изображения, чтобы дизайн сайта адаптировался под устройство. Либо, если на вашей странице есть реклама мобильного приложения, выводил предложения о переходе на AppStore или Google Play соответственно. Идей для применения может быть много.

Предлагаю вашему вниманию ещё один пример, который используется на моём сайте. Суть кода следующая — мы выводим разные варианты шапки сайта в зависимости от типа устройства. Код (с сокращениями) следующий:

require_once 'functions/Mobile_Detect.php';
$detect = new Mobile_Detect;

if ( $detect->isMobile() ) { 
    // Здесь пишем код header'a который будет выводиться для мобильных устройств
} else {
    // Здесь код, который выводится, если устройство не мобильное
}

И напоследок самое сладкое — эта библиотека была портирована на JavaScriptVarnish Cache и LUA.

На основе этого скрипта написаны плагины и модули для WordPress, Drupal, Joomla, Magento, PrestaShop (там он вообще поставляется в стандартном пакете с версии 1.5), Laravel, Yii Framework и множество других фреймворков и языков и платформ.

Библиотека очень полезная и весьма доставляющая.

Всем отличного пользования!

Анатолий Куликов

Анатолий Куликов

Автор блога, веб-разработчик
  • at sign
  • vk logo
Комментариев нет

Добавить комментарий

Для отправки комментария вам необходимо авторизоваться.