Using JS to obtain the current geographical location method summary_javascript skills

During this year’s project development, I initially came into contact with mobile WEB development. I developed it while learning HTML5, mainly using JQuery Mobile technology. I found that this is not suitable for Internet products. Most styles need to be rewritten. Just use some functions. I came into contact with the positioning function for the first time during the mobile WEB development process. Through major search engines, I found that the positioning on the mobile phone is through the browser. When using the browser on the PC for the first time, a prompt will pop up saying "Do you want to enable the positioning function?" When the Boss saw this prompt, he felt that it was not good for the user experience. If it is not good, then I can implement it in another way. This is not a big deal. The Boss's expression changed drastically and he said: No. You should have this experience. Aren’t we doing this all to rush for time so that we can release new features as soon as possible?

1. Mobile phone WEB positioning method:

Copy code The code is as follows:

var getLocation = function (successFunc, errorFunc) { //successFunc gets the positioning success callback function, errorFunc gets the positioning failure callback
//First set the default city
var defCity = {
         id: '000001',
         name: 'Beijing City',
Date: curDateTime()//Getting the current time method
};
//Default city
$.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"); //Create Map instance
               var point = new BMap.Point(lon, lat); // Create point coordinates
            var gc = new BMap.Geocoder();
gc.getLocation(point, function (rs) {
              var addComp = rs.addressComponents;
              var curCity = {
                   id: '',
Name: addComp.province,
date: curDateTime()
                };
//Current location city
                    $.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("Location service denied.");
break;
                case 2:
alert("The location information cannot be obtained temporarily.");
break;
                case 3:
alert("Timed out to obtain location information.");
break;
                                                                                                                                                                                                                                                                              default:
alert("Unknown error.");
break;
            }
          var curCity = {
                  id: '000001',
                  name: 'Beijing',
date: curDateTime()
            };
//Default city
                $.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(curCity), { expires: 1, path: '/' });
                 if (errorFunc != undefined)
               errorFunc(error);
            }, { timeout: 5000, enableHighAccuracy: true });
} else {
alert("Your browser does not support obtaining geographical location information.");
If (errorFunc != undefined)
​​​​​​ errorFunc("Your browser does not support obtaining geographic location information.");
}
};
var showPosition = function (position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
//var map = new BMap.Map("container"); // Create Map instance
var point = new BMap.Point(lon, lat); // Create point coordinates
var gc = new BMap.Geocoder();
gc.getLocation(point, function (rs) {
        var addComp = rs.addressComponents;
      var curCity = {
             id: '',
               name: addComp.province,
date: curDateTime()
        };
//Current location city
            $.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("Location service denied.");
             break;
case 2:
alert("The location information cannot be obtained temporarily.");
             break;
case 3:
alert("Timed out to obtain location information.");
             break;
           default:
alert("Unknown error.");
             break;
}
var curCity = {
         id: '000001',
         name: 'Beijing City',
Date: curDateTime()
};
//Default city
$.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(curCity), { expires: 1, path: '/' });
};

The prerequisite is to introduce Baidu API:

Using Sina interface: http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js

Multi-region testing method: http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js&ip=127.0.0.1

Copy code The code is as follows:

NetEase Youdao IP address interface (this needs to be tested)

　http://www.youdao.com/smartresult-xml/search.s?type=ip&q=IPAddress

Taobao request interface (GET)

Copy code The code is as follows:

<script><br> var ip = "124.127.108.133";<br>               var url = "<a href="http://ip.taobao.com/service/getIpInfo.php?ip">http://ip.taobao.com/service/getIpInfo.php?ip</a>=" ip;<br> $.getJSON(url, function (json) {<br>               var myprovince2 = json.data.area;<br>               var mycity2 = json.data.region;<br> alert("Your city is:" myprovince2 mycity2);<br>             });<br> </script>

Pacific IP address database API interface

　http://whois.pconline.com.cn/?ip=[ipaddress string]

In addition: There are also corresponding interfaces provided by Google, Sohu, etc. You can try it yourself.

Sohu IP address query interface (default GBK): http://pv.sohu.com/cityjson

Sohu IP address query interface (encoding can be set): http://pv.sohu.com/cityjson?ie=utf-8

Sohu’s other IP address query interface: http://txt.go.sohu.com/ip/soip

　3. Obtain client IP method

Copy code The code is as follows:

<script><br> var url = 'http://chaxun.1616.net/s.php?type=ip&output=json&callback=?&_=' Math.random();<br>                 $.getJSON(url, function(data) {<br> alert(data.Ip);<br>             });<br> </script>

　

That’s all for today. There is still a lot of work to be done. You can try other interfaces when you have time. Everyone is welcome to come and provide better methods.