Использование freegeoip для списка IP-адресов

1

Пожалуйста, дайте мне простой совет, где копать!

У меня есть несколько 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;
  • 0
    Вы пытались использовать $('.ip').val()+' - '+data.city или просто предположение, но data.ip если оно содержится в json .... Пример: $('.city').text(data.ip+" - "+data.city); data.ip $('.city').text(data.ip+" - "+data.city); Или это, или создайте другой диапазон и добавьте data.ip+" - " в это ...
  • 0
    Что вы подразумеваете под «печать IP-адресов»? Вы имеете в виду вставить их в HTML или войти в консоль браузера?
Показать ещё 6 комментариев
Теги:
geolocation
freegeoip

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+. Если теперь вы хотите превратить THAT в одну строку, вы можете сделать ipText = ipLocations.join('\n'); для получения выходных строк, разделенных символами новой строки.

Если вы собираетесь выводить этот текст в HTML - документ, хотя, вы можете присоединиться на <br> вместо \n, существует множество контекстов, в которых пробельные символы, такие как \n будут игнорироваться, и вы бы в конечном итоге с весь ваш выход на одной линии.

ОБНОВИТЬ:

В моем первоначальном ответе были некоторые очень глупые ошибки, главным из которых было то, что я смешивал синтаксис Python и JavaScript (facepalm). Зафиксировав их, этот код действительно работает. Это, как говорится, есть некоторые оговорки, которые необходимо упомянуть, а также некоторые ошибки в вашем обновлении 1 код, который вы действительно должны пытаться понять.

Во-первых, проблемы в вашем коде:

  • Вы никогда не избавились от .join("\n") из строки 4, где вы определяете ips, так что это все еще просто строка вместо массива строк. Это означает, что ваш цикл for-loop фактически перебирает каждый отдельный символ в строке ips вместо полных IP-адресов.
  • Вы пытаетесь получить доступ к data.ips[i] внутри цикла. Переменная data содержит ответ JSON на ваш запрос AJAX, но автоматически преобразуется из строки JSON в фактический объект JavaScript с помощью jQuery. Он содержит только те свойства, которые включены в ответ. В этом случае ответ всегда имеет свойство ip, поэтому вы можете получить доступ к data.ip Тем не менее, ips - это переменная, которая ВАЖЕ created-- data.ips не существует, поэтому вы не можете получить доступ к ее индексам.
    • В качестве побочного примечания, если вы использовали синтаксис for...of, у вас также была бы переменная цикла, называемая ip которую вы можете использовать вместо этого. Однако вам нужно понять, что ip и data.ip не являются одной и той же переменной, даже если они всегда будут иметь одинаковое значение в этом случае.
  • URL-адрес начинается с "https:/" вместо "https://". На самом деле это моя вина, я опечатал ее в своем первоначальном ответе> _>;

С учетом этого вы подняли очень важный момент в своем comment--, функция $.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);
    }
  });
}
  • 0
    Спасибо! Я близок, но здесь что-то не так: code var table = document.createElement ('table'); table.innerHTML = forext; var ips = [] .slice.call (table.querySelectorAll ('a [href * = "? ip ="]')). map (anchor => anchor.textContent) .join ("\ n"); ipText = ''; for (i = 0; i <ips.length; i ++) {$ .getJSON ('https: /freegeoip.net/json/' + ip, function (data) {// также может использовать data.country_name или любое другое свойство в возвращенном JSON outputString = data.ip + '-' + data.city + ',' + data.country_code; ipText + = outputString + '\ n';}); } code
  • 0
    Э ... ты скопировал код, но какая у тебя проблема?
Показать ещё 10 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню