CORS | Access-Control-Allow-Origin | MAKING JSONP REQUEST and MVC ACTION TO RETURN JSONP

(CROSS DOMAIN COMMUNICATION WITH JSONP using ASP.NET MVC)

IIS: Allow cross origin for a website 

Make below entry in respective web.config


  <system.webServer>
   <httpProtocol>
     <customHeaders>
       <add name="Access-Control-Allow-Origin" value="*" />
     </customHeaders>
   </httpProtocol>
 </system.webServer>

WHY JSONP?

Same-origin policy in your browser is the only reason, which blocks the script running in your window if origin is different. As per standard you can't have different origin for same window. Origin means protocol//host:port

 Below sample URLs will be treated as different origin for the browser. We can resolve this by adding Access-Control-Allow-Origin: * or origin in response header. Find more implementing CORS for your site.

http://xyx.com 
http://abc.xyx.com
https://xyx.com  
http://xyx.com:1212 

What JSONP resolves ?

Since same-orgign policy is in place and want avoid CORS because of other reason, JSONP allows to load the script in browser using AJAX and once the response return for the request AJAX calls the callback method.

In addition to that, JSONP is an another approach that allows you to utilize set of data from other site to your site or you can push the data from back-end to your subscriber(browser who is making call). Back-end has option to check subscriber request and manipulate response according to request/client or based upon the query params. I think most people are utilizing this approach to communicate domain object to your browser and exposing data as service response. Alternative and recommended solution is CORS if it fits your need. 

Note: JSONP only supports the GET request.

WHAT TO DO IN CODE IF NEED TO HANDLE JSONP REQUEST IN MVC

For the article I have considered ASP.NET MVC to return JSONP

 
public ContentResult ApiResult(string callback)
{
   JsonObjectModel obj = new JsonObjectModel() { Name = "XYZ", Address = "ABC" };
   string objectString = Newtonsoft.Json.JsonConvert.SerializeObject(obj);
   return Content(String.Format("{0}({1});",callback,new JavaScriptSerializer().Serialize(obj)),"application/javascript");
}

HOW TO MAKE JSONP REQUEST

<script src="[path]/jquery-1.7.1.min.js" type="text/javascript"></script>     <script type="text/javascript"> 
        function jsonCallback(data) {
            alert('JSONP Data:' + data.Name + ','+data.Address);
        }
 
        (function ($) {
            $.ajax({
                jsonpCallback: 'jsonCallback',
                url: 'http://host/controller/apiresult?callback=?',
                dataType: 'jsonp',
                success: function(dataWeGotViaJsonp){
                     console.log('Response return from server:200-OK');

                },
                error: function (e) {
                    console.log(e.message);
                }
            });
 
        })(jQuery);
</script>

Note: 

1. Ensure AJAX request has  dataType: 'jsonp'
2. Request type is GET


Comments

Post a Comment

Popular posts from this blog

Difference between Parse/TryParse/ParseExact/TryParseExact

Parse ===== //int.Parse("12.44"); //Exception : Above code will generate the exception "Input string was not in a correct format", just because you are trying to cast float/real value in int[Integer]. //Only it is parsing if your parameter value must match the desire type in which you are trying to parse. TryParse ======== //case #1 int.TryParse("14.55",out a); //case #2 int.TryParse("14", out a); //Above code(case 1) will return 'false', just because parsing operation gets failed and value for variable 'a' would be 'zero' //here consider 'a' is output type of parameter like we have in oracle/sql server(not exactly same but behavior is same). //if parsing get succeeded than it will return true and target variable (i.e. 'a') will have the
Read more

Benefits of Test Driven Development (TDD)

1: Developer plays the role of user and developer while writing code, hence customer centric approach throughout the development 2: Reduces real time issues because of code written with end user mindset 3: Initially takes time but overall less-n-less debugging time 4: Identify cascading code break early or related change in other modules 5: Regression fix early 6: Help avoiding over engineering code which we don’t need actually 7: Avoid Scope Creep, helps in design and create high possibility of acceptance
Read more

Version history of C#

 Version history of C# 1.0, 2.0, 3.0, 4.0, 5.0, 6.0 CLR .NET C#  Release Date 1 1 1.0  February 13, 2002 1.0  1.1   1.0  April 24, 2003 2 2 2 November 7, 2005 2 3.0   3.0  November 6, 2006 2 3.5 3.0  November 19, 2007 4 4 4 April 12, 2010 4 4.5 5 August 15, 2012 4 4.5.1   6 October 17, 2013 4 4.5.2   6 May 5, 2014 C# - 1.0 Managed code C# - 2.0 Generics Nullable types Delegates Implicit method group conversions and anonymous methods Iterator blocks Partial types Covariance and Contra-variance C# - 3.0 Automatic properties Object and collection initializers Implicitly typed local variables and arrays Anonymous types Lambda expressions Expression trees Extension methods Query expressions/query comprehensions LINQ Var Type  C# - 4.0 Dynamic programming Covariance and contravarian
Read more