simple jsonp not working with php server

Question

I tried following some basic examples, and it is not working. I am not sure I completely understand jsonp, but I followed the basic tutorials and on an intuitive level, I can't see anything wrong. (Of course, I am missing something, hence the question).

JavaScript code:

postData = $(this).serialize();

console.log(postData);

$.ajax({

    data: postData,
    url: 'externaldomain.php',
    dataType: 'jsonp',

    success: function(data){
        console.log(data);
        alert('Your comment was successfully added');
    },
    error: function(){
        console.log(data);
        alert('There was an error adding your comment');
    }
});

PHP code:

$tag = mysql_real_escape_string($_GET["callback"]);

The annoying part is that it is not even showing me an error to Google for.

Can anyone help out figuring the problem please?

Try `url: 'externaldomain.php?callback=',` – Rohan Kumar Apr 04 '14 at 04:58 — Rohan Kumar, Apr 04 '14 at 04:58

score 0 · Answer 1 · edited May 23 '17 at 12:26

0

Since you haven't posted your full or relevant PHP code I'm going to assume it looks like this

$tag = mysql_real_escape_string($_GET["callback"]);
echo $tag."(";
// print json here
echo ")"

I'm not really sure how jquery handles jsonp requests but what I used to do is add a new script tag to the DOM that looks like this

<script> function cb(json) { alert(json); } </script> // (I)
<script src="{url}?callback=cb"></script> // (II)

When (II) is loaded, and because we have a callback then the script that we are including in the DOM looks like this

cb({
   // json goes here
})

which pretty much is like a function call to some function called cb that we are using. It is therefore natural to have an implementation of cb (which is in (I)). That implementation is similar to the success(data) function in jQuery's ajax. It is used to use and manipulate the json requested

However I noticed that you are doing a POST request along the ajax call with jsonp. Unfortuantely (according to this question How to make a jsonp POST request that specifies contentType with jQuery?) doing POST with JSONP is not feasable due to implementation pursposes.

edited May 23 '17 at 12:26

Community

1
1

answered Apr 04 '14 at 05:26

george

565
1
5
16

Yeah it is just echoing the tag for now in PHP besides that statement. And I didn't understand what you meant by the function thing. Can you tell by an example? – user3215569 Apr 04 '14 at 05:29
Of course, I will edit the question to elaborate more – george Apr 04 '14 at 05:30
I am not doing a post. The variable name is just posData, since i was modifying a previous example. And i tried to understand how you said it should work..and it didnt work.. – user3215569 Apr 05 '14 at 15:18
@user3215569 are you sure your json is valid? It seems to be very weird why this example wouldn't work, I tested it and worked flawlessly. In that case could you provide us a relevant snippet of your source code (js, html, php and json) – george Apr 07 '14 at 05:15

score -1 · Answer 2 · edited May 23 '17 at 12:34

-1

You can't POST using JSONP... it simply doesn't work that way... So you can usually only perform GET requests. You can NOT perform POST requests.

For details about how jsonp work look at this nice article. jsonp-how-does-it-work

For more clearification : See Other SO question Link1 Link 2

But there is work around for that with some limitations look at this Using PUT/POST/DELETE with JSONP and jQuery. (for me nothing works at all)

edited May 23 '17 at 12:34

Community

1
1

answered Apr 04 '14 at 05:44

Ritesh Chandora

8,382
5
21
38

This does not provide an answer to the question. To critique or request clarification from an author, leave a comment below their post. – Darin Kolev Apr 04 '14 at 06:06
@DarinKolev JSON-P works by injecting a script tag into your document: it is not a traditional XHR request. So you can usually only perform GET requests. You can NOT perform PUT requests. – Ritesh Chandora Apr 04 '14 at 07:10
I wasn't doing post in the first place. Look at the question carefully please. – user3215569 Apr 06 '14 at 16:51
Okie, log the request in Console and look how XHR request is generated. you can do so by open console in Chrome and right click and check LOG 'XMLHttpRequest'. Now perform the your operation. Now open this request in new tab and tell what you see. – Ritesh Chandora Apr 07 '14 at 05:48

simple jsonp not working with php server

2 Answers2