JS об'єкт Navigator

Отримання базової інформації про браузер

Об'єкт Navigator в JavaScript є частиною API браузера, який надає інформацію про браузер та операційну систему. Через Navigator можна отримувати дані про версію браузера, платформу, на якій він працює, і іншу інформацію, що може бути корисною при адаптації веб-застосунків під конкретне середовище користувача.

Однією з основних завдань при роботі з об'єктом Navigator є визначення специфікацій користувацького середовища.

Версія браузера:

navigator.userAgent: Ця властивість повертає рядок, що ідентифікує браузер, так що веб-сайт може вирішити, як відображати контент або які функції використовувати.

console.log(navigator.userAgent);

Коли ви запустите цей код, ви побачите довгий рядок, який містить інформацію про ваш браузер, версію і платформу.

Платформа:

navigator.platform: Іноді може бути корисно знати, на якій платформі працює браузер (Windows, MacOS, Linux тощо).

console.log(navigator.platform);

Запустивши цей код, ви дізнаєтеся про операційну систему, яку використовує ваш комп'ютер.

Мовні налаштування:

navigator.language: Знаючи мовні налаштування користувача, ви можете автоматично відображати контент на відповідній мові або надавати рекомендації щодо мови.

console.log(navigator.language);

При запуску цього коду виведеться мовний код, наприклад "en-US" для американської англійської мови.

Робота з геолокацією

Об'єкт Navigator надає доступ до API геолокації, який дозволяє отримувати фізичне місцезнаходження пристрою.

Отримання поточного місцезнаходження:

navigator.geolocation.getCurrentPosition(): Цей метод надає поточне місцезнаходження користувача (якщо він дав згоду на його використання).

navigator.geolocation.getCurrentPosition(function(position) {
    console.log("Latitude:", position.coords.latitude);
    console.log("Longitude:", position.coords.longitude);
});

Коли ви запустите цей код, він запитає дозвіл на доступ до геолокації. Після отримання дозволу він виведе вашу широту та довготу.

Відстеження місцезнаходження:

navigator.geolocation.watchPosition(): Цей метод повертає ідентифікатор, який можна використовувати для відстеження змін місцезнаходження користувача в реальному часі.

let watchID = navigator.geolocation.watchPosition(function(position) {
    console.log("Latitude:", position.coords.latitude);
    console.log("Longitude:", position.coords.longitude);
});

// Для зупинки відстеження
// navigator.geolocation.clearWatch(watchID);

Після запуску цього коду ваше місцезнаходження буде відстежуватися та виводитися кожен раз, коли воно змінюється.

Нотатка:	Коли працюєте з геолокацією, завжди пам'ятайте про приватність користувача. Ніколи не зберігайте місцезнаходження користувача без його відома або згоди.
Нотатка:	Для деяких функцій, таких як геолокація, браузери можуть вимагати дозвіл користувача. Уважно працюйте з цими запитами, інформуючи користувача, чому саме вам потрібен доступ до цієї інформації.
Нотатка:	Деяка інформація, яку надає `Navigator`, може бути використана зловмисниками для цілеспрямованих атак на користувачів. Важливо обережно використовувати інформацію, отриману з `Navigator`, та не викладати її в публічний доступ без необхідності. Додаткова інформація про браузер може бути корисною для адаптації засобів, проте завжди слід ставитися обережно до інформації, яка відкривається третім сторонам, щоб забезпечити конфіденційність користувачів.
Порада:	Хоча об'єкт `Navigator` є стандартною частиною більшості сучасних браузерів, завжди варто перевіряти, чи підтримується конкретний метод або властивість, перш ніж його використовувати.

Синтаксис

let ua = navigator.userAgent;

Переглядачі

Переглядач
	1	1	1	3	12

Переглядач
	4.4	18	4	1

Переглядач
	1.8

Приклади

В цьому прикладі ми використовуємо властивість navigator.language для отримання мови, яку вибрав користувач у своєму браузері. Це може бути корисно для завантаження правильних мовних ресурсів на веб-сайті.

let userLang = navigator.language || navigator.userLanguage; 
console.log(`Мова користувача: ${userLang}`);

В коді перевіряється наявність geolocation в об'єкті navigator, і якщо ця можливість доступна, отримуємо поточну позицію користувача.

if ("geolocation" in navigator) {
  navigator.geolocation.getCurrentPosition(function(position) {
    console.log(`Широта: ${position.coords.latitude}, Довгота: ${position.coords.longitude}`);
  });
} else {
  console.log("Geolocation не підтримується цим браузером");
}

Сервісні робітники - це одна з ключових технологій, що дозволяють створювати прогресивні веб-застосунки (PWA). Щоб гарантувати, що сервісні робітники підтримуються браузером, можна використовувати об'єкт Navigator.

Тут ми перевіряємо, чи підтримує браузер сервісних робітників, і якщо так, реєструємо сервісний робітник з файлу service-worker.js.

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('/service-worker.js')
  .then(function(registration) {
    console.log('Сервісний робітник зареєстровано:', registration);
  })
  .catch(function(error) {
    console.log('Реєстрація сервісного робітника не вдалася:', error);
  });
} else {
  console.log('Сервісні робітники не підтримуються цим браузером.');
}

Методи

javaEnabled(): Перевіряє підтримку Java у браузері користувача.
taintEnabled(): Перевіряє, чи ввімкнено в браузері механізм "забруднення" даних.

Властивості

appVersion: Повертає версію браузера, який використовує користувач.
appName: Повертає назву браузера, який виконує код.
appCodeName: Відображає кодову назву браузера, в якому виконується код.
product: Повідомляє назву рушія браузера.
platform: Повертає рядок, який ідентифікує операційну систему користувача.
language: Повідомляє про переважну мову користувача, налаштовану в браузері.
cookieEnabled: Повідомляє, чи ввімкнено підтримку cookies в браузері користувача.
geolocation: Надає доступ до API геолокації для визначення місцезнаходження користувача.
userAgent: Повідомляє про рядок агента користувача, що ідентифікує браузер.
onLine: Визначає, чи має користувач підключення до інтернету.

JS довідник

JavaScript

Наповнення JS розділу