Координаты пользователя (Geolocation API)

Получить координаты пользователя можно через Geolocation API.

navigator.geolocation.getCurrentPosition(position => {
  position.coords; // координаты пользователя
});

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

Яндекс.Брауер. Geolocation API
Скриншот из Яндекс.Браузера

Через второй параметр можно передать коллбэк для обработки ошибки.

navigator.geolocation.getCurrentPosition(position => {
  position.coords; // координаты пользователя
}, error);

function error() {
  // код для обработки ошибки Geolocation API
}

Отслеживать изменении геолокации пользователя

Для изменения позиции пользователя (например, чтобы показать позицию на карте), используется метод geolocation.watchPosition().

navigator.geolocation.watchPosition(position => {
  position.coords; // текущая позиция пользователя
})

Код выше выполняется постоянно, этим самым обновляя позицию пользователя.

Чтобы остановить обновление данных позиции пользователя, используется метод geolocation.clearWatch().

const geoId = navigator.geolocation.watchPosition(position => {
  position.coords; // текущая позиция пользователя
})

// Останавливаем наблюдение
navigator.geolocation.clearWatch(geoId);

Проверить поддержку Geolocation API

Проверить, поддерживает ли браузер геолокацию, можно через код ниже:

if (!navigator.geolocation) {
  // код, если браузер не поддерживает Geolocation API
}

В каких ситуациях полезно использовать геолокацию

Геолокация полезна в следующих ситуациях:

  1. Показывать текущее положение на карте;
  2. Показывать ближайшие магазины;
  3. На маркетплейсах показывать ближайшие ПВЗ;
  4. На сайтах знакомств показывать людей поблизости;
  5. В социальных сетях показывать контент людей, которые находятся поблизости (или в текущем городе).