Геолокация. Как получить географические координаты пользователя из его браузера, используя HTML5?

Всем привет! После длительного перерыва возобновляю публикацию интересных постов в свой блог. Сегодня я хочу затронуть тему геолокации — получение местоположение пользователя, то есть географических координат: ширину и долготу. Эти данные можно получить из браузера пользователя, используя Geolocation API (ссылка на спецификацию). Браузеру эти данные доступны из разных источников: IP адрес, GPS датчик устройства, WiFi и Bluetooth MAC адреса и через GSM вышки для мобильных устройств. Геолокационные данные — это приватные данные, поэтому они не доступны пока пользователь не даст разрешение на их использование. Вы можете увидеть пример работы этого API, для этого нажмите кнопку ниже.


Посмотрите исходный код этой страницы для того, чтобы увидеть как это все работает. При нажатии на кнопку идет проверка — поддерживает ли Ваш браузер функцию геолокации. Если да, то вызывается функция из API getCurrentPosition с двумя параметрами: первый — имя функции, которая будет вызвана при успешном получении данных, второй — имя функции, которая будет вызвана при ошибке (например, пользователь запретил доступ к данным и т.п.). При успешном исходе нам будут доступны географическая широта и долгота (например, «50.4501, 30.5234»). Где использовать эти данные? Вариантов масса: при построении маршрута проезда к Вашему офису; для показа, что находится рядом; для поиска ближайшего заведения; для определения города пользователя и даже адреса, используя обратное геокодирование в Google Maps API — все зависит от бизнес-логики вашего приложения или сайта.

Какие браузеры поддерживают геолокационное API

Это IE 9+, Firefox 3.5+, Chrome 5.0+, Safari 5.0+ and Opera 10.6+. Из мобильных девайсов — iPhone 3.0+ и Android 2.0+ (для мобильных устройств с GPS данные будут самые точные). То есть у большинства пользователей все будет отлично работать.

Запись опубликована в рубрике html5 с метками , . Добавьте в закладки постоянную ссылку.
  • ishamshur

    Интересная статья. Спасибо. Буду иметь в виду данную возможность получения гео-данных.

  • Сергей

    Что-то не правильно показало место нахождения =)

    • http://olefirenko.net Дмитрий

      А через какой девайс делали?

  • Вадим

    не работает в chrome на андроид, браузер поддерживает геолокацию. я нажимаю на кнопку что в статье, запрашивается разрешение, и дальше ничего не происходит. help)

  • Алексей

    На ios 8.4 ни safari, ни chrome не реагируют на нажатие кнопки. Safari для mac (x os 10.10.5) показал местонахождение правильно.

  • Николай

    Огромное спасибо! Были проблемы с девушкой помогли советом в сложной ситуации! Все удалось благополучно решить. Обратился по вот этому номеру телефона +79298322016 спасибо им еще раз! Всем советую.

  • Виталий Владимирович Петров

    ПОЗОР ! город Тольятти = это НЕ Зелёновка.