CODEWITHSUNDEEP
jqueryasp.netajaxweb-servicesjsonp
mint
mint

Reputation: 3433

Call Cross Domain Asp.Net Web Service Using Jsonp

I've tried countless examples and cannot get this to work.

I'm trying to call a cross domain asp.net web service but get back the following error every time:

jQuery18105929389187970706_1348249020199 was not called

Here's my web service:

[WebService(Namespace = "http://www.mywebsite.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
// [System.Web.Script.Services.ScriptService]
[ScriptService]
public class DataService : System.Web.Services.WebService
{
    [WebMethod]
    [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
    public string GetIncidentsByAddress()
    {
        return "It worked!";
    }
}

My HttpModule to handle Json:

 public class JsonHttpModule : IHttpModule
    {
        private const string JSON_CONTENT_TYPE = "application/json; charset=utf-8";

        public void Dispose()
        {
        }

        public void Init(HttpApplication app)
        {
            app.BeginRequest += OnBeginRequest;
            app.ReleaseRequestState += OnReleaseRequestState;
        }

        bool _Apply(HttpRequest request)
        {
            if (!request.Url.AbsolutePath.Contains(".asmx")) return false;
            if ("json" != request.QueryString.Get("format")) return false;
            return true;
        }

        public void OnBeginRequest(object sender, EventArgs e)
        {
            HttpApplication app = (HttpApplication)sender;

            if (!_Apply(app.Context.Request)) return;

            // correct content type of request
            if (string.IsNullOrEmpty(app.Context.Request.ContentType))
            {
                app.Context.Request.ContentType = JSON_CONTENT_TYPE;
            }
        }

        public void OnReleaseRequestState(object sender, EventArgs e)
        {
            HttpApplication app = (HttpApplication)sender;

            if (!_Apply(app.Context.Request)) return;

            // apply response filter to conform to JSONP
            app.Context.Response.Filter =
                new JsonResponseFilter(app.Context.Response.Filter, app.Context);
        }
    }

    public class JsonResponseFilter : Stream
    {
        private readonly Stream _responseStream;
        private HttpContext _context;

        public JsonResponseFilter(Stream responseStream, HttpContext context)
        {
            _responseStream = responseStream;
            _context = context;
        }

        //...

        public override void Write(byte[] buffer, int offset, int count)
        {
            var b1 = Encoding.UTF8.GetBytes(
              _context.Request.Params["callback"] + "(");
            _responseStream.Write(b1, 0, b1.Length);
            _responseStream.Write(buffer, offset, count);
            var b2 = Encoding.UTF8.GetBytes(");");
            _responseStream.Write(b2, 0, b2.Length);
        }

        //...
    }

My web.config for said HttpModule:

<add name="JSONAsmx" type="JsonHttpModule, App_Code"/>

And lastly my jQuery call:

<script src="js/jquery.jmsajax.min.js" type="text/javascript"></script>
<script src="js/jquery-1.8.1.min.js" type="text/javascript"></script>

<script type="text/javascript">

    $.jmsajaxurl = function(options) {
        var url = options.url;
        url += "/" + options.method;
        if (options.data) {
            var data = ""; for (var i in options.data) {
                if (data != "")
                    data += "&"; data += i + "=" +
             msJSON.stringify(options.data[i]);
            }
            url += "?" + data; data = null; options.data = "{}";
        }
        return url;
    };

    $(function() {
        var url = $.jmsajaxurl({
            url: "http://www.mywebsite.org/apps/IncidentReportingService/DataService.asmx",
            method: "GetIncidentsByAddress",
            data: {}
        });

        $.ajax({
            cache: false,
            dataType: "jsonp",
            success: function(data) { successCallback(data); },
            error:function(xhr, status, errorThrown) { debugger;},
            url: url + "&format=json"
        });

    });

    function successCallback(data) {
        debugger;
        $.each(data, function(i, item) {
            $("#tweets ul").append("<li>" + item.text + "</li>");
        });
    };

Any ideas?

Upvotes: 2

Views: 2370

Answers (2)

mint
mint

Reputation: 3433

Well it appeared that my HttpModule was not being implemented all the way. There are methods that I had not overwritten in it and it was causing the entire Web Service not to work.

I changed it to the following and now everything works:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO;
using System.Text;

public class JsonHttpModule : IHttpModule
{
    private const string JSON_CONTENT_TYPE = "application/json; charset=utf-8";

    public void Dispose()
    {
    }

    public void Init(HttpApplication app)
    {
        app.BeginRequest += OnBeginRequest;
        app.ReleaseRequestState += OnReleaseRequestState;
    }

    bool _Apply(HttpRequest request)
    {
        if (!request.Url.AbsolutePath.Contains(".asmx")) return false;
        if ("json" != request.QueryString.Get("format")) return false;
        return true;
    }

    public void OnBeginRequest(object sender, EventArgs e)
    {
        HttpApplication app = (HttpApplication)sender;

        if (!_Apply(app.Context.Request)) return;

        // correct content type of request
        if (string.IsNullOrEmpty(app.Context.Request.ContentType))
        {
            app.Context.Request.ContentType = JSON_CONTENT_TYPE;
        }
    }

    public void OnReleaseRequestState(object sender, EventArgs e)
    {
        HttpApplication app = (HttpApplication)sender;

        if (!_Apply(app.Context.Request)) return;

        // apply response filter to conform to JSONP
        app.Context.Response.Filter =
            new JsonResponseFilter(app.Context.Response.Filter, app.Context);
    }
}

public class JsonResponseFilter : Stream
{
    private readonly Stream _responseStream;
    private HttpContext _context;
    private long _position;

    public JsonResponseFilter(Stream responseStream, HttpContext context)
    {
        _responseStream = responseStream;
        _context = context;
    }

    public override bool CanRead { get { return true; } }

    public override bool CanSeek { get { return true; } }

    public override bool CanWrite { get { return true; } }

    public override long Length { get { return 0; } }

    public override long Position { get { return _position; } set { _position = value; } }

    public override void Write(byte[] buffer, int offset, int count)
    {
        var b1 = Encoding.UTF8.GetBytes(
          _context.Request.Params["callback"] + "(");
        _responseStream.Write(b1, 0, b1.Length);
        _responseStream.Write(buffer, offset, count);
        var b2 = Encoding.UTF8.GetBytes(");");
        _responseStream.Write(b2, 0, b2.Length);
    }

    public override void Close()
    {
        _responseStream.Close();
    }

    public override void Flush()
    {
        _responseStream.Flush();
    }

    public override long Seek(long offset, SeekOrigin origin)
    {
        return _responseStream.Seek(offset, origin);
    }

    public override void SetLength(long length)
    {
        _responseStream.SetLength(length);
    }

    public override int Read(byte[] buffer, int offset, int count)
    {
        return _responseStream.Read(buffer, offset, count);
    }
}

Upvotes: 0

A Developer
A Developer

Reputation: 1031

Try parsing the json returned data as below 

success: function(data) { 
    data = JSON.parse(data); 
    // Do work with the data
}

Upvotes: 1

Related Questions