Cross Domain jQuery .AJAX problems

I'm trying to 开发者_StackOverflow社区use jQuery's .AJAX function to send a request to IPINFODB's API to get the geolocation of the user(s) visiting our site.

Problem is, from what I can gather jQuery's .AJAX function doesn't allow cross-domain requests and in-turn, returns nothing.

The following code alerts out [blank]

$.ajax({
    type: "POST",
    url: "http://api.ipinfodb.com/v3/ip-city/ip_query.php",
    data: "key=***********&format=json&ip=<?php echo $_SERVER['REMOTE_ADDR']; ?>",
    success: function(r) {

        alert(r);

    }
});

I've tried all variations of parameters for the .AJAX request such as GET, JSON, blah blah blah but still nothing. Does anyone know of another way of making a request to this API via AJAX? Preferably not using YQL.

This can be done with AJAX. You will need to use JSONP to get around the cross domain issues.

Here is the code:

$.getJSON("http://api.ipinfodb.com/v3/ip-city/?key=API_KEY&format=json&callback=?" )
 .error (function  () {
    // error code
 }) 
 .success(function (result) { 
    // success code
    console.log(result); 
    console.log("your location is", result.latitude, result.longitude);
 });

You will need to replace API_KEY with your own API Key.

I have implemented recently for a WordPress plugin.

Here is what my AJAX call looked like:

jQuery.ajax({
type : "GET",
url : "action.php",
data : {    
    ipinfodb_api_key : "<?php echo $ipinfodb_api_key; ?>",
    ip : "<?php echo $_SERVER['REMOTE_ADDR']?>"},
        success : function(response) {
            jQuery("#<?php echo $widgetid; ?>").html(response);
    }
});

Here is my function in action.php that processes this information:

function processData($ipinfodb_api_key, $ip) {
$longitude = null;
$latitude = null;
$url = 'http://api.ipinfodb.com/v2/ip_query.php?key='.$ipinfodb_api_key.'&ip='.$ip.'&timezone=false';
$content = @file_get_contents($url);
if ($content != FALSE) {
    $xml = new SimpleXmlElement($content);
    if ($xml->Latitude) $latitude = $xml->Latitude;
    if ($xml->Longitude) $longitude = $xml->Longitude;
}
    // return latitude or longitude or do further processing
}

If the remote server doesn't support JSONP, due to the same origin policy restriction, you cannot call it directly from javascript (unless of course you write your own browser and implementation of javascript which doesn't respect this policy).

To workaround this restriction you could write a server side script on your domain that will act as a bridge between your domain and the remote domain (api.ipinfodb.com) and then send the AJAX request to your own server side script.

Try this url:

http://api.ipinfodb.com/v3/ip-city/?key=<your_api_key>&format=json&callback=?

...and send the request via GET(leave data empty)

http://ipinfodb.com/ip_location_api_json.php

You could write a webmethod in your webapplication that does a webrequest from your server. In essence, you're wrapping the call with another function and then you can call your function since it's the same origin.