Building a Windows Azure App using Azure Queue, Azure Table and ASP.NET MVC Web Role

In this post, I will demonstrate a Windows Azure app using Azure Queue, Azure Table and a ASP.NET MVC 4 Web Role application. This post is explaining few initial steps for building a demo Azure app where asynchronous commands (write operations that changes the data) put into Azure Queue and an Azure Work Role will persist the data into Azure Table from Queue messages for the read operations. The source code is available from http://azurehack.codeplex.com/ .The demo application will modify and add more functionality on later.

Windows Azure Storage Services


The Windows Azure storage services provide the following services that are secure, scalable and easy to access that remain persistent and durable storage in the cloud.

Binary Large Object (BLOB) – BLOB service is the file system in the cloud which provide storage for large pieces of data, such as images, video, documents etc. BLOB is the simplest way to store text or binary data on Windows Azure.

Tables – Windows Azure Table Storage Service provides queryable structured storage.Table Storage service is very similar to NoSQL databases that lets you to massively scalable your apps.

Queues – Queue service provides reliable storage and delivery of messages and can be use for messaging between Web and Worker role instances.

Drives – Windows Azure Drive provides durable NTFS volumes for Windows Azure applications.

Demo Windows Azure App

In our demo app, all database write commands will be perform in an asynchronous way and these command messages will send  to Azure Queue.  A worker role will retrieve the Queue messages and will persist the data into Azure Table. The web role app is built with ASP.NET MVC 4. In this simple demo app, we are creating Customer entity data and these data will list  in a AS.NET MVC view page from a Azure Table. The request for creating a new Customer data will write a message to Azure Queue. The below class is representing the write command for creating new Customer

public class NewCustomerCommand : AzureQueueMessage
    {
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string Address { get; set; }
        public string Phone { get; set; }
        public string Email { get; set; }
    }

 

The new NewCustomerCommand is inherited from a  class AzureQueueMessage. The AzureQueueMessage class is the base class for the Azure Queue messages.The AzureQueueMessage class is shown below

public abstract class AzureQueueMessage
{
    public string Id { get; set; }
    public string PopReceipt { get; set; }
    public int DequeueCount { get; set; }
    public DateTime? InsertionTime { get;  set; }
    public DateTime? ExpirationTime { get; set; }
}

We are using strongly typed Azure Queue message. The below code block shows the contract type for our strongly type Azure Queue 

public interface IAzureQueue<T> where T : AzureQueueMessage
{
    void EnsureExist();
    void Clear();
    void AddMessage(T message);
    T GetMessage();
    T GetMessage(TimeSpan timeout);
    IEnumerable<T> GetMessages(int maxMessagesToReturn);
    void DeleteMessage(T message);
    void DeleteMessage(CloudQueueMessage message);
    void DeleteQueue();
    int ApproximateMessageCount { get; }
}

 

Creating Queue messages from ASP.NET MVC Controller

The below code block in the ASP.NET MVC action method will create the strongly typed queue message with type NewCustomerCommand. The write command NewCustomerCommand  is representing the operation for  creating a new Customer entity.

CloudStorageAccount account;
public CustomerController()
{
    account = CloudStorageAccount.
         FromConfigurationSetting("DataConnectionString");
}
[HttpPost]
public ActionResult Create(CustomerFormModel formModel)
{
if (ModelState.IsValid)
{
    AzureQueue<NewCustomerCommand> queue = new 
                        AzureQueue<NewCustomerCommand>(account);
    queue.AddMessage(new NewCustomerCommand
    {
        FirstName = formModel.FirstName,
        LastName = formModel.LastName,
        Address = formModel.Address,
        Phone = formModel.Phone,
        Email = formModel.Email
    });              
return RedirectToAction("Index");
}
 return View(formModel);
}

 

The class AzureQueue is a strongly typed Azure Queue. We are adding a message to the Queue with the information of  NewCustomerCommand. A worker role will look on the Queue message and will perform the operations for our command.

Processing Queue messages in Worker Role

The Worker Role is similar to a windows service and mainly using for background processing. In our application, we are using the Worker Role for processing the Queue message send from Web Role application. The Azure Queue is a great way to communicate between Web Role and Worker Role.

In the following code block in Worker Role, we are creating a strongly typed Queue with NewCustomerCommand and getting the unprocessed Queue messages from the Queue. After that, the data of the each Queue message is using for creating a Customer entity and will persist this data into Azure Table. The Table storage can be use for read operations of our application. We are deleting the Queue message after persisting the Customer entity into Azure Table.

var account = CloudStorageAccount.
FromConfigurationSetting("DataConnectionString");
AzureQueue<NewCustomerCommand> queue = new 
   AzureQueue<NewCustomerCommand>(account);
queue.EnsureExist();            
            
while (true)
{
try
{
 var message = queue.GetMessage();                    
 if (message != null)
  {
        
AzureTable<Customer> table = new AzureTable<Customer>(account);
    var guiid= Guid.NewGuid().ToString();
    table.AddEntity( new Customer
    {
        Id = Guid.NewGuid().ToString(),
        PartitionKey = guiid,
        RowKey = message.FirstName,
        FirstName = message.FirstName,
        LastName=message.LastName,
        Address=message.Address,
        Phone=message.Phone,
        Email=message.Email 
    });
    queue.DeleteMessage(message);
    }
    }
    catch { }
    Thread.Sleep(5000);
}

We are using a Azure Table entity Customer for persisting the Customer data. The Customer Table entity is shown below

public class Customer : TableServiceEntity
{
    public string Id { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string Address { get; set; }
    public string Phone { get; set; }
    public string Email { get; set; }
}

The Customer entity is inherited from TableServiceEntity for making the Customer entity as a Azure Table. The TableServiceEntity provides properties PartionKey, RowKey and Timestamp. The server manages the value of Timestamp, which cannot be modified. We need to update the values of PartitionKey and RowKey.The partition key is a unique identifier for the partition within a given table, specified by the PartitionKey property. The partition key forms the first part of an entity's primary key. The second part of the primary key is the row key, specified by the RowKey property. The row key is a unique identifier for an entity within a given partition. Together the PartitionKey and RowKey uniquely identify every entity within a table.

The AzureTable class is using for the all CRUD operations for Azure Table. The below code block shown the contract type of AzureTable class.

public interface IAzureTable<TEntity> where TEntity : TableServiceEntity
{
    IQueryable<TEntity> Query { get; }
    bool CreateIfNotExist();
    bool DeleteIfExist();
    void AddEntity(TEntity obj);
    void AddEntity(IEnumerable<TEntity> objs);
    void AddOrUpdateEntity(TEntity obj);
    void AddOrUpdateEntity(IEnumerable<TEntity> objs);
    void DeleteEntity(TEntity obj);
    void DeleteEntity(IEnumerable<TEntity> objs);
}

Reading the data in ASP.NET MVC App

We are showing the Customer data from Azure table and periodically refresh the data using Ajax. The following code in the ASP.NET MVC action method querying the data from Azure Table Customer.

public ActionResult Index()
{
  AzureTable<Customer> table = new AzureTable<Customer>(account);
  var customers = table.Query;
  if (Request.IsAjaxRequest())
  {
     return PartialView("_List", customers);
  }
 return View(customers);
}
 

Since our write command is working in an asynchronous way, we are refreshing the view page periodically using Ajax for latest data

@model IEnumerable<AzureHacks.Domain.Models.Customer>
@{
    ViewBag.Title = "Index";
}
<h2>Index</h2>
<p>
    @Html.ActionLink("Create New", "Create")
</p>
<div id="CustomerList">
@Html.Partial("_List", Model)
</div>
 <script type="text/javascript">
$(function () {
setInterval(function () {
 $.get('@Url.Action("Index")', {}, function (view) {
    $("#CustomerList").html(view);
  })
 },5000);
});
</script>

Source Code

The source code can be download from http://azurehack.codeplex.com/

Summary

This post is an initial step for building a demo app on the Windows Azure. We have discussed Azure storage services Queue and Table and explored the Worker Role for processing Queue messages. Azure Queue is a great way to communicate between Web Role and Worker Role. And the Azure Table is providing a great way to store massively scalable structured data that is available for querying the data. We are are performing our commands in an asynchronous way  and Azure Table is using for our read operations.

7 Comments

Comments have been disabled for this content.