網頁JS獲取當前地理位置（省市區）
一、總結
一句話總結：ip查詢接口
?
二、網頁JS獲取當前地理位置（省市區）
眼看2014又要過去了，翻翻今年的文章好像沒有寫幾篇，忙真的或許已經不能成為借口了，在忙時間還是有的，就像海綿里的水擠擠總會有滴。真真的原因是沒有學習過什么新的技術，工作過程中遇到的問題也不是非常難并且自己認為是沒有什么可以記錄分享的，大部分都是溫習以前的技術，現在已經專門負責前端技術，發現這邊的水還是非常深，技術太多了，想學真的一時半會兒學不完。
今年的項目開發中，初步接觸了移動端WEB開發，也就邊學習HTML5邊開發，主要使用了JQuery Mobile技術，發現這個不適合做互聯網產品，大部分樣式都需要重寫，只用了部分功能。手機端WEB開發過程中第一次接觸了定位功能，通過各大搜索引擎發現手機端定位都是通過瀏覽器的定位，而用在PC端瀏覽器第一次會彈出提示“是否開啟定位功能”，Boss看到這個提示，卻覺得對用戶的體驗效果不好，不好那我換一種方式實現不就好了，這又不是多大的事，而Boss的臉色就大變，就說：不應該有這樣的體驗。我們這樣做不都是為了趕時間，能夠盡快將新功能發布嘛。
1.手機WEB定位方法：
var getLocation = function (successFunc, errorFunc) { //successFunc獲取定位成功回調函數，errorFunc獲取定位失敗回調//首先設置默認城市var defCity = {id: '000001',name: '北京市',date: curDateTime()//獲取當前時間方法};//默認城市$.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(defCity), { expires: 1, path: '/' });if (navigator.geolocation) {navigator.geolocation.getCurrentPosition(function (position) {var lat = position.coords.latitude;var lon = position.coords.longitude;//var map = new BMap.Map("container"); // 創建Map實例var point = new BMap.Point(lon, lat); // 創建點坐標var gc = new BMap.Geocoder();gc.getLocation(point, function (rs) {var addComp = rs.addressComponents;var curCity = {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) {case 1:alert("位置服務被拒絕。");break;case 2:alert("暫時獲取不到位置信息。");break;case 3:alert("獲取位置信息超時。");break;default:alert("未知錯誤。");break;}var curCity = {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("你的瀏覽器不支持獲取地理位置信息。");}
};
var showPosition = function (position) {var lat = position.coords.latitude;var lon = position.coords.longitude;//var map = new BMap.Map("container"); // 創建Map實例var point = new BMap.Point(lon, lat); // 創建點坐標var gc = new BMap.Geocoder();gc.getLocation(point, function (rs) {var addComp = rs.addressComponents;var curCity = {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);});
};
var showPositionError = function (error) {switch (error.code) {case 1:alert("位置服務被拒絕。");break;case 2:alert("暫時獲取不到位置信息。");break;case 3:alert("獲取位置信息超時。");break;default:alert("未知錯誤。");break;}var curCity = {id: '000001',name: '北京市',date: curDateTime()};//默認城市$.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(curCity), { expires: 1, path: '/' });
};
前提要引入百度API：<script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>
2.PC端通過IP實現方法：
采用騰訊提供的接口，這個目前已經不能使用了
<script type="text/javascript" src="http://fw.qq.com/ipaddress"></script>
<script type="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
<script type="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>
var ip = "124.127.108.133";var url = "http://ip.taobao.com/service/getIpInfo.php?ip=" + ip;$.getJSON(url, function (json) {var myprovince2 = json.data.area;var mycity2 = 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>
var url = 'http://chaxun.1616.net/s.php?type=ip&output=json&callback=?&_=' + Math.random();$.getJSON(url, function(data) {alert(data.Ip);});
</script>
今天就寫到這吧，還有好多工作需要去完成，等有時間了可以試試其它接口。歡迎大家來拍磚，提供更好的方法。
?
?
?
?
