通过浏览器的地理位置（geolocation）API 获取用户坐标

陪她去流浪 桃子 2017年02月07日 编辑 阅读次数：3609

博客本身有说说这个功能，但只记录了发表时间。我觉得应该多留下一些信息，比如地理位置，就像 QQ空间 一样。

好在 HTML5 有 地理位置API（GeoLocation），非常方便，一句话就可以拿到当前用户的地理位置。 不像以前的通过 浏览器IP 方式获取用户地理位置那样单纯。GeoLocation 通过多种获取渠道来提高获取精度。

  • GPS
  • IP地址
  • 周围的 WIFI 热点
  • 蜂窝网络基站

于是，GeoLocation 通常来说提供了非常高的精度，甚至可以精度到 1~5 米。但是，地理位置属于隐私信息，只有在用户明确允许的情况下才能获取到。

简单举例介绍下用法吧，详细的文档见前面的文档就好了，没必要全部翻译过来。

先确定下浏览器是否支持 GeoLocation（'geolocation' in navigator）：

1
2
3
4

// 因为要在用户允许后才能拿到（并且获取需要一定的时长），所以参数是回调形式
navigator.geolocation.getCurrentPosition(function(position) {
    console.log(position.coords.latitude, position.coords.longitude);
});

没错，简单到没朋友，（浏览器应该会气泡提示是否允许获取地理位置）。

完整的参考文档及示例见前面的文档。

注意，这个 API 获取到的只是地图坐标（GPS坐标，wgs84 标准），要想获取具体街道（建筑物）等名字，还需要通过“逆地理位置解析”。下一篇文章将继续介绍通过国内的三家主要的地图厂商（腾讯地图、高德地图、百度地图）来获取上述具体信息。

标签：javascript · HTML

相关文章