Впервые в своей практике, делал мобильную версию сайта. Должен скачать, что сделать сайт, который одинаково работал бы на огромном зоопарке мобильных браузеров, задача не из легких. Однако, в этой статье речь пойдет не об этом.
После того, как сайт был готов, возникла необходимость автоматически определять с какого типа устройств зашел пользователь, и отправлять его на соответствующую версию сайта.
Самый верный вариант: проверять возможности браузера при помощи js и затем перенаправлять. Но, это не подходит если мы не хотим чтобы пользователь грузил лишние килобайты, а автоматически был перенаправлен на нужную страничку. Поэтому требовалось серверное решение.
Когда-то, очень давно, я слышал про сервис Яндекс.Детектор. Его назначение просто и понятно: вы отправляете ему заголовки или user_agent, которые прислал Вам браузер, а сервис в ответе присылает технические характеристики устройства. То ли сервис чего-то напутал, то ли я чего-то не понял, но Яша упорно не мог определить ни десктопные браузеры, ни мобильные. Единственно верно он определил мобильный браузер моего Fly (на Андроие 2.3.5). Такой расклад меня мягко говоря не устроил, я решил поискать другие решения.
Как я и предполагал, одной из самых популярных решений - это поиск ключевых слов типа IPhone, Android, Blackberry и т.п. в user_agent браузера. Примеров в сети было много, и собрав несколько из них вполне можно было получить работоспособную функцию. Но учитывая дико растущий рынок смартфонов, и появления новых девайсов и операционок, я все же надеялся найти сервис, который бы пополнялся изо дня в день.
Такого сервиса я не нашел, но было найдено компромиссное решение: определение браузера по ключевым словам, но с использованием постоянно обновляющегося класса написанного на php. Раз в пол года, Вы обновляете скрипт, и получаете всегда актуальную проверку.
Представляю Вам легкий класс PHP для обнаружения мобильных устройств mobiledetect. Вот, что пишут его создатели про свой скрипт
Mobile_Detect это легкий класс PHP для обнаружения мобильных устройств. Он использует строку user агента в сочетании со специфическими заголовки HTTP для обнаружения мобильной среды.
Скачать скрипт можно на его githab страницы
Использовать достаточно просто
Подключение
<?php include 'Mobile_Detect.php'; $detect = new Mobile_Detect();
В наше время никого не удивишь 3-мя версиями сайта: основной(для десктопа), адаптированной(для планшетов), и мобильной.
Метод, который позволит определить, что пользователь зашел с мобильного устройства (смартфон, телефон и т.п.):
<?php
if ($detect->isMobile()) {
// выводим мобильную версию сайта
}
С планшета
<?php
if($detect->isTablet()){
// выводим адаптированную версию браузера
}
Я не делал отдельной адаптированной версии, поэтому меня устроил такой вариант:
if ($detect->isMobile() or $detect->isTablet()){
// выводим мобильную версию
}
Для моего проекта было актуально: показывать рекламу того приложения для устройства с которого зашел пользователь. Т.е. зашел он с Android, предлагаем ему скачать Android программу из Play Store, зашел с Iphone даем ссылку на AppStore. С данным классом определить операционную систему можно так:
<?php
if($detect->isiOS()){
// выводим рекламу для яблокофонов
}
<?php
if($detect->isAndroidOS()){
// рекламируем приложение корпорации добра
}
Есть еще куча методов isIphone(), isIpad(), isBlackBerry(), isKindle(), isOpera() и т.д. полный список можно посмотреть запустив demo.php из скачанного архива, либо на demo странице официального сайта скрипта
Проект активно развивается, и используется уже в куче известных систем Drupal, WordPress и т.д.
В конце лишь напишу, что надо дать возможность пользователю решать, нужна ли ему мобильная версия. Я сделал так: в самом низу мобильной версии сайта, была ссылка на основной сайт, но с параметром http://sitename.ru/?nomobile
А на сервере просто ставим куку, чтобы в дальнейшем не перенаправлять этого пользователя. Примерно так:
if( isset($_GET['nomobile']) ){
setcookie('nomobile','1',time()+3600*24,'/');
$_COOKIE['nomobile'] = 1;
}
define('NOMOBILE',isset($_COOKIE['nomobile']));
и наш скрипт автоматического перенаправления будет выглядеть так:
require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect();
if(!NOMOBILE and ($detect->isMobile() or $detect->isTablet())){
header("Location: ".'http://m.'.$_SERVER['HTTP_HOST']);
exit();
}
Спасибо за внимание
Комментарии
Могли бы привести пару примеров использования
// 4. Keep the value in $_SESSION for later use
// and for optimizing the speed of the code.
if(!$_SESSION['isMobile']){
$_SESSION['isMobile'] = $detect->isMobile();
}
Спасибо за примеры использования
И примеров по моему привел достаточно.
header('Location: http://'.getenv("SERVER_NAME").'/tindex. php');
exit();
}
if ( $detect->isMobile()) {
header('Location: http://m.'.getenv("SERVER_NAME"));
exit();
}
ставте в таком порядке .... сначала определяете планшет затем мобилный
Файл с устройствами регулярно обновляется и в нём учитываются еще и девайсы типа книгочиталок, смарт ТВ, планшетов, консолей и даже носимой электроники (на пример Google Glass). Кроме того определяется много полезного помимо типа устройства. На пример: параметры и версия ОС, версия браузера, поддерживаемые MIME типы, различные CSS технологии вроде canvas, разрешение экрана и многое другое.
Имею код
<?php
session_start();
require_once "Mobile-Detect-master/Mobile_Detect.php";
$detect = new Mobile_Detect();
if ($detect->isMobile() || $detect->isTablet()){
if (!isset($_SESSION["redirect"])){
$_SESSION["redirect"]="redirect";
header('Location: /magazine');
( 1ый раз при заходе, отправляет сразу на эту страницу , а последующие нет)
Как решить проблему?
}
}
Даже на андроиде много людей все ещё используют оперу мини... А для них желательно простую вап версию делать.
Вот.
if(mb_ereg("Mobile", $_SERVER['HTTP_USER_AGENT'])) {echo "Mobile";}
Потому-что, кроме SimbianOS, все совеременные мобильные платформы содержат слово Mobile в инфе браузера
[color=#ff0000]тест[/color]
Люблю простые изящные решения :)
Супер! Коммент по ценности как сама статья.
if ($detect->isMobile() or $detect->isTablet()){
является излишней.
if( isset($_GET['nomobile']) ){
setcookie('nomobile','1',time()+3600*24,'/');
$_COOKIE['nomobile'] = 1;
}
define('NOMOBILE',isset($_COOKIE['nomobile']));
Подскажите, пожалуйста! А то у меня при переходе с мобильной версии на полную при такой ссылке: http://blabla.bla/?nomobile вылетает Error:404
А как сделать, чтобы на компьютерах она выводилась а на мобильных не выводилась?
RSS лента комментариев этой записи