使用JS获取当前地理位置方法汇总
今年的项目开发中,初步接触了移动端WEB开发,也就边学习HTML5边开发,主要使用了JQueryMobile技术,发现这个不适合做互联网产品,大部分样式都需要重写,只用了部分功能。手机端WEB开发过程中第一次接触了定位功能,通过各大搜索引擎发现手机端定位都是通过浏览器的定位,而用在PC端浏览器第一次会弹出提示“是否开启定位功能”,Boss看到这个提示,却觉得对用户的体验效果不好,不好那我换一种方式实现不就好了,这又不是多大的事,而Boss的脸色就大变,就说:不应该有这样的体验。我们这样做不都是为了赶时间,能够尽快将新功能发布嘛。
1.手机WEB定位方法:
vargetLocation=function(successFunc,errorFunc){//successFunc获取定位成功回调函数,errorFunc获取定位失败回调 //首先设置默认城市 vardefCity={ id:'000001', name:'北京市', date:curDateTime()//获取当前时间方法 }; //默认城市 $.cookie('VPIAO_MOBILE_DEFAULTCITY',JSON.stringify(defCity),{expires:1,path:'/'}); if(navigator.geolocation){ navigator.geolocation.getCurrentPosition(function(position){ varlat=position.coords.latitude; varlon=position.coords.longitude; //varmap=newBMap.Map("container"); //创建Map实例 varpoint=newBMap.Point(lon,lat);//创建点坐标 vargc=newBMap.Geocoder(); gc.getLocation(point,function(rs){ varaddComp=rs.addressComponents; varcurCity={ id:'', name:addComp.province, date:curDateTime() }; //当前定位城市 $.cookie('VPIAO_MOBILE_CURRENTCITY',JSON.stringify(curCity),{expires:7,path:'/'}); //alert(addComp.province+","+addComp.city+","+addComp.district+","+addComp.street); if(successFunc!=undefined) successFunc(addComp); }); }, function(error){ switch(error.code){ case1: alert("位置服务被拒绝。"); break; case2: alert("暂时获取不到位置信息。"); break; case3: alert("获取位置信息超时。"); break; default: alert("未知错误。"); break; } varcurCity={ id:'000001', name:'北京市', date:curDateTime() }; //默认城市 $.cookie('VPIAO_MOBILE_DEFAULTCITY',JSON.stringify(curCity),{expires:1,path:'/'}); if(errorFunc!=undefined) errorFunc(error); },{timeout:5000,enableHighAccuracy:true}); }else{ alert("你的浏览器不支持获取地理位置信息。"); if(errorFunc!=undefined) errorFunc("你的浏览器不支持获取地理位置信息。"); } }; varshowPosition=function(position){ varlat=position.coords.latitude; varlon=position.coords.longitude; //varmap=newBMap.Map("container"); //创建Map实例 varpoint=newBMap.Point(lon,lat);//创建点坐标 vargc=newBMap.Geocoder(); gc.getLocation(point,function(rs){ varaddComp=rs.addressComponents; varcurCity={ id:'', name:addComp.province, date:curDateTime() }; //当前定位城市 $.cookie('VPIAO_MOBILE_CURRENTCITY',JSON.stringify(curCity),{expires:7,path:'/'}); //alert(addComp.province+","+addComp.city+","+addComp.district+","+addComp.street); }); }; varshowPositionError=function(error){ switch(error.code){ case1: alert("位置服务被拒绝。"); break; case2: alert("暂时获取不到位置信息。"); break; case3: alert("获取位置信息超时。"); break; default: alert("未知错误。"); break; } varcurCity={ id:'000001', name:'北京市', date:curDateTime() }; //默认城市 $.cookie('VPIAO_MOBILE_DEFAULTCITY',JSON.stringify(curCity),{expires:1,path:'/'}); };
前提要引入百度API:<scriptsrc="http://api.map.baidu.com/api?v=1.4"type="text/javascript"></script>
2.PC端通过IP实现方法:
采用腾讯提供的接口,这个目前已经不能使用了
<scripttype="text/javascript"src="http://fw.qq.com/ipaddress"></script> <scripttype="text/javascript"> document.write(IPData[0]); //显示IP地址 document.write(IPData[2]); //显示省 document.write(IPData[3]); //显示市 </script>
采用新浪接口:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js
多地域测试方法:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js&ip=127.0.0.1
<scripttype="text/javascript"> $.getScript('http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js',function(_result){ if(remote_ip_info.ret=='1'){ alert('国家:'+remote_ip_info.country+'<BR>省:'+remote_ip_info.province+'<BR>市:'+remote_ip_info.city+'<BR>区:'+remote_ip_info.district+'<BR>ISP:'+remote_ip_info.isp+'<BR>类型:'+remote_ip_info.type+'<BR>其他:'+remote_ip_info.desc); }else{ alert('没有找到匹配的IP地址信息!'); } }); </script>
网易有道IP地址接口(这个有待测试)
http://www.youdao.com/smartresult-xml/search.s?type=ip&q=IP地址
淘宝请求接口(GET)
<script> varip="124.127.108.133"; varurl="http://ip.taobao.com/service/getIpInfo.php?ip="+ip; $.getJSON(url,function(json){ varmyprovince2=json.data.area; varmycity2=json.data.region; alert("您所在的城市是:"+myprovince2+mycity2); }); </script>
太平洋IP地址库API接口
http://whois.pconline.com.cn/?ip=[ip地址字符串]
另外:还有google、搜狐等提供对应的接口,大家可以自己试一试。
搜狐IP地址查询接口(默认GBK):http://pv.sohu.com/cityjson
搜狐IP地址查询接口(可设置编码):http://pv.sohu.com/cityjson?ie=utf-8
搜狐另外的IP地址查询接口:http://txt.go.sohu.com/ip/soip
3.获取客户端IP方法
<script> varurl='http://chaxun.1616.net/s.php?type=ip&output=json&callback=?&_='+Math.random(); $.getJSON(url,function(data){ alert(data.Ip); }); </script>
今天就写到这吧,还有好多工作需要去完成,等有时间了可以试试其它接口。欢迎大家来拍砖,提供更好的方法。