網頁JS獲取當前地理位置（省市區）

http://www.cnblogs.com/ZHF/p/4169634.html

眼看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>

今天就寫到這吧，還有好多工做須要去完成，等有時間了能夠試試其它接口。歡迎你們來拍磚，提供更好的方法。