MVC

WebAPI is used to create REST based HTTP Services which are able to reach different types of clients.Today web clients are not restricted to just web browsers ,lot of different clients are being used to access the data over the internet.Clients such as mobile devices and tablets commonly access the data over the internet.For such broader category of clients ,which needs to access the information over HTTP, some technology specific to the HTTP is required which is what WebAPI provides.

WebAPI is used to create REST-ful web services.As WebAPI is all about creating REST based HTTP Services lets first understand what is REST here.

REST stands for ‘Representational State Transfer’ and is a pattern used to define the API using the HTTP.API means application programming interface and in the case of web applications usually means web services which are used to perform the CRUD operations on the data and may also contain some application logic.To perform CRUD operations such API usually connects to a database using a data access technology such as Entity Framework.

Resource The important thing in a REST services is that the resource is represented using an address or URL.These resources typically represents the data or business entities.
Verb   This indicates what operation we want to perform on the Resource.There are different HTTP verbs which can be used to perform the different operations

POST          For inserting a new entity
GET            For fetching an entity or many entities
PUT            For updating  a specific entity
DELETE    For deleting the entity

So for example we can represent a customer entity at a specific address and then can perform CRUD operations on it by using the different HTTP methods such as GET or POST.

WHY to use WebAPI instead of web services or WCF services?

One important question is why should we use WebAPI when we already have Web Services and WCF available for creating the services.There are few things worth mentioning
Web Services can be used to create services which uses SOAP over the HTTP protocol.Web services or WCF may not be not be suitable in the scenarios such as :

• Today there are different varieties of clients and using web services is not a good option when we consider these devices.Web services uses the SOAP message protocol for exchanging information.SOAP messages contains lots of information related to the request and also uses wsdl which is definitely an overhead when we consider the bandwidth available to these devices.
• SOAP request usually uses the POST method for transferring the message irrespective of the operation being performed.The message include details about the method such as the argument.In contrast REST uses different verbs such as POST or GET for performing different operations.This is closer to the true nature of the HTTP protocol.
• WCF service can communicate with the client using the different protocols ,such as HTTP or TCP.But if we need to communicate with different types of clients ,such as mobile apps using only the HTTP protocol then using WCF may not provide any benefit.Rather there is an overhead for configuring the WCF service.We need to configure things like binding,address and the contracts even for simple services.
• WCF services provides features such as Transactions and Reliable sessions which is not what we always require for our HTTP services
• We can create REST services using WCF also but it is not a very easy process.

Some of the features provided by the ASP.NET WebAPI are

• There are two main components used in ASP.NET WebAPI
  HttpRequestMessage
  HttpResponseMessage                                                                                                                                                                 These objects allows the developer to directly work with the request and response in an object oriented way without being bothered with the low level request and response details.
• Content negotiation   means that the client and server agrees to the format of the information being interchanged ,this is done by using the accept HTTP header.For example to specify XML as the format of the information we can use the following                                                                                                                                        accept: application/xml
• Flexible hosting options WebAPI can be hosted using the following                                                                                   1)IIS     Service hosting will be provided by IIS                                                                                                       2)SelfHosted     we can host WebAPI service in a console application or in Windows service
• Stateless nature of web server One reason why REST services provides benefit is since the STATE information about an entity travels with the request and not maintained on the web server,the web server can support much more clients.In other words the web server is more scalable now.
• No dependency on System.Web  Unlike ASP.NET WebForms and MVC WebAPI is not dependent on the System.Web assembly.

Follow on:

Web applications of today have richer UI and are more user friendly than ever.For example user is informed about the action he performed immediately instead of waiting for a response from the server.To create such responsive applications javascript or other script files are required and in a typical web application there are many javascript files used .Also libraries such as AngularJS and Jquery uses javascript files for their own functionality.Style sheets are also extensively used for managing the styles applied to the different elements.

As a consequence of this there are lots of javascript and css files in a web application.To load each css and js file browser needs to make many requests to the server.These requests increases the load time of the web pages.To reduce the page load time bundling and minification is used.

Bundling  is the process of combining several resources such as javascript files or css files into a single downloadable unit.The impact of this is instead of making several different requests for a resource a bundle can be downloaded in a single request thus reducing multiple requests into a single request.

Minification Minification is a process which removes unnecessary characters from a resource such as javascript file thus reducing its size.For example from a javascript file it means removing the comments,line breaks and other characters which do not impact the functionality.If we remove an extra line the script will function as before but from the request point of view this means that now less data needs to travel from the server to the browser.

Bundling and minification are usually used together since they solve the common problem which is to reduce the page load time.

Steps for implementing bundling and minification

1)Install the Nuget package System.Web.Optimization.Add the System.Web.Optimization namespace to the cs file.This is installed by default when we create a new mvc application ,if we use any project template other than empty template.

We can add the Add the System.Web.Optimization namespace to the web.config or to the individual cs file

<add namespace=”System.Web.Optimization”/>

2)Enabling bundling and minification There are two ways for enabling bundling and minification in a MVC application

Add the following line in the RegisterBundles method of the BundleConfig class which is in App_Start folder
BundleTable.EnableOptimizations = true;

OR

Enable debug mode in web.config

<system.web>
<compilation debug="false" />
</system.web>

3)BundleConfig.cs file in the App_Start folder is used to create the bundles used in a application.RegisterBundles method in the BundleConfig.cs file is called from the Application_Start method of the Global.asax file.

If we look in the BundleConfig.cs file in the App_Start folder it contains these lines

public class BundleConfig
{
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));
}
}

Styles are represented by the StyleBundle class and scripts are represented by the ScriptBundle class.Once we create an object of these classes we can add the style sheets or the script files to the bundle collection.Constructors for these classes takes a parameter which is the url which refers to a virtual path used by the browser to request the bundle.To add the individual files to the bundle we use the Include() method.

4) Reference Bundles from the View

Once we have added the bundles to the BundleCollection we can reference the individual bundles from the views using the Scripts.Render() method.

@Scripts.Render(“~/bundles/jquery”)

In the Render method we reference the bundle using the virtual path of the bundle.

Reduces Number of requests and page size

If we run the default mvc application and see the requests in IE developer tools we can see the following requests.

If we run the same application after setting BundleTable.EnableOptimizations = true in  BundleConfig we can see that the number of requests made for the js files have reduced.Instead of six request we now have four requests for js and css files.There are three separate bundles for modernizr, jquery validation and  jquery base libraries.

For our custom js files we can even create a single bundle so that there will be a single request for all the js files.

Each Bundle has a Version number which is a hash value calculated based on the files in the bundle.Browser caches a bundle and loads it from the cache if the version number has not changed.If the version number has changed browser reloads the page.

This enables browser caching, if content of the bundle has not changed browser will take it from cache, which is much faster. In case of changes, new version token is generated, so browser would be forced to reload bundle from the server.

While bundling combines several resource files into a single file ,minification optimizes files by removing extra characters and performing other optimizations such as renaming variable names.So if we have a long variable name such as currentDateAndTime ,the long variable name will be renamed to something shorter such as n.

So using Bundling and Minification in MVC application is useful or reducing the page load time and should be used accordingly.

Follow on:

Model is an important component of any MVC application , the M in MVC , which represents the data and the business rules with which our application works.The Model component represents the business entities for our application’s domain by different Model classes.

So if our application manages Employees in an organization then the Model class to represent the employees may be represented by an Employee class.Our Model classes can consist of just the  properties representing the data or they can define the business rules as well.

The data which the user enters on the screen is assigned to the model properties in the controller.As this data is part of our business domain so it is important to validate it.User should be allowed to enter only the valid data.Allowing invalid data would sacrifice the integrity of our application and could make it unstable.So model validation should be a part of any MVC application.

Model validation means to validate the data our application works with.If the user enters any data incorrectly or doesn’t provides any required information then the user should be notified.

There are few different approaches by which we can perform the Model validation to verify if the data entered by the user is valid.Some of the ways we can validate the data are:-

• Explicitly validating the data in the action methods
• Using Data-annotation attributes to perform validation
• Using client side validation
• Defining custom validation attributes

Explicitly Performing validation in the action methods We can explicitly perform model validation in action methods. If any particular property is not valid as per the business rules defined for our application then we can add the error for that property to the ModelState property. Our controller inherits ModelState property from the base controller class.

We will be using the following employee class for our validation

public class Employee
{
public int EmpId { get; set; }
public string Name { get; set; }
public string Department { get; set; }
public string Address { get; set; }
public DateTime JoiningDate { get; set; }
public string Email { get; set; }
}

Though the above class defines just the properties we can also define methods for the business rules in our Model class.To perform validation we need to verify the property value. For example to make the Name property as mandatory we can add the following error message

if(string.IsNullOrEmpty(emp.Name))
 {
   ModelState.AddModelError("Name", "Please enter name");
 }

To add the error to the ModelState we use it’s AddModelError method.If there are any errors added to the ModelState then IsValid property value will be false ,which we can check to see the presence of any validation errors.

if (!ModelState.IsValid)
 return View();
      else
  return View("Completed");

If there are no validation errors then we return the “completed” view else we return the same view.

Property errors   We can specify the property errors by providing a key when adding the error message to the ModelState.

ModelState.AddModelError("Name", "Please enter name");

We can display the property errors in a view by passing false value to the @Html.ValidationSummary helper method.

@Html.ValidationSummary(false)

Model errors   We can specify the Model errors by leaving the key as empty when adding the error message to the ModelState.

ModelState.AddModelError("", "Model error");

We can display the Model errors in the view by passing true value to the @Html.ValidationSummary helper method.

@Html.ValidationSummary(true)

We create a strongly typed view for the Employee class and then just add the HtmlHelper method for validation as highlighted below.

@using (Html.BeginForm("Details", "Home"))
{
<table >
<tr>
<td colspan="2">@Html.ValidationSummary()</td>
<td> </td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.EmpId)</td>
<td>@Html.TextBoxFor(x=>x.EmpId) </td>
</tr>

<tr>
<td>@Html.LabelFor(x=>x.Name)</td>
<td>@Html.TextBoxFor(x=>x.Name) </td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.Department)</td>
<td> @Html.TextBoxFor(x=>x.Department)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.Address)</td>
<td>@Html.TextBoxFor(x=>x.Address)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.JoiningDate)</td>
<td>@Html.TextBoxFor(x=>x.JoiningDate)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.Email)</td>
<td>@Html.TextBoxFor(x=>x.Email)</td>
</tr>
<tr>
<td><input type="submit" name="submit" /></td>
</tr>
</table>
}

If we don’t enter the value in the Name field and submit the form then we get the error “Please enter name”.

Performing model validation using data annotations  We can attach the metadata to the model class using the  attributes in the System.ComponentModel.DataAnnotations  namespace.We can apply the attributes defined in this namespace to apply the validation rules for the class properties.For example we can make a property as mandatory using the Required attribute.

The important validation attributes defined in the System.ComponentModel.DataAnnotations namespace are:-

• Required    Ensures that the property value is mandatory
• StringLength    Ensures that the length of property lies between minimum and maximum values
• ReqularExpression    Ensures the value of a property is equal to the pattern specified by the regular expression
• Range      Ensures that the value of a property lies between the specified range
• Compare  Ensures value of a property is equal to the specified property value
• Url    Ensures that the value of a property is a valid URL.
• Email  Ensures that the value of a property is a valid email address.

In the following Employee class we have applied the Required,Range, Comapre,Url and EmailAddress attributes to the properties.

public class Employee
{
[Required]
[Range(2,4)]
public int EmpId { get; set; }
[Required]
public string Name { get; set; }
[Required]
public string Department { get; set; }
public string Address { get; set; }
public DateTime JoiningDate { get; set; }
public string Status { get; set; }
[EmailAddress]
public string Email { get; set; }
[EmailAddress]
[Compare("EmailAddress")]
public string ConfirmEmail { get; set; }
[Url]
public string Url { get; set; }
 }

We create the strongly typed view for the Employee class as below.We have added the validation HtmlHelper methods ValidationSummary() and ValidationMessageFor() for displaying the validation errors.

@using (Html.BeginForm("Details", "Home"))
{
<table >
<tr>
<td colspan="2">@Html.ValidationSummary()</td>
<td> </td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.EmpId)</td>
<td>@Html.TextBoxFor(x=>x.EmpId) @Html.ValidationMessageFor(x => x.EmpId)</td>
</tr>

<tr>
<td>@Html.LabelFor(x=>x.Name)</td>
<td>@Html.TextBoxFor(x=>x.Name) @Html.ValidationMessageFor(x => x.Name)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.Department)</td>
<td> @Html.TextBoxFor(x=>x.Department)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.Address)</td>
<td>@Html.TextBoxFor(x=>x.Address)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.JoiningDate)</td>
<td>@Html.TextBoxFor(x=>x.JoiningDate) @Html.ValidationMessageFor(x => x.JoiningDate)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.Email)</td>
<td>@Html.TextBoxFor(x=>x.Email) @Html.ValidationMessageFor(x => x.Email)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.ConfirmEmail)</td>
<td>@Html.TextBoxFor(x=>x.ConfirmEmail) @Html.ValidationMessageFor(x => x.ConfirmEmail)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.Status)</td>
<td>@Html.TextBoxFor(x=>x.Status)</td>
</tr>
<tr>
<td>@Html.LabelFor(x=>x.Url)</td>
<td>@Html.TextBoxFor(x=>x.Url) @Html.ValidationMessageFor(x => x.Url)</td>
</tr>

<tr>
<td><input type="submit" name="submit" /></td>
</tr>
</table>
}

In the page rendered by the Employee view we enter the values for the EmpId and Email fields and leave the other fields blank.

If we submit the form we will get the below validation errors.Please note that we have just applied the validation attributes to the model properties and the default validation messages are provided by these attributes.We have not written any validation code.Automatic model validation is an advantage of using the data annotations to validate the model.

Client Side validation The user entered data is validated on the client instead of the server.User is informed of the validation errors immediately instead of waiting for the response from the server.

To validate the model on the client we can follow the below steps

1) Enable the ClientValidationEnabled and UnobtrusiveJavaScriptEnabled keys in the appSettings section of the web.config.

<appSettings>
<add key="webpages:Version" value="3.0.0.0" />
<add key="webpages:Enabled" value="false" />
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>

2) Client validation uses the jquery validation library which we need to install.We can install the required javascript nuget packages using the following commands in the package manager console

Install-Package jQuery –version 1.10.2
Install-Package jQuery.Validation –version 1.11.1
Install-Package Microsoft.jQuery.Unobtrusive.Validation –version 3.0.0

3) Once we have the required javascript libraries we need to reference the them in the views.We can reference the following libraries in the layout view so that client validation can be used in all the views.

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>

4) We just need to apply the data annotation attributes to the model class and the validation will automatically happen on the client instead of the server now.

If we take the example of the employee class then once the reference to the javascript libraries is added and the form is submitted then the data is not posted back to the server ,instead user is notified of the errors immediately.The advantage of doing validation on the client is that it saves a trip to the server for performing validation.

Validation happens on the client 

Defining custom validation attributes We can create custom validation attribute by deriving from the ValidationAttribute class.ValidationAttribute is an abstract class which defines IsValid method.We can define our custom validation logic by implementing the IsValid method.

We can create a custom validation attribute for the Employee class as

public class ValidateEmplooyeeAttribute : ValidationAttribute
{
 protected override ValidationResult IsValid(object value, ValidationContext validationContext)
 {
 if (value != null)
 {
    Employee employee = value as Employee;
    if (string.IsNullOrEmpty(employee.Name) && (DateTime.Compare(employee.JoiningDate, DateTime.Now)<0))
 {
   return new ValidationResult("Please Enter a valid Name."); 
 }
  
 }
   return ValidationResult.Success;
 }
}

The above class verifies if the name is empty.If the name is empty it returns a ValidationResult object and passes  the error message as a constructor parameter.

The advantage of defining a custom validation attribute is that we can implement validation functionality not provided by the built in validation attributes.

So as we have seen there are different ways we can perform Model validation in our MVC application.We can select the most appropriate approach depending on the scenario.

Follow on:

Filters  

Filter is implemented as an attribute which defines the common functionality or the cross cutting concern.The logic contained in a filter executes when the action method with which the filter is attached executes.Common examples of such cross cutting concerns are the logging and the caching functionality .Logging is used across the different layers in an application so it makes sense to encapsulate such functionality.

Instead of duplicating such functionality across different action methods and controllers ,we can encapsulate the common functionality in a filter.So we define a filter once and then apply it to the different controllers and action methods.

We can apply a filter to an action method or to a controller,applying a filter to a controller has the same effect as applying the filter to each of the action methods in a controller.

So the following two code snippets are effectively the same :-

1)Attaching filter to a controller

In the following example we are attaching the HandleError filter to the Home Controller.

[HandleError]
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}

public ActionResult About()
{
return View();
}
}

2)Attaching filter to action methods in a controller

In the following example we are attaching the HandleError filter to each of the action methods in the Home Controller..

public class HomeController : Controller
{
[HandleError]
public ActionResult Index()
{
return View();
}
[HandleError]
public ActionResult About()
{
return View();
}
}

Different types of filters

Filters are classified in the following types according to the types of functionality which they provide and there sequence in the request processing pipeline. Also different filter types implements different interfaces.Filters and their execution sequence is as follows

• Authentication filters    Verifies if the request can execute the action method
• Authorization filters      Verifies if the request is Authorized to execute the action method
• Action filters       Provides functionality which is executed before and after the action method executes
• Result filters       Provides functionality which is executed before and after the action result executes
• Exception filters   Provides functionality which executes if an unhandled error occurs

The above filters are called in a sequence.So ,if we both the Authentication and the Authorization filters are attached to an action method ,the Authentication filter will be called before the Authorization filter 

Lets see how we can use the above filters

Authentication filter  is the first filter to execute and is used to authenticate the request.Authentication filter was introduced in MVC 5.

Authentication filter implements the filter IAuthenticationFilter interface which is defined as

 public interface IAuthenticationFilter
 {
void OnAuthentication(AuthenticationContext filterContext);
void OnAuthenticationChallenge(AuthenticationChallengeContext filterContext);
 }

OnAuthetication method is the first of all the filter methods which gets called.We can allow or deny access to the user making the request in this method.So this is the method in which we can implement our authentication policy.It is passed a parameter of the type AuthenticationContext. AuthenticationContext has a property Result of type ActionResult.

If we want to deny the access to action method for the current request then we can assign a HttpUnauthorizedResult object to the Result property as:-

public class AuthenticationAttribute : ActionFilterAttribute, IAuthenticationFilter
 {
public void OnAuthentication(AuthenticationContext filterContext)
{
filterContext.Result = new HttpUnauthorizedResult();
}
public void OnAuthenticationChallenge(AuthenticationChallengeContext filterContext)
 {
// filterContext.Result = new ViewResult();
 }
}

If we apply the AuthenticationAttribute to any action method the following login screen is displayed.As we have set the result property to HttpUnauthorizedResult type so the user is redirected to the login screen.

Authorization filter implements the IAuthorizationFilter interface which is defined as

public interface IAuthorizationFilter {
void OnAuthorization(AuthorizationContext filterContext);
}

Instead of creating a custom Authorization filter attribute ,there is a built in AuthorizeAttribute which we can use to define the authorization policy. This attribute has two important properties

• Users A comma separated list of users who are allowed to access the action method.
• Roles A comma separated list of roles which are allowed to access the action method.

The following Authorize attribute limits the access to the action method only to the user “user1”.

[Authorize(Users="user1")]
public ActionResult Index()
{
return View();
}

Action filter  We use action filters to define the functionality which we want to execute before an action method executes or after an action method executes.

Normally we define custom functionality using the Action filters.Though there are few built in Action filters also.OutputCache is an example of a built in action filter

Action filters implements the IActionFilter interface.This interface is defined as

public interface IActionFilter {
void OnActionExecuting(ActionExecutingContext filterContext);
void OnActionExecuted(ActionExecutedContext filterContext);
}

• OnActionExecuting  defines the functionality which we want to execute before the action method executes
• OnActionExecuted defines the functionality which we want to execute after the action method executes

So we can define an action filter by defining a class implemeting IActionFilter interface as:-

[AttributeUsage(AttributeTargets.Class | AttributeTargets.Method)]
public class ActionTestAttribute : FilterAttribute, IActionFilter
{
public void OnActionExecuted(ActionExecutedContext filterContext)
{
filterContext.HttpContext.Response.Write("Action method executed.");
}
public void OnActionExecuting(ActionExecutingContext filterContext)
{
filterContext.HttpContext.Response.Write("Action method going to execute </br>");
}
}

So we get the following response in browser if we apply the above filter attribute to any action method.

As we have implemented the OnActionExecuting  and OnActionExecuted methods so our filter logic executes before the action method executes and after the action method executes.

Result filter  Defines functionality which executes after the action result is returned by the action method.Result filters implement the interface IResultFilter which is defined as

public interface IResultFilter {
void OnResultExecuting(ResultExecutingContext filterContext);
void OnResultExecuted(ResultExecutedContext filterContext);
}

• OnResultExecuting     executes after the action result is returned by the action method but before the action result executes
• OnResultExecuted       executes after the action result completes execution.

Exception filter  We use exception filters to handle exceptions which are not handled in our action method.Exception filters implements the interface IExceptionFilter  which is defined as:-

public interface IExceptionFilter {
void OnException(ExceptionContext filterContext);
}

The OnException method is called when an unhandled exception occurs.

Instead of creating a class implementing the IExceptionFilter interface we can use the built in HandleError attribute. HandleError attribute defines the following two important properties

• ExceptionType   The type of exception the HandleError attribute will handle
• View     The view that is rendered if an unhandled error occurs.

To handle the ArgumentNullException we can apply the HandleError attribute as

[HandleError(ExceptionType=typeof(ArgumentNullException),View="CustomError")]
public ActionResult Details(int id)
{
return View();
}

If no value is passed for the action method’s id parameter then the view  specified in the View property will be displayed to the user.

Overriding the Controller base class methods

As we have seen above we can create custom filters  by creating an attribute and then attaching the attribute to the controller or the action method.Instead of explicitly defining the attributes implementing these interfaces we can directly implement the methods defined by these interfaces in the controller class.The controller class implements all the the different filter interfaces.

As the controller class implements these filter interface so it defines the methods declared by these interfaces.These methods are defined as virtual which we can override in our controller class :-

protected virtual void OnActionExecuted(ActionExecutedContext filterContext);
protected virtual void OnActionExecuting(ActionExecutingContext filterContext);
protected virtual void OnAuthentication(AuthenticationContext filterContext);
protected virtual void OnAuthenticationChallenge(AuthenticationChallengeContext filterContext);
protected virtual void OnAuthorization(AuthorizationContext filterContext);
protected virtual void OnException(ExceptionContext filterContext);
protected virtual void OnResultExecuted(ResultExecutedContext filterContext);
protected virtual void OnResultExecuting(ResultExecutingContext filterContext);

So instead of applying the action filter attributes to our action methods or the controller we can override the above methods in our controller class as:-

public class HomeController : Controller
{
protected override void OnActionExecuting(ActionExecutingContext filterContext)
{
// executes before the action method execution 
}

protected override void OnActionExecuted(ActionExecutedContext filterContext)
{
// executes after the action method executes
}

}

So we can use the different types of filters for implementing cross cutting concerns and avoid the code duplication.

Follow on: