CODEWITHSUNDEEP
jqueryjson
Arshpreet Wadehra
Arshpreet Wadehra

Reputation: 1023

Get ip address from JSON/jquery

I have following Code for Get IP address i want to store that data.ip with global scope that i can access anywhere in file.

 <script>
ip = null;
$.getJSON("http://jsonip.appspot.com?callback=?",
  function(data){
       ip = data.ip;
alert(ip); //return ip address correctly
  });
alert(ip); //undefined or null
</script>

Upvotes: 1

Views: 18152

Answers (6)

Gyan Chandra Srivastava
Gyan Chandra Srivastava

Reputation: 1380

This will set the IP Address to a hidden input field. 

<script>
ip = null;
$.getJSON("http://jsonip.appspot.com?callback=?", function(data) {
    ip = data.ip;
    $("#getip").val(ip)
    alert(ip); //return ip address correctly
});
alert(ip); //undefined or null
</script>

<input id="getip" type="hidden" />

Upvotes: 4

Kugutsumen
Kugutsumen

Reputation: 600

jsonip.appspot.com is already down!

use this endpoint instead

http://jsonip.com/

this would return

{"ip":"222.127.106.162","about":"/about"}

Upvotes: 5

saluce
saluce

Reputation: 13360

While it's not a recommended way of doing things, performing a synchronous Ajax call should solve the issue as you perceive it.

ip = null;
$.ajax({
    url: 'http://jsonip.appspot.com/',
    async: false,
    dataType: 'json',
    contentType: 'application/j-son;charset=UTF-8',
    success: function (data) {
        ip = data.ip
        alert(ip);
    }
});
alert(ip);

Again, I highly stress that this is NOT recommended, as performing synchronous Ajax (which stands for Asynchronous Javascript And Xml) is irregular and kinda defeats the purpose of Ajax. But, if you absolutely need your web app to wait for that data to be returned, doing it this way should work. I'd make a fiddle of it, but the URL doesn't allow requests from jsfiddle.

It would be better if you could code your app such that it isn't dependent upon the response to continue execution. For example, if you called a function after the successful return of the Ajax response, like this:

ip = null;
$.ajax({
    url: 'http://jsonip.appspot.com/',
    dataType: 'json',
    contentType: 'application/j-son;charset=UTF-8',
    success: function (data) {
        ip = data.ip
        alert(ip);
        gotAjaxResponse()
    }
});

function gotAjaxResponse() {
    alert(ip);
}

Note we are still using the global variable ip (which is another bad practice, but I'll save that speech for another day =), at least you are waiting for a response before continuing on to the code that depends on having that data.

Additionally, note that the second example still uses the generic $.ajax(), without the async: false, you can use the $.getJSON() method.

Upvotes: 1

Logard
Logard

Reputation: 1513

It does actually store the ip address in the variable outside your function (I assume that is your global scope since it is inside script tags).

The problem with your code is the timing. The place where the IP is stored in the ip variable is in this part of your code:

 function(data){
       ip = data.ip;
       alert(ip); 
  }

In your code this function is a callback function. That means that it will not be executed untill the call to $.getJSON() has completed and a response from the server has been recieved. Untill that happens, the rest of your code will continue executing.

What all this means is that when the alert() just outside your $.getJSON() call is executed, the server has not responed yet and because of this the callback function has not been executed. And therefore the ip variable has not been set.

So the solution is this: You have to write your code in such a way that you make sure that the server has time to respond before you try to use the data it responds with.

For more information, see Brandon Tillys answer in this link provided by Ivan Karajas in the comments.

Upvotes: 1

abhinav pratap
abhinav pratap

Reputation: 623

Yes agree with @Evan, Using a callback can solve this,

<script>
var ip = null;

function getIp(callback){$.getJSON("http://jsonip.appspot.com?callback=?",
  function(data){
       var tempip = data.ip;
alert(tempip); //return ip address correctly
callback(tempip);
  });}

function callback(tempip)
{
ip=tempip;
 alert(ip); //undefined or null
}

</script>

Upvotes: 0

Rroman
Rroman

Reputation: 666

Maby you should use "var" in Global scope? I thing you create two variables

Upvotes: 0

Related Questions