获取用户IP并将其作为变量存储在地理位置API中。

Question

我正试图让moocher.io地理定位(https://market.mashape.com/moocher-io/ip-geolocation)在我的网络应用程序上工作。这个API需要一个ip输入才能返回位置等等。我只是试图发送一个get请求来获取用户ip，因为我需要它自动找到他们的位置，而不必输入用户IP。

$.get("http://ipinfo.io", function(response) {
alert(response.ip);
}, "jsonp");

它将返回一个ip并提醒我IP是什么。我需要做的是把这个ip作为变量插入到我的地理定位函数中。这是现在的全部功能，

$(document).ready(function () {
        var url = 'https://moocher-io-ip-geolocation-v1.p.mashape.com/' + ip;
        var ip = $.get("http://ipinfo.io", function(response) {
        alert(response.ip);
        }, "jsonp");

        $.ajax({
            url: url
            , type: 'GET'
            , dataType: 'json'
            , success: function (data) {
                console.log('SUCCESS');
                console.log(data);
                console.log(data.country);
                console.log(data.city);
                console.log(data.state);

            }
            , error: function (data) {
                console.log('ERROR');
                console.log(data);
            }
            , beforeSend: setHeaders
        });
    });
 function setHeaders(xhr) {
            xhr.setRequestHeader('X-Mashape-Key', 
 'OURjCxSqLNmshIvDitfBhE88vFV8p1WrqCRjsnr8HkCb33A83c');
            xhr.setRequestHeader('Accept', 'application/json');
        }'

Answer 1

现在，在收到第一个请求返回的ip地址之前，正在发出第二个异步请求。只有在收到来自moocher.io的响应后，您才需要等待向ipinfo.io发出请求。

幸运的是，这是一个快速的解决办法。您可以将第二个异步请求包装在一个函数中，并在第一个异步请求的回调中调用该函数：

$.get("https://ipinfo.io", function(response) {
   alert("Initial IP address request: " + response.ip);
   mooch(response.ip);
}, "jsonp");

function mooch(ip) {
    var url = 'https://moocher-io-ip-geolocation-v1.p.mashape.com/' + ip;

  $.ajax({
    url: url
    , type: 'GET'
    , dataType: 'json'
    , success: function (data) {
      console.log('SUCCESS');
      console.log(data);
      console.log(data.ip.country);
      console.log(data.ip.city);
      console.log(data.ip.region);
    }
    , error: function (data) {
      console.log('ERROR');
      console.log(data);
    }
    , beforeSend: setHeaders
  });
}

function setHeaders(xhr) {
  xhr.setRequestHeader('X-Mashape-Key', 
                       'OURjCxSqLNmshIvDitfBhE88vFV8p1WrqCRjsnr8HkCb33A83c');
  xhr.setRequestHeader('Accept', 'application/json');
}

请注意，从moocher.io返回的结果数据似乎与您的第一个草稿略有不同(它嵌套在'ip‘键下，'state’列为'region‘。

https://jsfiddle.net/gco65kqy/2

祝好运!