Post JSON to MVC Controller with XDomainRequest, XmlHttpRequest and jQuery Ajax Call

Once I try to post a JSON to a MVC controller, I use jQuery.post method and all works fine as you can see in this site, the first in the below references.

But when I try to use XDomainRequest or XmlHttpRequest, the JSON parameter at server side has null properties, in others words, the data is sent but not serialized to our serializable Type.

So, in order to receive data at server side, i used the DataContractJsonSerializer class to read the Stream sent in the Request, like this:

Of course, to make use of DataContractJsonSerializer, we need a class representing JSON with [DataContract] attribute and respective [DataMember] just like a WCF service for instance.

Then, the code at server side, looks like this:

And, at client side, making use of XDomainRequest and XmlHttpRequest Objects, and jquery the code is

This way, you have a MCV controller that can receive JSON using the JSON serializing capacities of MCV3 from XDomainRequest, XmlHttpRequest and jQuery ajax call.


References:
http://lozanotek.com/blog/archive/2010/04/16/posting_json_data_to_mvc_controllers.aspx
http://msdn.microsoft.com/en-us/library/bb412170.aspx
http://msdn.microsoft.com/en-us/library/bb412179.aspx

Javascript - Consume Service With Cross Domain Request

Every time you need to do a request over your domain, you have to be aware of what kind of browser is running your code. If is an IExplorer, you will need to use the object XDomainRequest because this object is specifically to make cross-domain requests.

Here's a sample of usage:

If you want to make it complaint with others browsers you will need to use the XmlHttpRequest object, or, even simpler, making an ajax call with jQuery. This object, together with CORS, make possible to make cross domain requests.

The snippet of XmlHttpRequest goes like this:

And the call using jQuery:

XDomainRequest is the response by Microsoft against XmlHttpRequest with CORS protocol, instead of integrate it (CORS) with IExplorer, they create their own object for cross domain's requests.

Regarding CORS, all you have to do, is making your service server aware for OPTIONS verb and return the needed headers, because the browser itself makes the magic happens. So, to enable cross domain ajax call, at server you need to...

With all this set up, you should have your communication with your server on. One little note, be aware of kind of service and object you are using, for instance, XDomainRequest only accept text/plain to send (xdr.send(string)) and an WCF service accepts XML, JSON, etc. but not text/plain.


References:
http://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and-workarounds.aspx
http://stackoverflow.com/questions/4739384/xdomainrequest-problem
http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/
http://www.codeproject.com/KB/ajax/jQueryWCFRest.aspx