Category Archives: Web Services

WCF Web Services

Visual Studio 2012 and Web API

By Tim Daniels
Visual Studio 2012 recently became available, so I decided to download the Express for Web edition from the Microsoft Products Store. Here is a snapshot of the new look and feel of Visual Studio 2012. See what else is new in Visual Studio 2012.

Visual Studio 2012

Visual Studio 2012 – New look and Feel

Within Visual Studio 2012, I have discovered a new technology called Web API. According to ASP.net website, ASP.NET Web API is a framework that makes it easy to build HTTP services that reach a broad range of clients, including browsers and mobile devices. ASP.NET Web API is an ideal platform for building RESTful applications on the .NET Framework. The Web API framework appears to be a subset of the MVC 4 design pattern, which is also included in Visual Studio Express 2012. ASP.NET MVC gives you a powerful, patterns-based way to build dynamic websites that enables a clean separation of concerns and that gives you full control over markup for enjoyable, agile development. ASP.NET MVC includes many features that enable fast, Test Driven Development (TDD) for creating sophisticated applications that use the latest web standards.

As you know from my most recent articles, I’ve been focusing on developing web services based on the Microsoft Windows Communication Foundation (WCF). You may also recall that the web service I developed is based on the REST architectural model. Since the Web API technology is also based on REST, I have decided to add this technology to my repertoire. My objectives are the following;

  • Learn Web API from the online tutorials at the ASP.Net website
  • Develop a prototype web service with Visual Studio 2012
  • Deploy the web service to the could using Microsoft Azure
  • Develop a client app for mobile devices like IPad to consume the web service
  • If all of this works as expected, I will develop a new web service for the World of Art Web App based on Web API

The AJAX Client and Cross-Domain GET Requests

By Tim Daniels
In developing the client to consume the World of Art Web Service, I decided to stick with the ASP.Net Web Form (.aspx). This allowed me to take advantage of the master page concept already implemented in the World of Art Web App. Following is the markup source code of the .ASPX page. As you can see it has some very basic ingredients;

  • Page declaration with a reference to the web site master page
  • HTML Heading Tag
  • A script tag pointing to a JavaScript source code file called GetArtists.js

Here is the XHTML mark up code of the .aspx web form;

The heart of the client application is the JavaScript in the GetArtists.js file. There are two primary functions;

  • getArtistsAjax() – Requests artist data from the World Of Art Web Service
  • updateArtists() – Dynamically generates the user interface

Here is the JavaScript source code of the client.

Lets first examine the getArtistsAjax() function. There are many different ways to perform an HTTP GET request. After trying a number of different combinations, I found this implementation to be a straightforward and flexible solution. The getArtistsAjax() function uses the JQuery.ajax() method, to perform the asynchronous HTTP(Ajax) request for artist data from the ArtService. The jQuery.ajax() method can be configured with a multitude of settings and parameters. However, for the simple HTTP GET request required by this application, I found it necessary to only pass five arguments to the jQuery.ajax() method, which are coded as key/value pairs;

  • type: “GET” – The type of request to make (“POST” or “GET”)
  • url: ‘http://lexicon-software-apps.com/ArtService.svc/GetArtists’ – A string containing the URL to which the request is sent.
  • dataType: “jsonp” – Loads in a JSON block using JSONP. Adds an extra “?callback=?” to the end of your URL to specify the callback. Disables caching by appending a query string parameter, “_=[TIMESTAMP]“, to the URL unless the cache option is set to true.
  • success: function() – A function to be called if the request succeeds.
  • error: function() – A function to be called if the request fails.

The most interesting setting is the dataType set to “jsonP”. This gives the client flexibility to perform a “GET” request from a domain other than the one that served the original page request. The following illustrates an example of this. I setup an alternate domain at Winhost called Lexicon-Software-Learning.com. I published the World of Art Web Service at Lexicon-Software-Learning.com. I then changed the url setting to point to the learning domain. Here is the result;

Cross Domain Get Request

The artists entity web page is served from Lexicon-Software-Apps.com domain and the get artists data request is served from Lexicon-Software-Learning.com.

The other primary JavaScript function in GetArtists.js is the updateArtists() function. It receives the JSON formatted data result set from the HTTP GET request. The JSON data is basically an array of artist objects. This function simply iterates through the array of artist objects, and adds them as elements to the web pages’ Document Object Model (DOM) object. I also applied some new CSS 3 style sheet elements, to finish off the look and feel, of the list of artists page.

I will cover the user interface in more detail in my next post. We will also look at the evolution of the user interface in the World of Art Web App, from the first iteration which was server side generated, to this latest iteration which is client side generated.

Here is the CSS 3 Cascading Style Sheet

Deployment of the WCF Web Service

By Tim Daniels
Deployment of the World Of Art Web Service app was a very simple one step process.

From the Build Menu in Visual Studio 2010, select the Publish WorldOfArtServiceApp option. This will launch the Publish Web dialogue box.

As you can see from the illustration below, my hosting provider, WinHost, supports the one click publishing feature in Visual Studio 2010. I’m using the same server URL and domain name as the World of Art Web App. Notice the check box to indicate this is an IIS application on destination.

By structuring the WCF web service as a separate project I have the flexibility to publish to other domain names I have hosted at WinHost. The only disadvantage to this approach, is that anytime the World of Art Web App is re-published with new development, the World of Art Web Service also must be re-published. It appears that the World of Art Web Service looses the reference to the ArtWorldObjects in the World of Art Domain.

Publish WCF Web Service in Visual Studio 2010

Publish WCF Web Service in Visual Studio 2010 to hosting provider Winhost

My hosting provider, WinHost, fully supports IIS 7 hosting for my .NET web apps and WCF web services. In the illustration below, I’m using the IIS 7 Manager to remotely manage the IIS 7 server where my applications have been deployed.

Internet Information Services (IIS) 7 Manager is an administration UI that provides you with a new way to remotely manage IIS 7.x servers. I recommend reviewing the Getting Started with IIS Manager article by Tobin Titus on the IIS.net website.

IIS 7  Support at WinHost

IIS 7 Support at WinHost

As you can see, deployment and remote administration of the World Of Art Web Service, is a very straight forward process. The important thing to remember, is that I put some careful forethought into selecting a hosting provider, that fully supports the combination of technologies exploited in the architectural design of the applications;

  • ASP.net
  • MS SQL Server
  • WCF Web Services
  • IIS 7 Remote Management
  • One-Click Publishing

Visit WinHost for more information.

In my next post, we begin discussions about the World of Art Client, which is consuming the artist data from the World of Art Web Service.

Configuration of the WCF Web Service

Depending on the requirements of the application, configuration of a WCF web service can be simple and straightforward, or sophisticated and complex. This first iteration of the World of Art Web Service has very simple requirements, so I’ve attempted to keep the configuration as straightforward as possible. Here is the Web.Configuration file from the web service.

The first thing to notice is the ConnectionStrings tag. Since the World of Art Web Service references the Data Access Layer and the Data Model, from the World of Art Web App, it is necessary to provide the database connection information to the web service.

Now, lets discuss the configuration of the World of Art Web Service. Configuring the service in the Web.config file, gives us the same flexibility in deployment and management of the web service, as configuring a web application in the Web.config file. Instead of hard coding configuration elements in the application code, it is preferable to expose this information in the configuration file. This will allow an administrator to configure the application for final deployment, without having to modify code and rebuild the application.

The World of Art Web Service, is based on the Windows Communication Foundation (WCF) and will be hosted by Internet Information Services (IIS). The web service run time environment is .NET Framework version 4. Therefore, this configuration is specific to a WCF services hosted in IIS. IIS depends on the mark up found in the .svc file to implement the WCF service. My hosting provider, Winhost, supports all of these components.

The WCF configuration scheme includes three major sections;

  • serviceModel
  • bindings
  • services

Here is the serviceModel seciton ;

The entire service configuration is bound by the system.serviceModel elelment. Lets first examine the services element. Within services we find one or more service elements. It has a name attribute to identify the service. Within the service element, the endpoint element is used to configure one or more service endpoints. Notice how the address attribute has a null value. Since this service is hosted in IIS, it’s not necessary to specify an endpoint address. In fact, specifying a fully qualified endpoint address can lead to deployment errors in IIS. With an IIS hosted WCF service, the end point address is always relative to the .svc file that represents the service.

The binding attributes of the endpoint element, specify how the endpoint communicates with the world, in terms of transport and protocol schemes. In this case, I specified the WebHttpBinding Class. A binding used to configure endpoints for WCF Web services that are exposed through HTTP requests instead of SOAP messages. I am also utilizing the bindingConfiguration attribute of the endpoint element. This attribute is used in conjunction with binding to reference a specific binding configuration in the configuration file. In this case it is referencing a binding elelment in the webHttpBinding section named “webHttpBindingWithJsonP”, where I specify a custom binding configuration using the crossDomainScriptAccessEnabled, which is set to true. I will discuss cross domain access to web services in a future post.

The final attribute of the endpoint element is the behavior configuration attribute. I gave the behavior configuration a unique name of “webHttpBehavior”. The configuration of the endpoint itself can be found in the behavior element of endpoint behaviors section. The only required element I utilized is the webHttp element. This element specifies the WebHttpBehavior on an endpoint through configuration. This behavior, when used in conjunction with the webHttpBinding standard binding, enables the Web programming model for a Windows Communication Foundation (WCF) service. I simply took all of the default values for attributes in the webHttp element.

As you can see, it is absolutely necessary to completely understand the operational requirements of the WCF web service, prior to configuration. There is a lot of flexibility in this area of WCF. However, with more flexibility comes more responsibility. In my next post I will cover deployment of the WCF web service.

Implementation of the Web Service Interface

In my last post, we discussed the interface of the WCF application and how it forms a mutually binding contract, between the client and the service. The client must make their request in a format the service is expecting, and the service must fulfill the request in the format specified in the contract. This is all defined in the operation contract of the IArtService interface.

  • The request must be an XMLHttpRequest using the “GET” verb
  • The “GET” request must specifically request access to the ArtService.svc and the GetArtists method
  • The service must respond to the request with data serialized into the Json format

Here is a simple JavaScript function which would satisfy the contractual requirements for a request;

Once again, here is the IArtService interface where the mutually binding contract between the service and clients is defined;

As you can see, the interface also uses the System.Runtime.Serialization and System.ServiceModel.web name spaces to fulfill the request.

Now, lets examine the implementation of the IArtService interface. Here is the source code of the ArtService class which implements the IArtService interface;

As I stated in an earlier post, the purpose of the Art Service Class is not to expose the business logic of the World of Art web app. Instead, the purpose of the Art Service, is to simply expose specific data elements from the World of Art domain, which can be served upon request, to various software clients. In order to retrieve data from the world of art domain, the ArtService class references two name spaces from the WorldOfArtWebApp;

  • ArtWorldObjects
  • WorldOfArtWebApp.DataAccess

With these references, the GetArtist() method can reuse components of the WorldOfArtWebApp from the Data Access Layer and the Data Model defined in the Entity Framework.

The GetArtist() method is bound by the Operation Contract, defined in the IArtService interface, to return a list of artist objects. This requirement is satisfied by simply creating a new instance of the ArtWorldCollectionArtist Class, and accessing the collection of artist objects in the ArtWorldCollection property. The collection of artist objects is retrieved from the WorldOfArtContext, generated from the Entity Framework. The WCF web service will serialize each of this artist objects into JSON format as specified in the operation contract.

In my next post, I will discuss how to specify which properties of the Artist object are exposed to the web service. Also, here is the source code for the ArtWorldCollectionArtist class, invoked by the GetArtist() method.

Web Service Operational Parameters

Today I will continue the discussion of the service contract, as defined by the interface generated from the WCF application template. Once again, here is the source code of the interface;

The operational parameters of the service contract are defined as a method. In this application, the method is called GetArtists() and it returns a list of artist objects from the world of art domain, as defined in the ArtWorldObjects name space. Therefore, a reference to the ArtWorldObjects class library is necessary, as indicated by the using statement.

The GetArtists() method is enhanced with the Operation Contract Attribute, which indicates that a method defines an operation that is part of a service contract in a application. The operation contract attribute is also defined in the System.ServiceModel name space.

The GetArtists() method is also enhanced with the WebGetAttribute Class, which indicates that a service operation is logically a retrieval operation and that it can be called by the REST programming model. The WebGetAttribute Calss is defined in the System.ServiceModel.Web name space. The constructor method of the WebGetAttribute class will accept a variety of arguments, as named parameters, which populate the properties of the class and configure the operational contract between the service and client software. This first iteration of the web service is very simple and retrieves a very small data set, so I’m only passing the Response Format argument for now.

The Response Format parameter will set the ResponseFormat property of the WebGetAttribute class. This property determines the format of responses sent from a service operation. The two possible values are Xml and Json.

As you can see, the World of Art Service will return a response in the Json format. JSON stands for JavaScript Object Notation. JSON is syntax for storing and exchanging text information. The web service is now contractually obligated, to respond to requests with text. More specifically, text that is formatted in a way that JavaScript, running on the client, can parse and evaluate as objects. In this application the objects are abstract representations of artists. The clients will receive an array of artist objects. Click on this link, Get Artists to send a request to the World of Art Service, and see the JSON text returned by the service. This link, Artist will take you to the actual website that consumes this JSON data.

In my next post, I will discuss the implementation of the IArtService interface.

Web Service based on WCF and REST

Then next phase in the evolution of the World of Art Web App is the development of a web service, based on the Windows Communication Foundation (WCF), and the Representational State Transfer (REST) architectural model. SO lets get started.

Visual Studio 2010 and the .Net Framework 4.0 make development of web services a very straight forward process. As you would expect, Visual Studio has a WCF Service Application template already installed.

Visual Studio provides a WCF application template already installed

Visual Studio provides a WCF application template already installed

I decided to make the World of Art web service a separate project from the World of Art web app. The primary reason for doing this, is that later in the project, I want to demonstrate cross-domain access to web services, and keeping the service in a separate project will make deployment to multiple domains easier. Here is the solution explorer displaying all of components generated from the WCF application template.

WCF Project in Visual Studio 2010

WCF Project in Visual Studio 2010

The WCF application template generates three very important files for defining and developing the functionality of the web service;

  • Interface defining the contract and operations of the service
  • Web Configuration file
  • Service file

Here is the source code in these three files;

The service file, which I named ArtService.svc

The web configuration file

The Interface

The interface, which I named IArtService, defines both the service contract and the operational parameters of the service contract. The implementation of the interface, will facilitate the fulfillment of contractual requirements, between the client and the web service. The interface is enhanced with the service contract attribute, which indicates that an interface or a class defines a service contract in a application. This attribute is defined in the System.ServiceModel name space of the .NET Framework 4. This name space contains the classes, enumerations, and interfaces necessary to build service and client applications that can be used to build widely distributed applications.

In my next post I will cover the operational parameters of the service contract.

Return of the Jedi Blogger with HTML5 and Web Services

It has been a very busy summer and three months have slipped away since my last post. Since then, I’ve been working on other projects and doing some summer time traveling, which included visits to Los Angeles and Las Vegas. I have also been doing some very interesting work with HTML5 and web services. Well, with summer time activities winding down, it’s time to get back to work on the World of Art Web App project. In coming posts, I will be enhancing the server side of the web app, with a new web service, based on Microsoft’s Windows Communication Foundation (WCF). I will also enhance the client, with a new artist page based on the new web standard, HTML5.

My next post will cover the WCF web service. The purpose of the web service, is to listen for requests from various software clients, and respond to the requests with information from the World of Art Web app. The architectural objective in the design of the web service, is not to expose the business logic of the web app to world wide web. Instead, the design objective is to only expose specific data elements and implement a scheme, that enables client applications to access this data, and manipulate it using their own business logic. With these design objectives in mind, I have decided to use the Representational State Transfer (REST) architectural model.

The web service will reuse all of the Entity Framework and the data access layer components already developed. As previously stated, these components will not be exposed by the web service. However, the web service will use the output of these components to satisfy a basic contract for information, as requested by a client application.