Error while accessing ASP.net webservice using JQuery - JSONP

Question

Please look at the code below and help me to figure out what am I doing wrong in my web service code. I want to set up an asp.net web service that can be consumed using an JSONP. I am using Jquery at client side to access the site. Even after setting up proper attributes my web service still emits xml due to which the aynch call fails.

Web Service

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
 [System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {

    public WebService () {

        //Uncomment the following line if using designed components 
        //InitializeComponent(); 
    }

    [WebMethod]
    [ScriptMethod(ResponseFormat= ResponseFormat.Json, XmlSerializeString=false, UseHttpGet=true)]
    public string HelloWorld(int id, string __callback) {
        return  __callback + "({message: 'Hello World'})";
    }

}

Web Service Response:

<?xml version="1.0" encoding="utf-8"?>
<string xmlns="http://tempuri.org/">test({message: 'Hello World'})</string>

Web.Config:

<webServices>
    <protocols>
        <add name="HttpGet"/>
        <add name="HttpPost"/>
    </protocols>
</webServices>
<httpHandlers>
    <remove verb="*" path="*.asmx"/>
    <add verb="*" path="*.asmx" validate="false" 
        type="System.Web.Script.Services.ScriptHandlerFactory, 
            System.Web.Extensions, Version=3.5.0.0, 
            Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
    <add verb="*" path="*_AppService.axd" validate="false" 
        type="System.Web.Script.Services.ScriptHandlerFactory, 
            System.Web.Extensions, Version=3.5.0.0, 
            Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
    <add verb="GET,HEAD" path="ScriptResource.axd" 
        type="System.Web.Handlers.ScriptResourceHandler, 
            System.Web.Extensions, Version=3.5.0.0, 
            Culture=neutral, PublicKeyToken=31BF3856AD364E35" 
        validate="false"/>
</httpHandlers>
<httpModules>
    <add name="ScriptModule" 
        type="System.Web.Handlers.ScriptModule, System.Web.Extensions, 
            Version=3.5.0.0, Culture=neutral, 
            PublicKeyToken=31BF3856AD364E35"/>
</httpModules>

Javascript

$.ajax({
    type: "GET",
    contentType: "application/json; charset=utf-8",
    url: "http://localhost:54404/jsonp/webservice.asmx/HelloWorld?id=2&__callback=?", //?jsonp=MatchSvcCallback
    dataType: "jsonp",
    data: {},
    //jsonp : "MatchSvcCallback",
    success: function(msg) {
    alert("Inside success callback function"); // not being called

    },
    error: function(xhr, msg){
        var response = JSON.parse(xhr.responseText);

    }

});

The js code works with an handler, but fails for the webservice due to xml response.

Kev · Accepted Answer · 2013-11-24 07:52:02Z

5

I think the problem here is because jQuery doesn't set the Content-Type header in the HTTP request for HTTP GET's when using $.ajax(). It only gets sent if the request type is 'POST'. This seems to be the case for both dataType: "jsonp" and dataType: "json".

I tried your example and watched the request/response exchange in Fiddler and sure enough I don't see Content-Type: application/xml; charset=UTF-8 being sent in the headers for HTTP GET requests. The header does get sent if using HTTP POST. I'm guessing the presence of this header is a cue for the ASP.NET web service plumbing to decide whether to return either a JSON or XML formatted response.

It seems you're not the only one with this problem, see the following article on the on Elegant Code website:

Calling Remote ASP.NET Web Services from JQuery

The solution appears to be one of the following:

Use a HttpModule to inject the Content-Type: application/xml; charset=UTF-8 header into the request stream as described in the article above.
Use a HttpHandler for the endpoint as you explained you were doing prior to using an ASP.NET web service.
Try Rick Strahl's page based approach in the following article (which is in effect a HttpHandler anyway): JSONP for cross-site Callbacks.

edited Nov 24, 2013 at 7:52

answered Mar 11, 2009 at 19:19

Kev

120k53 gold badges308 silver badges396 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

gk. Over a year ago

I fixed the content type problem with beforeSent method of the $.ajax, and I cross checked the request headers with firebug they are properly added.

gk. Over a year ago

I think i have to add a web service extension to change the response so that the callback method name is added to the response in order to resolve the "invalid label" error from jquery

Collectives™ on Stack Overflow

Error while accessing ASP.net webservice using JQuery - JSONP

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related