javascript - 使用freegeoip获取IP列表

请给我一个简单的提示，在哪里挖！

我有多个IP，并且需要在每个IP旁边显示位置。

我有一个通过阵列的IPS列表

var table = document.createElement('table');
table.innerHTML = forext;
var ips = [].slice.call(table.querySelectorAll('a[href*="?ip="]')).map(anchor => anchor.textContent).join("\n");

8.8.8.8
8.8.4.4
...

我可以通过输入框获取每个位置

$('.send').on('click', function(){

  $.getJSON('https://ipapi.co/'+$('.ip').val()+'/json', function(data){
      $('.city').text(data.city);
      $('.country').text(data.country);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input class="ip" value="8.8.8.8">
<button class="send">Go</button>
<br><br>
<span class="city"></span>,
<span class="country"></span>

但是我需要打印IP及其旁边的位置：

所以，我有这个：

8.8.8.8
8.8.8.8

但是我需要这个

8.8.8.8 -Mountain View, US
8.8.8.8 -Mountain View, US
...

如何通过http://freegeoip.net/json/处理整个数组？谢谢。

更新1：尝试使用ips [i]

var ipText='Lookup...';
var table = document.createElement('table');
table.innerHTML = forext;
var ips = [].slice.call(table.querySelectorAll('a[href*="?ip="]')).map(anchor => anchor.textContent).join("\n");

var ipLocations = [];

for(i=0;i<ips.length;i++){

 $.getJSON('https:/freegeoip.net/json/' + ips[i], function(data) {
    // could also use data.country_name, or any other property in the returned JSON
    var outputString = data.ips[i] + ' - ' + data.city + ', ' + data.country_code;
    ipLocations.push(outputString);

  });

}

ipText = ipLocations.join('\n');
message.innerText = ipText;

最佳答案

首先，您确实希望IP是字符串数组，而不是单个字符串。这样，您应该更改var ips = ...的声明，并从最后删除.join("\n")-这会将您方便的IP字符串列表变成单个字符串，并且IP不需要换行符。

然后，当您拥有IP数组形式的ips = ['8.8.8.8', '8.8.4.4', ... ];

...然后您可以通过以下方式获得描述的输出：

var ipLocations = [];
for (var ip of ips) {
  $.getJSON('https://freegeoip.net/json/' + ip, function(data) {
    // could also use data.country_name, or any other property in the returned JSON
    var outputString = data.ip + ' - ' + data.city + ', ' + data.country_code;
    ipLocations.push(outputString);
  });
}

如您所描述的，您现在有了一个具有IP地址+位置的字符串数组。如果现在要将THAT变成单个字符串，则可以执行ipText = ipLocations.join('\n');以获得用换行符分隔的输出行。

但是，如果要将文本输出到HTML文档中，则可能需要加入<br>而不是\n，在许多上下文中，诸如\n之类的空白字符将被忽略，并且您将结束将所有输出都放在一行上。

更新：

我的原始答案中有一些非常愚蠢的错误，其中最主要的是我混合使用Python和JavaScript语法（facepalm）。修复它们后，此代码即可正常工作。话虽这么说，但有一些需要注意的警告，以及您应该真正理解的Update 1代码中的一些错误。

首先，您的代码中的问题：

在定义.join("\n")的第4行中，您从未摆脱过ips，因此它仍然只是一个字符串，而不是字符串数组。这意味着您的for循环实际上是遍历ips字符串中的每个单个字符，而不是完整的IP地址。
您尝试在循环内访问data.ips[i]。 data变量包含对AJAX请求的JSON响应，但是jQuery自动将其从JSON字符串转换为实际的JavaScript对象。它仅具有响应中包含的属性。在这种情况下，响应始终具有ip属性，因此您可以访问data.ip。但是，ips是您创建的变量-data.ips不存在，因此无法访问其索引。

附带说明一下，如果您使用for...of语法，则还可以使用一个名为ip的循环变量来代替。但是，您需要了解ip和data.ip不是相同的变量，即使在这种情况下它们始终具有相同的值。

URL以“ https：/”开头，而不是“ https：//”。这实际上是我的错，我在最初的答案中输入了错字> _>；

顺便说一句，您在注释中提出了非常重要的一点-函数$.getJSON()是异步的，因此（忽略其他问题）在Update 1中编写的代码可能无法达到预期的效果。即使您的AJAX请求尚未响应，调用getJSON之后的代码也将继续运行，因此，如果您立即访问ipLocs数组，则它可能仅包含一些输出字符串，甚至为空。。

我不会向您解释如何等待非阻塞代码，因为这是一个完全不同的问题。考虑到您对JavaScript的熟悉程度，我还担心这只会使事情更加混乱。但是，如果您只是想要一个快速的解决方案，即使它根本不是最佳实践，它也可以提供期望的结果，则可以使用ajax函数而不是getJSON。这使您可以明确地告诉jQuery同步发送AJAX请求，这意味着它将在继续运行代码之前等待响应。但是，您需要注意，同步请求可能会暂时锁定您的浏览器，从而阻止任何其他操作，直到请求完成为止。该版本如下所示：

var ipLocations = [];
for (var ip of ips) {
  $.ajax({
    url: 'https://freegeoip.net/json/' + ip,
    async: false,
    success: function(data) {
      var outputString = data.ip + ' - ' + data.city + ', ' + data.country_code;
      ipLocations.push(outputString);
    }
  });
}

关于javascript - 使用freegeoip获取IP列表，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/45495576/