如何使用jQuery获取客户端IP地址

49

我想知道如何使用jQuery获取客户端IP地址?

有可能吗?我知道纯JavaScript不能,但从Stack Overflow得到了一些使用JSONP的代码。

那么,是否有使用jQuery的解决方法?

4个回答

65
jQuery可以处理JSONP,只需将格式为callback=?的url传递给$.getJSON方法即可,例如: ```js $.getJSON("https://example.com/data?callback=?", function(data) { console.log(data); }); ```

$.getJSON("https://api.ipify.org/?format=json", function(e) {
    console.log(e.ip);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

这个例子展示了一个非常简单的JSONP服务,使用api.ipify.org实现。

如果您不需要跨域解决方案,则可以进一步简化脚本,因为您不需要回调参数,并且可以返回纯JSON。


1
jsonip.appspot.com 显然支持 CORSJSONP - hippietrail
1
服务器现在已经宕机了,这是个好主意,但我认为它不太可靠。 - Mehdi Karamosly
4
这个服务器现在已经宕机了。所以我们可以从jsonip.appspot.com简单地移除appspot。这样它看起来就像是http://jsonip.com?callback=? 就这样 :) - ɹɐqʞɐ zoɹǝɟ
@CMS 你应该回答你提供的API的请求限制。 - Internial

28

进行一个简单的AJAX调用到你的服务器,然后在服务器端获得IP地址的逻辑就可以解决问题了。

$.getJSON('getip.php', function(data){
  alert('Your ip is: ' +  data.ip);
});

然后在 PHP 中你可以这样做:

<?php
/* getip.php */
header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header('Content-type: application/json');

if (!empty($_SERVER['HTTP_CLIENT_IP']))
{
  $ip=$_SERVER['HTTP_CLIENT_IP'];
}
elseif (!empty($_SERVER['HTTP_X_FORWARDED_FOR']))
{
  $ip=$_SERVER['HTTP_X_FORWARDED_FOR'];
}
else
{
  $ip=$_SERVER['REMOTE_ADDR'];
}
print json_encode(array('ip' => $ip));

4
function GetUserIP(){
  var ret_ip;
  $.ajaxSetup({async: false});
  $.get('http://jsonip.com/', function(r){ 
    ret_ip = r.ip; 
  });
  return ret_ip;
}

如果您想使用IP并将其分配给一个变量,请尝试这样做。只需调用GetUserIP()即可。

1

<html lang="en">
<head>
    <title>Jquery - get ip address</title>
    <script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script>
</head>
<body>


<h1>Your Ip Address : <span class="ip"></span></h1>


<script type="text/javascript">
    $.getJSON("http://jsonip.com?callback=?", function (data) {
        $(".ip").text(data.ip);
    });
</script>


</body>
</html>

1
请您能否提供一些背景信息来解释您的答案。例如,它为什么有效?有没有任何缺点?谢谢! - Pedro Rodrigues

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接