Функция определения браузера и его версии. Определение браузера при помощи JavaScript Определение возможностей является лучшим вариантом

Определить версию и тип браузера проще всего при помощи JavaScript. JavaScript имеет стандартный объект под названием navigator , который содержит данные о браузере пользователя.

Объект navigator имеет много свойств, но в данном случае нас интересует свойство .UserAgent - это строка содержит данные о браузере, операционной системы, и многое другое.

Если вы хотите увидеть значение navigator.userAgent , то можете выполнить одно из следующих действий:

// Выводим информацию в окне предупреждений
alert (navigator.userAgent ) ;

Document.write

// Печатаем значение в HTML документе
document.write (navigator.userAgent ) ;

console.log()

// Выводим информацию в консоль браузера
console.log (navigator.userAgent ) ;

Если вы используете Internet Explorer 11 на Windows 7, на выходе будет:

Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; MASM; .NET4.0C; .NET4.0E; rv:11.0) like Gecko

Как вы можете видеть, проблема с navigator.userAgent в том, что это одна гигантская строка, и она не очень понятна для человека.

Так что, если вы хотите использовать эту информацию, или показать её пользователю, то нужно сначала распарсить строку.

Но если вы не дружите с регулярными выражениями, то вам всегда поможет библиотека Detect.js созданная Darcy Clarke.

Detect.js может разобрать значение строки в объект JavaScript для удобного восприятия человеком.

Чтобы отобразить имя браузера, версию браузера и операционной системы в нашей консоли, используя Detect.js, мы можем написать следующий код:

//Создаем объект "user", который будет содержать информацию Detect.js
//Вызываем detect.parse() с navigator.userAgent в качестве аргумента
var user = detect.parse (navigator.userAgent ) ;

// Выводим нужные значения в консоли браузера
console.log (
user.browser .family
user.browser .version
user.os .name
)

В Firefox вы увидите следующую строку

Firefox 30 Windows 7

Chrome 35 Windows 7

Для написания кода под определенный браузер, вы можете использовать условные операторы.

Например, если вы хотите, вывести сообщение для пользователей браузера Safari, вы можете сделать следующее:

if (user.browser .family === "Safari" ) {
alert ("You\" re using the Safari browser" ) ;
}

Ниже приведена таблица всех анализируемых свойств:

Свойство Описание
browser.family Имя браузера
browser.name Имя браузера и его версия
browser.version Полная версия браузер
browser.major Основной номер версии браузера
browser.minor Дополнительный номер версии браузера
browser.patch Номер патча браузера
device.family Имя устройства
device.name Имя устройства и версия
device.version Полная версия устройства
device.major Основной номер версии устройства
device.major Дополнительный номер версии устройства
device.patch Номер патча устройства
device.type Тип устройства (например, "Desktop" или "Mobile")
device.manufacturer Производитель устройства
os.family Название операционной системы
os.name Полне имя операционной системы
os.version Полная версия операционной системы
os.major Основной номер версии операционной системы
os.minor Дополнительный номер версии операционной системы
os.patch Номер патча операционной системы

Примечание: Если свойство не может быть распарсено, то его значение будет null или undefined. Если вы собираетесь показывать эту информацию для пользователей, то вы должны иметь условные операторы для null и undefined.

Почему вы не должны использовать определение типа браузера при помощи JavaScript

Определение типа браузера при помощи JavaScript не является надежным

JavaScript может быть отключен пользователем или userAgent может быть подменен.

Кроме того, есть множество браузеров и версий браузеров - и их будет еще больше в будущем - что делает определение браузера непрактичным и неудобным в сопровождении, потребует постоянного обновление кода.

Определение возможностей является лучшим вариантом

Определение возможностей браузера при помощи JavaScript значительно надежнее, вы проверяете поддерживает ли браузер пользователя определенные свойства или методы, например, такие как новый HTML5 API - WebRTC, или Canvas, или любой другой.

На примере WebRTC я продемонстрирую эту точку зрения. На сайте caniuse.com вы можете увидеть как реализована на текущий момент поддержка WebRTC в различных браузерах:

В приведенной выше таблице красным цветом отмечены версии не поддерживающие WebRTC, а зеленым - поддерживающие.

Если бы мы использовали определение типа и версии браузера, то чтобы определить может ли клиент использовать WebRTC потребовалось бы масса условных операторов. И каждый раз когда новая версия браузера выходит в релиз, мы должны были бы обновить наш код.

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

Как мы можем обнаружить доступна ли функция WebRTC в браузере?

Мы знаем, что WebRTC-совместимый браузер должен иметь функцию getUserMedia() , поэтому мы должны проверить, сможем ли мы ссылаться на неё.

Приведенный ниже код проверяет доступность WebRTC у клиента и выводит окно с предупреждением, если функция доступна. Это заимствовано и адаптировано из MDN :

// hasWebRTC is undefined
// if .getUserMedia() (and its variants) is not available
var hasWebRTC = navigator.getUserMedia ||
navigator.webkitGetUserMedia

Mozilla FireFox, чтобы уточнить версию этого программного продукта, надо раскрыть в меню раздел «Справка» и щелкнуть самый нижний пункт («О Mozilla Firefox»). Откроется отдельное вертикальное окошко, в котором указание точной версии из трех разделенных точкой чисел помещено под крупной надписью Firefox.

В меню Opera тоже надо открывать раздел «Справка» и щелкать в нем нижний пункт («О программе»). Но здесь, в отличие от всех остальных браузеров, отдельного окна при этом не выскакивает - открывается обычная , большую часть которой занимают списки разного рода хранилищ, созданных браузером в вашем . В самом начале этого списка есть и отдельная секция, которая так и названа - «Информация о версии». Номера версий Opera представляют собой два разделенных точкой числа.

В обозревателе Internet Explorer, открыв все тот же раздел меню с названием «Справка», и щелкнув последний в списке пункт «О программе», вы увидите окно с суровым напоминанием о соблюдении авторских прав. Кроме этого текста здесь есть и не менее серьезный код, обозначающий версию обозревателя. В нем точкой разделены целых четыре числа, одно из которых уже перевалило четырехзначный рубеж.

В Google Chrome, кроме не менее серьезного кода используемой версии (четыре разделенных точками числа), есть и указание самой последней из доступных для установки модификаций. Чтобы увидеть отдельное окно со всей этой информацией вам надо открыть меню щелчком по пиктограмме с гаечным ключом справа вверху в окне браузера , и выбрать пункт «О Google Chrome».

В браузере Apple Safari на всякий случай предусмотрено два пути открытия окошка с информацией о версии. Один из них аналогичен методике браузера Chrome - надо щелкнуть в том же месте размещенную пиктограмму (здесь на ней нарисована шестеренка) и выбрать пункт «О программе Safari». Другой очень схож с Mozilla и IE - надо раскрыть в меню раздел «Справка» и щелкнуть нижний пункт («О программе Safari»). Apple придумала самое длинное обозначение версии: кроме трех чисел, разделенных точкой, есть еще и дополнение из трех чисел в скобках.

Читайте, как посмотреть данные о пользователе, которые сайты могут получить из вашего браузера . Как минимизировать предоставляемую сети информацию. Как только вы откроете свой интернет-браузер, то сразу начнете оставлять за собой «цифровые следы» , по которым веб-сайты, посещённые вами, будут отслеживать все ваши действия онлайн. Это абсолютно законная практика. Разработчики веб-сайтов, досок объявлений, рекламы товаров и услуг контролируют любые действия пользователей, связанные с ними.

2018-03-29 Michael Miroshnichenko


  • Читайте, как сделать стандартные рисунки обоев в Windows 10 более качественными. Особенно это будет актуально для больших или 4К мониторов. Служба поддержки компании «Microsoft» предоставляет огромный выбор качественных картинок, который также дос...
  • Читайте, какие службы Windows можно отключить для лучшей работы системы и как это правильно сделать. Операционная система «Windows» поставляется с предустановленными наборами инструментов и приложений. Чтобы обеспечить их корректную работу, а такж...
  • Читайте, как и где посмотреть историю вашего браузера и каким способом её можно удалить. По умолчанию, любой браузер сохраняет историю посещённых с его помощью интернет страниц или сайтов. История сохраняется в хронологическом прядке, и хранится в...
  • Читайте об онлайн-приложениях и веб-сервисах, которые помогут вам конвертировать различные типы файлов, улучшить фотографии, соберут «GIF-ки», помогут выбирать правильную палитру цветов, сохранят и передадут необходимые файлы и документы между выбран...
  • Читайте, как использовать настройки конфиденциальности браузеров. Рассмотрим приложения или сервисы для повышения конфиденциальности в сети. С течением времени, такое важное понятие как конфиденциальность постепенно размывается в том аспекте, кото...

В этом уроке мы обсудим как узнать, какой браузер установлен на ПК. Вопрос может показаться банальным, но для некоторых пользователей эта тема действительно актуальна. Может быть такое, что человек недавно приобрёл компьютер и только начинает изучать его. Именно таким людям будет интересно и полезно прочитать эту статью. Итак, давайте начнём.

Браузер (обозреватель) – это программа с помощью, которой можно просматривать веб-страницы, можно сказать, смотреть Интернет. Веб-обозреватель даёт возможность смотреть видео, слушать музыку, читать различные книги, статьи и т.д.

На ПК может быть установлен, как один браузер, так и несколько. Рассмотрим, какой именно браузер установлен у Вас на компьютере. Есть несколько методов: посмотреть в обозревателе, открыть параметры системы или воспользоваться командной строкой.

Способ 1: в самом интернет-обозревателе

Если Вы уже открыли веб-браузер, но не знаете, как он называется, то можно это выяснить по крайней мере двумя путями.

Первый вариант:


Второй вариант:


Способ 2: используя параметры системы

Этот метод будет немного сложнее, но Вы справитесь.


Существует достаточно большое количество браузеров, а также их версий. И проблема в том, что одни браузеры позволяют выполнить определённый скрипт, а другие не позволяют. Встаёт вопрос: а как узнать браузер пользователя в JavaScript , чтобы через условие решить: надо выполнять скрипт или нет. И о том, как определить имя и версию браузера пользователя я и напишу в этой статье.

Для таких целей существует объект Navigator , а точнее два его свойства: appName и appVersion . Давайте для начала выведем название браузера пользователю:

Document.write("Вы используете браузер " + navigator.appName);

В результате Вы увидите имя браузера пользователя . Также огромное значение оказывает не только сам браузер, но и его версия. И для таких случаев используется свойство appVersion :

Document.write("Версия Вашего браузера " + navigator.appVersion);

Свойства appName и appVersion доступны только для чтения (это и логично), поэтому изменить их у Вас не получится. Теперь встаёт вопрос, а как использовать их в операторе IF :

Var browser = navigator.appName;
if (browser == "NetScape")
document.write("Тут можно выполнять скрипты для обладателей браузеров NetScape");

Надеюсь, что я ответил на Ваш вопрос: "Как узнать имя и версию браузера в JavaScript ".

 
Статьи по теме:
Установка Скайпа на компьютер (пошаговая инструкция) Установка приложения скайп
Если вам нужна четкая инструкция по установке самой популярной программы для онлайнового интернет-общения, эта информация для вас! Как произвести бесплатно установку на русском языке? Установить Скайп на компьютер бесплатно просто. Сделайте следующее. Пош
Как пользоваться селфи палкой с кнопкой
Монопод - изобретение не новое. Но вот использовать его для личных фотографий с фронтальной камеры телефона (селфи) придумали не так давно. И если вы хоть раз фотографировались на фронталку, то знаете, насколько легче и удобнее подобрать правильный ракурс
Самостоятельная прошивка телефонов, смартфонов и планшетов Xiaomi
Полная инструкция по прошивке (или FaQ как прошить) смартфона Xiaomi Redmi Note 3 Pro. Разблокировка телефона, прошивка официальной или кастомной прошивки, руссификация, Unlock загрузчика, установка TWRP recovery. Кодовое имя Redmi Note 3 Pro (Snapdragon
Самый простой способ установить мелодию на звонок андроид Почему на престижио не ставится рингтон
Это официальная инструкция для Prestigio Muze X5 LTE на русском языке, которая подходит под Android 7.0 Nougat. В случае, если Вы обновили свой смартфон Prestigio до более "свежей" версии или "откатились" до более ранней, то Вам стоит попробовать другие