PHP，Javascript，phonegap跨域与JSONP GET错误

Question

I'm trying to build a phonegap app in which I pass coordinates from a server side PHP script to a client side javascript using AJAX GET. I am having no problem with AJAX POST but GET is giving me some issues. Whenever I try GET with dataType: "jsonp", I get a javascript console warning:

Resource interpreted as Script but transferred with MIME type text/html......

This is weird considering I have full control over the server side script so I can convert the data to JSON. Is there a chance that the server does not support JSONP (documentation says it supports JSON though, its a free host!). I've tried adding various headers to the php script but that doesn't seem to work. Also, I'm using the chrome ripple emulator just in case this is relevant.

I've had a look at a variety of similar problems but I don't seem to be able to get to the bottom of it.

Anyhow, here's my code and any help would be much appreciated.

The PHP snippet (I'm pulling some data from a mysql table all this is working fine though):

$info = array(
  'lat'    => $row[LAT],
  'lng' => $row[LNG],
  'id' => $row[ID]
);
echo json_encode($info);

The relevant javascript code:

$.ajax({    
    type: "GET",
url: "http://whereto.bugs3.com/name.php",
    dataType: 'jsonp',
    jsonp: 'callback',
    jsonpCallback: 'jsonpCallback',
    success: function(data) {   
        alert(data.lng);
        }
    });

Thanks in advance

Answer 1

You will need to wrap your output with a "jsonpCallback" function to become jsonp (json with padding)

echo 'jsonpCallback(' . json_encode($info) . ');';

See also: http://en.wikipedia.org/wiki/JSONP#How_it_works