使用navigator.geolocation来获取用户的地理位置信息

使用 navigator.geolocation 来获取用户的地理位置信息
W3C 中新添加了一个名为 Geolocation 的 API 规范，Geoloaction API 的作用就是通过浏 览器获取用户的地理位置。我们可以使用 navigator.geolocation 来简单的获取用户 的地理位置信息。本文中将简单介绍下 W3C 的 Geolocation。 Geolocation 在 javascript 的 navigator 对象中， 我们可以通过 navigator.geolocation 来使用它。 不支持 geolocation 的浏览器并不包含这一对象，那么可以通过下面的代码来做能力检测， 对不同的浏览器做不同的处理。
if (navigator.geolocation) { alert( ' 浏览器支持 geolocation ' ); }else{ alert( ' 浏览器不支持 geolocation ' ); }
在访问 geolocation 对象时，即调用 geolocation 下面的方法时，浏览器会弹出提示，询问 用户是否许可网站提供的位置服务，只有在得到用户许可过后，服务才会继续，否则将被停 止， 在稍后你将会了解到， 我们能够捕获到用户拒绝服务的动作。 下面这张图分别是 Chrome , Firefox 和 Opera 在初次访问 geolocation 时，给用户的提示：
初次使用 geolocation 时的警告框
常用的 navigator.geolocation 对象有以下三种方法：
1 2 3 获 取 当 前 地 理 位 置 ： navigator.geolocation.getCurrentPosition(success_callback_function, 持 续 获 取 地 理 位 置 ： navigator.geolocation.watchPosition(success_callback_function, 清除持续获取地理位置事件：navigator.geolocation.clearWatch(watch_position_id)
error_callback_function, position_options)
error_callback_function, position_options)
其中 success_callback_function 为成功之后处理的函数， error_callback_function 为失败之后返 回的处理函数，参数 position_options 是配置项，由 JSON 格式传入：
4 enableHighAccuracy：true/false，它将告诉浏览器是否启用高精度设备，所谓的高精度设备包含但 不局限于前面所提到的 GPS 和 WIFI， 值为 true 的时候， 浏览器会尝试启用这些设备， 默认指为 true， 在这种情况下，浏览器会尽可能地进行更为精确的查询，简单地说，如果用户有可用的 GPS 设备， 会返回 GPS 设备的查询结果，IP 是最后的选择，对于移动设备来说，网络接入点(基站)或许成为另

一个选择，对此我还没有完全了解，但根据测试，即时没有任何额外功能的手机，也能够得到更为精 确的查询结果。 5 6 maximumAge：单位毫秒，告诉设备缓存时间，主要用于设备的省电或者节省带宽方面。 timeout：单位毫秒，超时事件，获取位置信息时超出设定的这个时长，将会触发错误，捕获错误
的函数将被调用，并且错误码指向 TIMEOUT。
例如下面的代码：
var geo=navigator.geolocation.getCurrentPosition(geo_success, maximumAge:30000, timeout:27000}); geo_error, {enableHighAccuracy:true,
获取当前地理位置方法： 获取当前地理位置方法：navigator.geolocation.getCurrentPosition
当获得用户的许可过后，便一切就绪。我们将通过 geolocation 下的 getCurrentPosition 方 法来获取用户当前的地理位置信息。 1、正确返回地理位置信息的处理函数 、 例如我们的成功处理函数这样写：
function getPositionSuccess( position ){ var lat = https://www.360docs.net/doc/5015922066.html,titude; var lng = position.coords.longitude; document.write( "您所在的位置： 经度" + lat + "，纬度" + lng ); }
处理函数中的 position 对象包含了用户的地理位置信息，该对象下面的 coords 子对象包含 了 用 户 所 在 的 纬 度 和 经 度 信 息 ， 通 过 https://www.360docs.net/doc/5015922066.html,titude 可 以 访 问 纬 度 ， 而 position.coords.longitude 中存放了经度的信息，用户的位置信息越精确，这两个数字后面的 小数点越长。事实上，在 Firefox 中，position 对象下还附带有另一个 address 对象，这个 对象包含这个经纬度下的国家名，城市名甚至街道名，例如下面的代码：
function getPositionSuccess( position ){ var lat = https://www.360docs.net/doc/5015922066.html,titude; var lng = position.coords.longitude; alert( "您所在的位置： 经度" + lat + "，纬度" + lng ); if(typeof position.address !== "undefined"){ var country = position.address.country; var province = position.address.region; var city = position.address.city; alert(' 您位于 ' + country + province + '省' + city +'市'); } }

coords 其他返回信息：
7 8 9 coords.accuracy：返回经纬度的精度（米） coords.speed :速度 coords.altitude ：当前的高度，海拔（米）
10 coords.altitudeAccuracy：高度的精度（米） 11 coords.heading：朝向
2、返回错误时的处理函数 、 上面都是成功获取到用户位置信息的处理， 但是出现问题的情况在所难免， 当获取用户的位 置信息出错时，传递到 getCurrentPosition 的第二个函数类型参数被调用，一个包含具体出 错信息的对象会被传递进去，错误将被捕获。
function getPositionError(error){ switch(error.code){ case error.TIMEOUT : alert( " 连接超时，请重试 " ); break; case error.PERMISSION_DENIED : alert( " 您拒绝了使用位置共享服务，查询已取消 " ); break; case error.POSITION_UNAVAILABLE : alert( " 亲爱的火星网友，非常抱歉，我们暂时无法为您所在的星球提供位置服务 " ); break; } }
error 对象下面，存放了3个常量：
12 TIMEOUT:表示获取信息超时。 13 PERMISSION_DENIED：表示用户选择了拒绝了位置服务。 14 POSITION_UNAVAILABLE：表示位置不可知。
说明：而每一次出错时 error.code 将指向3个常量之中的一个。
移动设备持续获取地理位置方法： 移动设备持续获取地理位置方法：navigator.geolocation.watchPosition
对于使用移动设备的用户来说，位置并不是固定的， W3C 当然也考虑到了这一点， watchPosition 是一个专门用来处理这一情况的方法，watchPosition 被调用后，浏览器会跟 踪设备的位置，每一次位置的变化，watchPosition 中的代码都将会被执行。对于致力于移 动设备 web 开发的同学来说，这个方法是及其重要的，它也许将会改变 web 移动客户端 的格局。 使 用 navigator.geolocation.clearWatch 既 可 以 清 除
navigator.geolocation.watchPosition 的监控事件。
Geolocation 实例演示
查看 Geolocation 实例演示

写在最后
定位一般采用的 wifi 会比较准确，采用 IP 的时候一般会定位到所在的城市中心，更多关于 地图定位的文章：
15 php 获取来访者 IP 信息 16 php、js 两种不同方式根据关键词返回经纬度接口【基于 Google map API】 17 根据 IP 返回地理位置地址以及地理经纬度的方法 18 基于 Google 地图的根据 IP 返回地理位置的接口