js获取客户端ip/地理位置的方法

最新推荐文章于 2025-05-28 09:54:21 发布

raisew

最新推荐文章于 2025-05-28 09:54:21 发布

阅读量4.4k

点赞数

分类专栏： js/jq插件库文章标签： h5 js 定位

js/jq插件库专栏收录该内容

3 篇文章

订阅专栏

本文介绍了通过script标签引入URL和使用AJAX调用来获取IP地址的两种方法。前者利用Sohu和Freegeoip提供的服务，后者则通过AJAX请求Freegeoip的API来实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

获取ip有两种方式，下面分别对每种方法进行研究。

1. 通过script标签引入url

比如如下代码：

<script type="text/javascript" src="http://pv.sohu.com/cityjson?ie=utf-8"></script>  
<script type="text/javascript">  
    alert(returnCitySN.cip)  
</script>

访问该链接，我们可以看到网页返回的是一段语句：

var returnCitySN = {"cip": "192.168.1.1", "cid": "CN", "cname": "CHINA"};

所以第一段js代码就相当于

<script type="text/javascript">
    var returnCitySN = {"cip": "192.168.1.1", "cid": "CN", "cname": "CHINA"};
</script>

所以我们在后面就可以访问这个json变量并读取它的数据了。

有的网站服务提供回调函数的，比如http://freegeoip.net。
这个网站支持json，xml，csv，jsonp格式。我们可以将上面的url换成http://freegeoip.net/json/?callback=foo

<scripttype="text/javascript" src="http://freegeoip.net/json/?callback=foo"></script>  
<scripttype="text/javascript">  
    function foo(json){
      alert(json.ip); // alerts the ip address
    }  
</script>

这个网址和上面的不同，返回的是jsonp，所以我们可以直接使用函数foo，这个名字可以自定义。上面的代码相当于

<scripttype="text/javascript">
foo({"ip":"192.168.1.1"});
</script>  
<scripttype="text/javascript">  
    function foo(json){
      alert(json.ip); // alerts the ip address
    }  
</script>

如果把callback函数去掉，譬如http://freegeoip.net/json/，返回的就只有json数据了，但是这个json数据因为没有变量名，不好调用，我们就要用其他的方法来调用这个json数据了。

2. ajax调用

如果该url返回的是json格式的数据，要想调用，就需要用到ajax。

<script >
    $.getJSON('//freegeoip.net/json/', function(data) {
        console.log(JSON.stringify(data, null, 2));
    });
</script>

以上的代码其实是简写的ajax，写成ajax：

$.ajax({
    url: 'http://freegeoip.net/json/',
    success: function(data){
       console.log(JSON.stringify(data));
    },
    type: 'GET',
    dataType: 'JSON'
});