- Определяем устройство с помощью PHP
- Определение Android устройства на PHP, JavaScript, htaccess
- JavaScript
- .htaccess
- Определите, является ли устройство iOS
- 11 ответов:
- обнаружение iOS
- почему не MSStream
- обнаружение версии iOS
- О том, как я написал простое приложение для Android/iOS
- План и подготовка
- Android
- Публикация в Google Play
- Публикация в iOS
- Выводы
Определяем устройство с помощью PHP
Однажды этот прекрасный день пришёл. День, когда я физически осознал, что мне нужно определять, каким устройством пользуется посетитель сайта, чтобы соответственно отрисовывать для него страницу.
Прошлая методика с помощью медиазапросов по ширине экрана в моих глазах себя изжила — в таком случае на страницу всё равно загружается все элементы, только часть из скрывается или модернизируется. С одной стороны — это правильный и надёжный подход. С другой стороны, когда у нас присутствуют тяжёлые медиафайлы (например, видеофон) или немного другое расположение элементов, то будет намного проще и лучше грузить только нужные элементы в зависимости от того, каким устройством пользуется посетитель сайта.
Итак, я пошёл в интернет за готовым ответом, поскольку издавна исповедую практику «Сначала попробовать чужие костыли готовые решения, а если не нашёл — писать самостоятельно». Собственно, что я нашёл в интернете — это использовать $_SERVER[«HTTP_USER_AGENT»] или вообще пользоваться JavaScript’ом.
Затем, на одном форуме нашёл таки описание интересного и простого php-скрипта, которым уже достаточно давно пользуюсь и хочу поделиться с вами. Называется он Mobile-Detect (ссылка на GitHub). Это очень легковесное и удобное решение, которое использует ту самую строчку HTTP_USER_AGENT в комплекте с определёнными заголовками.
Проект постоянно поддерживается и обновляется, ибо весьма полезная вещь.
Подключается скрипт очень просто — с помощью requred_once мы указываем путь к файлу, а затем инициализируем объект:
Настройка скрипта завершена. Теперь через использование $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) — функции уже есть в последнем релизе, но пока они находятся на бета-тестировании.
Теперь давайте разберём на примере принцип работы скрипта. Допустим, мы должны выводить для посетителя сайта разные сообщения в зависимости от операционной системы его устройства. Это будет выглядеть так:
Этот пример немного бесполезный, но очень простой. Немного подумав, этот скрипт можно исползовать для более изящных решений, например, в зависимости от операционной системы подключать разные стили и изображения, чтобы дизайн сайта адаптировался под устройство. Либо, если на вашей странице есть реклама мобильного приложения, выводил предложения о переходе на AppStore или Google Play соответственно. Идей для применения может быть много.
Предлагаю вашему вниманию ещё один пример, который используется на моём сайте. Суть кода следующая — мы выводим разные варианты шапки сайта в зависимости от типа устройства. Код (с сокращениями) следующий:
И напоследок самое сладкое — эта библиотека была портирована на JavaScript, Varnish Cache и LUA.
На основе этого скрипта написаны плагины и модули для WordPress, Drupal, Joomla, Magento, PrestaShop (там он вообще поставляется в стандартном пакете с версии 1.5), Laravel, Yii Framework и множество других фреймворков и языков и платформ.
Библиотека очень полезная и весьма доставляющая.
Источник
Определение Android устройства на PHP, JavaScript, htaccess
С развитием мобильных устройств, вебмастера все больше уделяют времени разработке именно для портативных устройств. Хороший сайт должен выглядеть одинаково не только в разных браузерах, но и корректно на разных устройствах. Поэтому важно определять тип клиента и вносить некоторые изменение в структуру сайта, конкретно для каждого из них.
Мы уже рассматривали, как определить пользователей iPad, iPhone на PHP. Сегодня мы научимся определять Android клиент разными способами. То есть с помощью JavaScript, PHP или .htaccess. Почему именно так?
Порой бывает необходимо только подгрузить нужный CSS файл, для этого можно обойтись JavaScript определением клиента «Android».
Если нужно больше… перенаправить на поддомен, или другой URL, тогда подойдет PHP или .htaccess вариант.
Помните! некоторым пользователям не по душе, когда их «посылают» на разные домены.
JavaScript
Поиск строки UserAgent, является наиболее быстрым методом определения Android с помощью JS.
Опять, тот же UserAgent, только используем функцию strstr, для поиска слова Android:
.htaccess
Мы можем использовать даже .htaccess директивы, для идентификации Android устройств.
Вот и все! Теперь у вас есть три разных способа определения Android устройств! Надеюсь, эта статья была полезной и не скучной! Успехов вам в мобильной разработке!
Источник
Определите, является ли устройство iOS
Мне интересно, можно ли определить, работает ли браузер на iOS, подобно тому, как вы можете обнаруживать функции с помощью Modernizr (хотя это, очевидно, обнаружение устройств, а не обнаружение функций).
обычно я бы предпочел обнаружение функций вместо этого, но мне нужно выяснить, является ли устройство iOS из-за того, как они обрабатывают видео в соответствии с этим вопросом API YouTube не работает с iPad / iPhone / non-Flash device
11 ответов:
обнаружение iOS
я не поклонник нюхания пользовательского агента, но вот как вы это сделаете:
другой способ полагается на navigator.platform :
iOS будет true или false
почему не MSStream
Microsoft ввела слово iPhone в для того, чтобы попытаться обмануть Gmail как-то. Поэтому мы должны исключить его. Подробнее об этом здесь и здесь.
ниже обновлено IE11 userAgent (Internet Explorer для Windows Phone 8.1 Update):
Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident / 7.0; Touch; rv: 11.0; IEMobile/11.0; NOKIA; Lumia 930) как iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, как Gecko) Mobile Safari / 537
легко добавить больше устройств, без использования обычных Выражения:
iOS() будет true или false
Примечание: и navigator.userAgent и navigator.platform может быть подделан пользователем или расширением браузера.
обнаружение версии iOS
наиболее распространенным способом обнаружения версии iOS является разбор его из строки агента пользователя. Но есть еще и характеристика определение вывод*;
мы точно знаем, что history API представил в под управлением ios4 — matchMedia API на iOS5 — webAudio API на iOS6 — WebSpeech API на iOS7 и так далее..
Примечание: следующий код не является надежным и сломается, если какая-либо из этих функций HTML5 устарела в новой версии iOS. Вы были предупреждены!
Если вы используете Modernizr, вы можете добавить пользовательское тестирование.
не имеет значения, какой режим обнаружения вы решили использовать (userAgent, navigator.поставщик или навигатор.платформа), вы всегда можете обернуть его для более легкого использования позже.
Это устанавливает переменную _iOSDevice to правда или ложные
пользовательские агенты на устройствах iOS говорят iPhone или iPad в них. Я просто фильтрую на основе этих ключевых слов.
упрощенная, легко расширяемая версия.
Я написал это пару лет назад, но я считаю, что это все еще работает:
везде, где это возможно при добавлении тесты Modernizr вы должны добавить тест для функции, а не устройства или операционной системы. Нет ничего плохого в добавлении десяти тестов все тестирование для iPhone, если это то, что нужно. Некоторые вещи просто не могут быть обнаружены.
например, на iPhone (не iPad) видео не может быть воспроизведено встраиваемым на веб-странице, он открывает полный экран. Поэтому я создал тест ‘no-inpage-video’
затем вы можете использовать это в CSS (Modernizr добавляет класс .no-inpagevideo до — тег, если тест не пройден)
это скроет видео на iPhone (то, что я на самом деле делаю в этом случае, показывает альтернативное изображение с помощью onclick для воспроизведения видео — я просто не хочу, чтобы по умолчанию отображался видеоплеер и кнопка воспроизведения).
Вау, здесь много длинноватого сложного кода. Будь проще, пожалуйста!
это ИМХО быстро, сохранить, и работает хорошо:
- это быстрее, потому что регулярное выражение проверяет ^sположение тартинга строки платформы сначала и останавливается, если нет » iP » (быстрее, чем поиск длинной строки UA до конца в любом случае)
- это безопаснее, чем проверка UA (предполагая навигатор.платформа менее вероятно подделана)
- обнаруживает iPhone / для iPad симулятор
чтобы обнаружить версию iOS, нужно уничтожить пользовательский агент с помощью кода Javascript следующим образом:
Источник
О том, как я написал простое приложение для Android/iOS
Хочу сразу отметить, что это не статья от профессионала, скорее взгляд любителя на мобильную разработку, скажем так, «с нуля». Мое основное занятие — это создание сайтов. В данное время я работаю у провайдера интернета и занимаюсь поддержкой внутреннего биллинга/сайта и так далее (PHP и немного Perl), довольно скучное занятие, скажу я вам. В общем, я обычный провинциальный «программист».
В один прекрасный момент у руководства компании возникла идея сделать мобильное приложение для iPhone, которое могло бы показать баланс пользователю, его статус, возможность взять «обещанный платеж», фактически, дублирование личного кабинета, но чтобы приложение. Не зная про мобильную разработку совсем ничего, идею воспринял с большим энтузиазмом, потому что всегда приятно делать/узнавать что-то новое, думаю, это у всех так.
Придя на работу в один из серых скучных дней, я решился и написал в поиске Google «как сделать мобильное приложение». Это было очень наивно. Кажется, я даже попробовал задать вопрос на Toster, «с чего начать разработку под мобильные приложения», тогда я еще не понимал насколько глупым воспринимается этот вопрос профессионалами.
Довольно быстро я разделил для себя разработку на две части, это был Android и iOS, потому что они совсем разные (поиск подсказал.
Как-то я наткнулся на Phonegap, насколько я понял, пишем на Javascript+html+css, а потом получаем готовое приложение для Android/iOS, но почему-то мне не хотелось пользоваться подобными решениями, во-первых: были непонятные отзывы, кто-то хвалил, кто-то ругал, а во-вторых: мне хотелось попробовать как это изнутри, каково это сделать «нативное» приложение.
План и подготовка
Собственно, идея довольно проста:
- Логин экран с логином/паролем
- Основной экран с информацией об абоненте (ФИО, № договора, баланс, статус (Активен, Отключен), есть ли авария на доме, кнопка Активировать обещанный платеж
- Экран с платежами (зачисления на счет)
- Экран со списаниями по счету
Для функционирования приложения я написал простейшее API на PHP, скрипт который по определенному запросу отвечал строкой в JSON-формате. Сделать это оказалось элементарно.
Начать решил с Android.
Android
Начал я с установки Android Studio, первоначально смутило количество кнопочек/иконок, но за пару дней я уже был как рыба в воде. Для начала надо было понять как вообще делаются приложения, очень помогает изначальное «Hello world!» которое создается по-умолчанию. Выглядело все достаточно просто и понятно. Погуглив «Как начать разработку в Android Studio», я понял, что надо скачать SDK. Открыв SDK-manager я не понял вообще ничего, ну, точнее, не понял что именно надо делать, поэтому поставил все галочки и ждал пока все скачается. Для чего оно мне нужно я совсем не понимал, общее представление конечно было «чтобы работала поддержка такой-то версии», но почему надо все отдельно качать и выбирать среди сотен галочек — бррр.
Вторым достаточно сложным этапом было запустить приложение на симуляторе. Погуглив, пришлось повозиться с AVD, конечно, потыкашись как слепой котенок я сделал несколько виртуальных устройств. На одном даже запустилось приложение. Честно сказать, симулятор у Android Studio совсем не User-friendly, очень долго я с ним воевал, пытался запускать по-разному, хотел чтобы кнопки управления были на экране и работали, но почему-то не работали. Видимо, сказывалось отсутствие опыта.
Как оказалось, для Android пишут на Java. Про Java я знал только то, что это язык программирования и это не Javascript.
Решил разбить большую задачу на более мелкие.
Теперь возникла ситуация когда у меня, в принципе, все готово, но я не знал как вообще делается приложение, поэтому, погуглив, я понял что никакой нормальной информации на русском языке мне не найти (либо я плохо искал). Информация либо устаревшая, либо не то что мне требуется. Спас меня youtube и знание английского языка. Сделав несколько запросов в ютюбе можно найти массу информации, да еще и с самим процессом — это очень помогло, если бы не обучающие видео, думаю, приложение я бы делал несколько месяцев.
Выбирая минимальную версию Android я остановился на 4 что-то там 🙂 (Охват аудитории 90%+ если верить Google).
Опять же разбив свои задачи на более мелкие я искал туториалы в youtube, например: «how to get json in android» или «menu in android studio». Конечно, пришлось пересмотреть штук 30 разных видео и все они были на английском (одно на немецком и одно на китайском — когда показывают не так сложно самому дойти что же говорят :)).
Разработка под Android заняла примерно неделю с момента установки Android Studio. После чего отобрав планшет у сына я смог протестировать свое приложение на реальном устройстве — просто подсоединив его к компьютеру.
Публикация в Google Play
Сначала я думал что будет очень сложно и даже переживал, но как оказалось всего 25$ и фактически без каких-либо серьезных проверок приложение попало в Google Play и через несколько часов было доступно в поиске, публикация заняла около одного дня.
Отдохнув пару дней и поразмыслив, решил что пора реализовать тоже самое приложение под iOS. Но, оказалось, что бесплатная среда разработки xCode может быть запущена исключительно в среде Mac. Пришлось скачать образ виртуальной машины MAC OS Yosemite и запустить ее через VMWare. Сделать это было очень просто и фактически не требовало от меня никаких телодвижений кроме как «ждать».
После чего я скачал xCode и начал разбираться, дело пошло быстрее, так как разработка под мобильные устройства что для Android, что для iOS примерно схожа в своих идеях.
Язык программирования выбрал Swift. Версию iOS минимум 7.1+
В принципе разработка под iOS была более простой, хотя баги симулятора присутствовали, но весь процесс оказался более удобным, нежели под Android. Опять же я открыл youtube и смотрел видео/читал руководства о том, как сделать какую-то вещь. Например, нагуглил прекрасный скрипт который делает slide menu, которого у меня не было в Android. В общем, еще один марафон и за неделю было готово улучшенное приложение, добавил возможность пополнить счет с помощью карты предоплаты и совместил платежи/списания в одно окно.
Использовал тоже самое API (тот же скрипт, что и для Android).
Публикация в iOS
Тут все оказалось не так радужно и просто как в Android. Во-первых, оказалось, что мне требуется реальное устройство для тестирования приложения, а без него никак не опубликоваться. Пришлось искать iPhone и привязать его к профилю тестирования.
Опять же, при создании аккаунта был выбор между «компания» и «индивидуальный разработчик», но начитавшись страшилок про 4+ месяца проверки компаний я решил регистрироваться как индивидуальный разработчик. Сделать это было не сложно, главное оплатить 99$ за аккаунт разработчика iOS со своей кредитной карты чтобы имя совпадало (подсказал поиск). Платеж проходил 2 дня.
После чего пришлось искать целое видео «how to publish in app store» и следовать инструкции, настолько там все непонятно. Какие-то сертификаты, туда — сюда. В общем, не очень удобно, хотя и сделать надо лишь один раз :).
Приложение ушло на проверку и ждало очереди около полутора недель. После чего было принято. Кстати, как показали логи, проверка была примерно такая: Логин -> Баланс -> Платежи -> Баланс. И все, хотя была еще страница «Пополнить баланс», но ее не проверяли (а зря, я там накосячил и пришлось выкладывать новую версию программы 1.1 которую тоже проверяли больше недели).
Выводы
1. Как оказалось это не сложно даже для человека который никогда не использовал Java/Swift/Mac OS.
2. Много новой информации заставляло мой мозг просто переполняться в первые дни и зависать. Помогал только сон, после него я более четко понимал что делать дальше. Не надо бояться таких этапов. Иногда мне казалось что «я вообще ничего не понимаю», были ощущения что я бьюсь головой в бетонную стену. Но на следующий день я решал проблему. Например, в Android, в самом начале у меня возникла ситуация «ничего не работает», когда я подключался к серверу и должен был получать информацию, оказалось, надо было это делать в асинхронном потоке. Потратил целый день.
3. Очень быстрое устаревание руководств/видео уроков. Платформы настолько быстро развиваются, что надо сразу проверять актуальность информации. На русском языке ее очень мало, после нескольких попыток я даже бросил искать и сразу начал штудировать stackoverflow и англоязычный интернет. Youtube со своими видео-уроками просто спас меня! Я открывал видео на одном мониторе и работал на втором. Без базового английского — никуда.
4. Сервисы вопрос-ответ реально помогают! Иногда, впадая в ступор я задавал вопросы и почти сразу получал ответы — очень удобно если находишься в тупике.
5. Apple более чутко относится к публикации приложений, но особых проблем кроме длительного времени я не заметил. Android же делают все очень быстро (зато пускают всех подряд, как я понял).
6. В общей сложности я потратил почти месяц (на разработку около двух недель с перерывами). Стоило ли оно того — думаю да, было очень интересно. Если у вас есть желание — попробуйте, все оказалось не так сложно. У меня нет смартфона Android/iPhone, но и без них все оказалось просто. Симуляторы работают достоверно.
Приложение называется dagotel, но оно создано для клиентов, поэтому дальше логина не пустит. Разве что посмотреть скриншоты.
Понятия не имею, зачем я написал эту статью и какие цели преследовал, но раз написал, решил опубликовать.
Источник