Javascript: Как определить, использует ли пользователь UC Browser/Mini?
Я создаю веб-сайт, который неправильно отображается в UC Browser/Mini. Я планирую переопределить стиль с помощью JavaScript. Заранее спасибо.
3 ответа
Используйте navigator.userAgent, чтобы узнать, используется ли Opera Mini или UC Browser.
В следующем примере показано, как определить, используется ли UCBrowser.
if (navigator.userAgent.indexOf(' UCBrowser/') >= 0) {
// do stuff here
}
Navigator.userAgent вернет список вещей в строке. Как и в приведенном выше примере, navigation.userAgent вернет строку, в которой "UCBrowser" включен, поскольку javascript используется в UC Browser. Таким образом, приведенный выше фрагмент, следовательно, индексирует такую строку и определяет условие, если индексированная строка будет найдена в выводе userAgent.
Я не уверен, будет ли это работать, так как у меня возникли проблемы при попытке проверить мои локальные файлы в Opera Mini, но, основываясь на моих исследованиях, приведенный ниже код может работать.
if (navigator.userAgent.indexOf('Opera Mini') >= 0) {
// do stuff here
}
Решение
Чтобы обнаружить UC Mini в JavaScript:
if (navigator.userAgent.match(/^Mozilla\/5\.0 .+ Gecko\/$/)) {
// ...
}
Фон
Официальная документация для разработчиков (1), предоставляемая UC, документирует различные строки User-Agent, используемые в их браузерах. Два основных шаблона - это два для UC Browser и UC Mini.
# UC Browser
"Mozilla/5.0 (..) .. UCBrowser/10.7.9.856 U2/1.0.0 .."
# UC Mini with Speed Mode on (enabled by default)
"UCWEB/2.0 (..) .. UCBrowser/10.7.9.856 U2/1.0.0 Mobile"
Здесь следует отметить, что UC Browser и UC Mini - это разные приложения. Браузер UC существует для iPhone/iOS и Android и имеет различные варианты сохранения данных (включая опцию "Speedmode"), но не связан с быстрым режимом UC Mini и не изменяет пользовательский агент.
UC Mini доступен только для Android. В быстром режиме UC Mini является прокси-браузером, то есть его запросы передаются через удаленный сервер. Этот прокси-сервер добавляет поле "UCWEB" в пользовательский агент. Подобно Opera Mini, UC Mini Speed Mode отображает контент (включая JavaScript) на удаленном сервере. Интересно, что DOM в этом удаленном веб-браузере сообщает о другом агенте пользователя, чем его сетевой уровень. navigator.userAgent в быстром режиме UC Mini постоянно выдает следующую странную фиксированную строку без каких-либо следов "UCWEB", "UCBrowser" или собственного пользовательского агента клиента:
Mozilla/5.0 (X11; U; Linux i686; zh-CN; r:1.2.3.4) Gecko/
Эта точная строка используется для всех клиентов, использующих UC Mini для Android в скоростном режиме. Обратите внимание на косую черту, "Linux" и "zh-CN". Я предлагаю использовать регулярные выражения, как показано ниже:
/^Gecko\/$/
Или чуть более консервативно:
/^Mozilla\/5\.0 .+ Gecko\/$/
Это ночной кошмар в браузере, но это все, что у нас есть. Чтобы проверить, я проверил его по производственному трафику Википедии за неделю (без выборки, ~100B запросов) с нулевым совпадением. Конечно, UC Mini тоже не подходит, поскольку использует только эту строку в DOM. Теоретически, другие браузеры также могут иметь DOM с разными строками пользовательского агента, но, по крайней мере, мы знаем, что он не соответствует ни одному из используемых в настоящее время.
navigator.userAgent это то, что вы ищете, хотя это устарело.
Но в идеале вы не хотите полагаться на пользовательский агент. (См.: https://developer.mozilla.org/en-US/docs/Browser_detection_using_the_user_agent). Если ошибка рендеринга существует в UC Browser/Mini, она может существовать и в других браузерах. Лучше найти способ исправить ошибку, чем пытаться найти и настроить таргетинг на каждый браузер, в котором она возникает.