JSONP in SharePoint 2010 and .NET 3.5

Recently I need to implement JSONP in SharePoint 2010 to address a multi farms scenario. My service layer are built around WCF REST API in .NET 3.5 and in my production environment an upgrade to .NET 4 (that support JSONP via CrossDomainScriptAccessEnabled attribute of WebHttpBinding) or implement any kind of extension is not option.

So, the solution was write the JSONP string directly in the response.

The steps to do this are:

1. Define an operation that does not return a value (void):

   [OperationContract]
   [WebGet(UriTemplate="jsonpFeed")]
   void GetJsonpFeeds();

2. Implement the operation:
   • Use JavaScriptSerializer to obtain the JSON string.
   • Wrap the JSON string with callback function call and write the string directly to Http Response (previously is important to change the Response Content Type to application/json).

   public void GetJsonpFeeds()
   {
    JavaScriptSerializer s = new JavaScriptSerializer();
    HttpContext.Current.Response.ContentType = "application/json";
    HttpContext.Current.Response.Output
     .Write("jsonpcallback("+s.Serialize(GetFeeds())+")");
   }

3. Active the ASP.NET Compatibility in WCF, this is important because if not activate it you can’t access to HttpContext.Current:
   • In the Web.Config (in SharePoint 2010 is activated by default):

     <system.serviceModel>
      <serviceHostingEnvironment 
       aspNetCompatibilityEnabled="true"/>
     </system.serviceModel>

   • And in the service class (via the AspNetCompatibilityRequeriments attribute):

     [AspNetCompatibilityRequirements(
      RequirementsMode=
      AspNetCompatibilityRequirementsMode.Allowed)]
     public class FeedService : IFeedService

4. Finally implement the AJAX call in the client:

   $(document).ready(function() {
    $('#getFeedsButton').click(function() {
     $.ajax({
      url: 'http://localhost:1040/FeedService.svc/jsonpFeed',
       data: null,
       dataType: "jsonp",
       jsonp: "callback",
       jsonpCallback: "jsonpcallback"
      });
    });
   });
   
   function jsonpcallback(data) {
    $('#feedsList').html('');
     $.each(data, function(i, item) {
      $('#feedsList').append($('<li>' + item.Title + '</li>'));
     });
   }

Download the complete code here