我需要以某种方式检索客户端的IP地址使用JavaScript;没有服务器端代码,甚至没有SSI。

然而,我并不反对使用免费的第三方脚本/服务。


当前回答

Appspot.com回调服务不可用。ipinfo。IO似乎在工作。

我做了一个额外的步骤,检索所有的地理信息使用AngularJS。(感谢里卡多)来看看。

<div ng-controller="geoCtrl">
  <p ng-bind="ip"></p>
  <p ng-bind="hostname"></p>
  <p ng-bind="loc"></p>
  <p ng-bind="org"></p>
  <p ng-bind="city"></p>
  <p ng-bind="region"></p>
  <p ng-bind="country"></p>
  <p ng-bind="phone"></p>
</div>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.angularjs.org/1.2.12/angular.min.js"></script>
<script src="http://code.angularjs.org/1.2.12/angular-route.min.js"></script>
<script>
'use strict';
var geo = angular.module('geo', [])
.controller('geoCtrl', ['$scope', '$http', function($scope, $http) {
  $http.jsonp('http://ipinfo.io/?callback=JSON_CALLBACK')
    .success(function(data) {
    $scope.ip = data.ip;
    $scope.hostname = data.hostname;
    $scope.loc = data.loc; //Latitude and Longitude
    $scope.org = data.org; //organization
    $scope.city = data.city;
    $scope.region = data.region; //state
    $scope.country = data.country;
    $scope.phone = data.phone; //city area code
  });
}]);
</script>

工作页面在这里:http://www.orangecountyseomarketing.com/projects/_ip_angularjs.html

其他回答

好吧,我偏离了这个问题,但我今天有一个类似的需求,尽管我无法使用Javascript从客户端找到ID,但我做了以下工作。

服务器端:-

<div style="display:none;visibility:hidden" id="uip"><%= Request.UserHostAddress %></div>

使用Javascript

var ip = $get("uip").innerHTML;

我使用ASP。Net Ajax,但您可以使用getElementById而不是$get()。

发生的事情是,我在页面上有一个隐藏的div元素,用户的IP从服务器呈现。而在Javascript中,我只是加载这个值。

这可能对像你这样有类似需求的人(比如我,但我还没有弄清楚)有帮助。

干杯!

有一种更简单和免费的方法,不需要访问者的任何许可。

它包括向http://freegeoip.net/json提交一个非常简单的Ajax POST请求。一旦收到JSON格式的位置信息,您就可以通过更新页面或重定向到新页面来做出相应的反应。

以下是提交位置信息请求的方法:

jQuery.ajax( { 
  url: '//freegeoip.net/json/', 
  type: 'POST', 
  dataType: 'jsonp',
  success: function(location) {
     console.log(location)
  }
} );

我将提供一个方法,当我想在html页面中存储信息时,我经常使用这个方法,并且希望我的javascript能够读取信息,而不需要实际地将参数传递给javascript。当您的脚本被外部引用而不是内联引用时,这尤其有用。

然而,它不符合“没有服务器端脚本”的标准。但是如果你可以在你的html中包含服务器端脚本,可以这样做:

将隐藏标签元素设置在html页面的底部,就在结束主体标签的上方。

你的标签看起来是这样的:

<label id="ip" class="hiddenlabel"><?php echo $_SERVER['REMOTE_ADDR']; ?></label>

一定要创建一个名为hiddenlabel的类,并设置visibility:hidden,这样就没有人真正看到这个标签。你可以用这种方式在隐藏标签中存储很多东西。

现在,在你的javascript中,检索存储在标签中的信息(在这种情况下是客户端的ip地址),你可以这样做:

var ip = document.getElementById("ip").innerHTML;

现在你的变量“ip”等于ip地址。现在可以将ip传递给API请求了。

*编辑2年后* 两个小的改进:

我经常使用这种方法,但是调用标签class="data",因为实际上,这是一种存储数据的方法。类名“hiddenlabel”是一个愚蠢的名字。

第二个修改是在样式表中,而不是visibility:hidden:

.data{
    display:none;
}

...是更好的方法。

用Java脚本查找IP

为了获得IP地址,我正在对免费Web服务进行JSON调用。就像

[jsonip.com/json, ipinfo。Io /json, www.telize.com/geoip, ip-api.com/json, api.hostip.info/get_json.php]

并且我正在传递回调函数的名称,它将在请求完成时被调用。

<script type="text/javascript">
    window.onload = function () {
    var webService = "http://www.telize.com/geoip";
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = webService+"?callback=MyIP";
        document.getElementsByTagName("head")[0].appendChild(script);
    };
    function MyIP(response) {
        document.getElementById("ipaddress").innerHTML = "Your IP Address is " + response.ip;
    }
</script>
<body>
    <form>
        <span id = "ipaddress"></span>
    </form>
</body>

对于XML响应代码

WebRTC不需要服务器支持。

您可以通过服务器端与JSONP进行中继

而谷歌找到一个,发现它在这里所以我可以执行一个DNS查找(主机名到IP地址)使用客户端Javascript?

<script type="application/javascript">
    function getip(json){
      alert(json.ip); // alerts the ip address
    }
</script>

<script type="application/javascript" src="http://www.telize.com/jsonip?callback=getip"></script>

注意:telize.com API已于2015年11月15日永久关闭。