CODEWITHSUNDEEP
asp.netjavascriptjqueryweb-services
Amr Elgarhy
Amr Elgarhy

Reputation: 68952

How to call external webservice using jquery "jsonp"?

I had a previous question can jquery ajax call external webservice?


and some good developers answered me to use jsonp, but i don't know how to use it, i am trying to call my service using this code:

$.ajax({
            type: "POST",
            url: "http://localhost:1096/MySite/WebService.asmx?callback=?",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "jsonp",
            success: function(msg) {alert(msg);}
            });


and this is my service code:

[WebMethod]
public string HelloWorld() {
    return "Hello World " ;
}


anyone have examples or can explain this issue for me?

UPDATE:
I wrote the code again to be like this:

$.getJSON("http://localhost:1096/YourShoppingTest1/WebService.asmx/HelloWorld?jsonp=?",{name:"test"},
    function(data){
    alert(data.x);
    });


and the service like this:

[WebMethod]
public string HelloWorld(string name)
{
    return "( {\"x\":10 , \"y\":100} )";
}


But it always give me this error when back: "missing ; before statement [Break on this error] ( {"x":10 , "y":100} )"

and never call the success function, can anyone help with that?

Upvotes: 2

Views: 14491

Answers (5)

hezll
hezll

Reputation:

First you should add jsonp ('callback') in your web server like $_GET['callback']

Second ,don't forget the ';' after the output scripts

$data = '{"name" : "hello world"}';
echo $_GET['jsoncallback'] . '(' . $data . ');';

Now you can find out why the "missing ; before statement" problem occured.

html:

$.getJSON({"http://localhost:1096/MySite/WebService.asmx?callback=?",
        function(data){alert(data);}
        });

Upvotes: -1

stpe
stpe

Reputation: 3628

The point with JSONP is the P! P as in padding. You are padding the JSON object literal with a function call - invoking a function on the calling page taking the data object as an argument.

I.e. if you request the webservice, send the desired callback function name in the query string

...service/?callback=hello

Then the service should answer (using appropriate mime type):

hello({a: 17, b: 4117});

For a more in-depth explanation, see: http://www.stpe.se/2008/10/cross-site-data-retrieval-using-jsonp/

Upvotes: 2

Kris Khaira
Kris Khaira

Reputation: 130

Hezil's code worked for me, but I had to change the server code to this:

$data = '{"name" : "hello world"}'; echo $_GET['callback'] . '(' . $data . ');';

Note the "callback" instead of "jsoncallback".

Upvotes: 0

Jaka Jančar
Jaka Jančar

Reputation: 11606

You can't issue a POST request using JSONP, only GET (because <script src="..."> GETs the resource).

Upvotes: 0

Bravax
Bravax

Reputation: 10493

I've had a similiar problem, unfortunately I don't have the code at hand.

From memory:

See: What are some good examples of JQuery using JSONP talking to .net? & What is the best way to call a .net webservice using jquery?

Upvotes: 2

Related Questions