Get ip address from JSON/jquery

Question

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>

It *is* working, but the JSON call hasn't finished by the time you see the null value. Run the above code and when you've seen both alerts, go to the console and type `alert(ip)` — Reinstate Monica Cellio, Aug 10 '12 at 10:49
@Logard - sorry I assumed you'd read it and that a statement of intent was good enough to understand. He's saying what he wants to do. The question is therefore 100% clearly "how". — Reinstate Monica Cellio, Aug 10 '12 at 10:50
Read and understood. He has stated a intent to store the users IP in a global scope. He has also done this with his code, the IP is stored in the variable ip when jQuery executes the callback. So, why ask "how" to do something you have already done? Hence my question. — Logard, Aug 10 '12 at 10:55
i want that ip i store in json function that work outside the function also! — Arshpreet Wadehra, Aug 10 '12 at 11:08
Read Brandon Tilley's response to this question (http://stackoverflow.com/questions/11233633/understanding-asynchronous-code-in-laymans-terms). It explains why the thing you're trying to do isn't working the way you want it to. — Ivan Karajas, Aug 10 '12 at 11:16

score 5 · Answer 1 · answered Feb 04 '13 at 06:16

5

jsonip.appspot.com is already down!

use this endpoint instead

http://jsonip.com/

this would return

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

answered Feb 04 '13 at 06:16

Kugutsumen

600
1
6
19

score 4 · Accepted Answer · edited Jun 12 '19 at 11:37

4

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" />

edited Jun 12 '19 at 11:37

Binar Web

867
1
11
26

answered Aug 10 '12 at 11:16

Gyan Chandra Srivastava

1,370
9
29

score 1 · Answer 3 · edited May 23 '17 at 10:34

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.

saluce · Answer 4 · 2012-08-10T12:56:55.257

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.

score 0 · Answer 5 · answered Aug 10 '12 at 10:57

0

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

answered Aug 10 '12 at 10:57

Rroman

666
1
7
11

It won't work i want that ip i store in json function that work outside the function also! – Arshpreet Wadehra Aug 10 '12 at 11:08

score 0 · Answer 6 · answered Aug 10 '12 at 12:03

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>

Get ip address from JSON/jquery

6 Answers6