使用 freegeoip 获取 IP 列表

Question

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

我有多个 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;

Answer 1

首先，您确实希望您的 IP 是一个字符串数组，而不是单个字符串。因此，您应该更改 var ips = ... 的声明并从末尾删除 .join("\n") - 这会将您方便的 IP 字符串列表转换为单个字符串，其中 IP 由换行符分隔，这是您不想要的。

然后，当您有一个类似ips = ['8.8.8.8', '8.8.4.4', ... ]; 形式的 IP 地址数组时

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

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 代码中的一些错误。

首先，代码中的问题：

• 您从未从定义ips 的第4 行中删除.join("\n")，因此它仍然只是一个字符串而不是字符串数组。这意味着您的 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() 是异步的，因此（忽略其他问题）您编写的代码在更新 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);
    }
  });
}