1

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

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

1 回答 1

0

首先,您真的希望您的 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 地址 + 位置的字符串数组,如您所描述的。如果你现在想把它变成一个字符串,你可以ipText = ipLocations.join('\n');用换行符分隔输出行。

但是,如果您要将此文本输出到 HTML 文档中,您可能希望加入 on<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 中编写的代码可能不会达到您的预期。getJSON即使您的 AJAX 请求还没有响应,调用后的代码也会继续运行,因此如果您立即访问该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);
    }
  });
}
于 2017-08-03T23:10:33.150 回答