获取用户IP并将其存储为变量以在Geolocation API中使用

时间:2017-04-21 23:51:38

标签: javascript jquery html api

我想让moocher.io地理定位({{3}})在我的网络应用上工作。此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');
        }'

1 个答案:

答案 0 :(得分:0)

现在,在您从第一个请求收到IP地址之前,正在进行第二个异步请求。只有在您收到var PaginatedDropdown = Marionette.CompositeView.extend({ template: template, childViewOptions: { tagName: 'li' }, "events": function() { 'click': 'onClick', 'keyup': 'onKeyUp' }, "onClick": function() { return 'hello'; }, "onKeyUp": function() { return 'hello'; }, }); var MotorcycleColorChooserDropdown = PaginatedDropdown.extend({ "events" : function() { //Question: //Basically extending the first events by using the marionette event function and extending it. var parentEvents = PaginatedDropdown.prototype.events, events = _.extend({}, parentEvents); events['mouseenter'] = this.onMouseEnter; //add all of the events of the child return events; } "onMouseEnter": function() { return 'vroom'; }, "onClick": function() { //Question 2: //Applying the parent's method PaginatedDropdown.prototype.onClick.apply(this, arguments); //and adding new code here } }); 的回复后,您才会等到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'); } 返回的结果数据似乎与您的初稿略有不同(它嵌套在'密钥和'州' ;被列为' region'。

https://jsfiddle.net/gco65kqy/2

祝你好运!