Using ASP.NET Web API for streaming pictures

ASP.NET Web API 2.0 provides various new features and one of which is Attribute Routing. Attribute routing allows custom configuration for routing by assigning attribute to the web method.

Get latest version of ASP.NET Web API 2.0 via Nuget package

Install-Package Microsoft.AspNet.WebApi.WebHost

Update WebApiConfig to include config.MapHttpAttributeRoutes()

 public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            config.MapHttpAttributeRoutes();

            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }
    }

The [HttpGet] attribute defines an HTTP GET method. Now create RESTful endpoint using web api

[HttpGet("api/invoice/scan/{id}")]
public HttpResponseMessage GetScannedInvoiceById(string id)
{
 HttpResponseMessage result = new HttpResponseMessage();
 string isPath = GetInoviceScanPath(id);
        result.Content = new StreamContent(new FileStream(isPath, FileMode.Open));
 result.Content.Headers.ContentType = new MediaTypeHeaderValue("image/png");
 return result;
}

http://localhost/csharptechies/api/invoice/scan/1908765 will now get the image as HttpResponseMessage.

Apart from using attributes to define an uri for controller methods, Route Prefixes can be defined as a controller attribute that will become base uri for for all of the controller methods.

Do you realize if it weren't for Edison we'd be watching TV by candlelight.
Al Boliska

Continue Reading

Server Side MVC vs Client Side MVC

MVC (Model–view–controller) is an architecture patterns that addresses separation of concerns, test driven development, statelessness, extensibility, SEO, REST and many more. Choosing MVC pattern for developing web application is a very easy decision, but that is just the beginning. Rest of decision is deciding how to design, develop and implement the web application.Now deciding on "Server Side MVC" or "Client Side MVC" is not any easy job as there are number of options available.

Server Side MVC

Overview

Server side MVC is a combination of server-side framework and javascript/jquery. There are various server-side framework's available depending on the platform you are developing. Here is a list of few of them

• ASP.NET MVC
• Ruby on Rails MVC
• Java MVC
• PHP MVC
• Perl MVC

Why

Various benefits of using Server Side MVC are

• Mature (been there for year)
• Routing decided by Server
• Server renders the views
• Server binds model to views
• View request can return html, json, xml, text, binary etc
• CRUD managed by Controller & Data Models on Server
• Code security
• Routing decided on application start
• Supports multi-page application

Client Side MVC

Overview

Client Side MVC is a combination of js frameworks and REST API. Partially still relies on server side application for providing REST API. There are various client-side framework's available depending on your choice of coding style. Here is a list of few of them

• Backbone.js
• Ember.js
• Knockout.js
• AngularJS
• Dojo
• Agility.js
• Knockback.js

Why

• Recently introduced but got more attention now (look at the list of examples where backbone.js is used
• Routing decided by Client
• Client renders the views
• Client binds model to views via javascript frameworks
• Uses REST API for getting data from server
• CRUD managed by Controller & Data Models on Client via REST API
• Started with single-page application, but now various frameworks support multi-page application
• Routing can be modified dynamically as it is maintained on client

Look at TODO MVC for more options on Client Side MVC.

Also you could use mixture of both Server Side MVC and Client Side MVC. I have used this combination ASP.NET MVC + KnockoutJS on Techcipher.

Think? Why think! We have computers to do that for us.
Jean Rostand

Continue Reading

Streaming millions of rows as a csv in ASP.NET MVC

Generating reports using the data from the database is something any project will generally have, but to be able to actually download all of the data as a csv is not easy. Not just thousands of rows but if database has millions of rows then challange will be to decide best approach. Consider following approaches

1. Generate the report on server and then stream the file to clients machine

2. Stream data in batches onto client machine

First approach is not a good idea as there is no feedback to the user when download will actually start, but with second option user will actually see the streaming immediately.

So let's look at option 2 and how that can be achieved

1. Define a custom result that derives from FileResult

public class CsvResult : FileResult
{
   protected override void WriteFile(HttpResponseBase response)
   {
            response.Clear();
            response.ClearContent();
            response.BufferOutput = false;
            var streamWriter = new StreamWriter(response.OutputStream, Encoding.UTF8);
            //write the header line first
            streamWriter.WriteLine("InvoiceDate,InvoiceNumber,Quantity,Price");
            long count = GetInvoiceRecCount();
            
            long batchSize = 10000;
            long numberOfBatches = count / batchSize;
            long startRow = 0;
            for (int i = 0; i < numberOfBatches; i++)
            {
                startRow = i * batchSize;
                //Get batch of rows
                var invoiceRows = GetInvoiceRows(startRow, batchSize);
                foreach(DataRow row in invoiceRows)
                {
                    //write data 
                    streamWriter.WriteLine(dataLine);
                }

                streamWriter.Flush();
            }

            if (startRow + batchSize < count)
            {
                batchSize = count - startRow;
                //Get batch of rows
                var invoiceRows = GetInvoiceRows(startRow, batchSize);
                //write final batch
                foreach (DataRow row in invoiceRows)
                {
                    //write data 
                    streamWriter.WriteLine(dataLine);
                }

                streamWriter.Flush();
            }
   }

}

2. Now write controller action

public ActionResult ExportInvoicesToCsv()
{
   CsvResult csvResult = new CsvResult();
   csvResult.FileDownloadName = "InvoiceReport.csv";
   return csvResult;
}

And that's it all done. Now when user tries to download millions of rows as csv they are batches in the size of 10000 and will be streamed to users machine.

Technology is just a tool. In terms of getting the kids working together and motivating them, the teacher is the most important.
Bill Gates

Continue Reading

Enabling HTTP Handler to render in IE Compatibility mode

HTTP handlers are generally used for download a file, show an image, or even to show a report (ie.. generated as html at runtime and stream it through)

Now consider your html report was generated and now all you need to do is show through your website using ASP.NET http handler. Opening the report html just show all the formatting properly but via http handler some of styles were not correctly applied.

To resolve this you have got 2 options
- Modify your CSS to render it properly
- Force your handler to render in compatibility mode

In order to force your handler to render in compatibility mode all you need is to just add a header

for eg you can force usage of IE8

Response.AddHeader("X-UA-Compatible", "IE=EmulateIE8");

or use microsoft standard. Refer to microsoft article "Specifying legacy document modes"

Response.AddHeader("X-UA-Compatible", "IE=edge");

Be nice to nerds. Chances are you'll end up working for one.
Bill Gates, Microsoft

Continue Reading

Using Selenium WebDriver to simulate button click for ASP.NET Webforms application that uses DevExpress Controls

First lets create a simple ASP.NET Web application that uses DevExpress controls. I have created a test.aspx page that has got 2 buttons

Code behind (test.aspx.cs)

protected void TestMe_Click(object sender, EventArgs e)
{
  Response.Redirect("success.aspx");
}

protected void TestMe2_Click(object sender, EventArgs e)
{
  Response.Redirect("Fail.aspx");
}

Now here is the snippet of code that can be used to simulate button click

WebDriver driver = new InternetExplorerDriver(@"C:\selenium\selenium-dotnet-2.33.0\IEDriverServer_x64_2.33.0");
driver.Navigate().GoToUrl("http://localhost/test/Test.aspx");
IJavaScriptExecutor js = driver as IJavaScriptExecutor;
var result = js.ExecuteScript("TestMe.click();");
//or
IWebElement btn = driver.FindElement(By.Id("TestMe"));
btn.Click();

Use this Quick Start guide to setup your machine for testing ASP.NET Web applications. For more detailed or complete understanding goto Selenium WebDriver

Nearly all men can stand adversity, but if you want to test a man's character, give him power. Abraham Lincoln

Continue Reading

Live tiles with Bootmetro and Metro JS

Bootmetro is a simple web ui framework which I have used on my website TechCipher. There are various samples inside Bootmetro for implementing various type of tiles but not for live tiles. This article will give you insight of how live tiles can be implemented with Bootmetro and Metro JS. 1. Define tile

       
  

   Latest Updates
   
Bootmetro is a simple web ui framework
   
TechCipher is all about exploring technologies available to date
  
     

2. Add references to MetroJs (css and js)

..

3. Finally make your tile live

Now this is how it would look

That's it.

“Before software should be reusable, it should be usable.” – Ralph Johnson

Continue Reading

Input string was not in a correct format exception thrown by DevExpress controls

Recently I have stumped upon an exception thrown by DevExpress controls and this is trace :

2013-06-04 15:29:37.9138   6: csdrtg55bpufcimx3dm2o145 Error:global_asax threw EXCEPTION: Input string was not in a correct format.
2013-06-04 15:29:37.9138   6: csdrtg55bpufcimx3dm2o145    SOURCE:mscorlib 
2013-06-04 15:29:37.9138   6: csdrtg55bpufcimx3dm2o145    METHOD:StringToNumber 
2013-06-04 15:29:37.9138   6: csdrtg55bpufcimx3dm2o145    STACK is as follows:
   at System.Number.StringToNumber(String str, NumberStyles options, NumberBuffer& number, NumberFormatInfo info, Boolean parseDecimal)
   at System.Number.ParseInt32(String s, NumberStyles style, NumberFormatInfo info)
   at System.Int32.Parse(String s)
   at DevExpress.Web.ASPxEditors.ListEditItemsSerializingHelper.ParseItemIndex(String serializedItem, Int32& startPos)
   at DevExpress.Web.ASPxEditors.ListBoxItemsSerializingHelper.DeserializeItems(String serializedItems, Boolean sortRequired)
   at DevExpress.Web.ASPxEditors.ListBoxProperties.SynchronizeItems(String serializedItems, Boolean isInsertingSyncType)
   at DevExpress.Web.ASPxEditors.ASPxComboBox.SynchronizeItems(NameValueCollection postCollection)
   at DevExpress.Web.ASPxEditors.ASPxComboBox.LoadPostData(NameValueCollection postCollection)
   at DevExpress.Web.ASPxClasses.ASPxWebControl.LoadPostDataInternal(NameValueCollection postCollection, Boolean raisePostDataEvent) 
2013-06-04 15:29:39.7810   6: csdrtg55bpufcimx3dm2o145 Callback error message : Input string was not in a correct format. 

Everything works fine If I debug the code and I am not able to see any exception been thrown. So made so many changes to code to see cause of failure but finally gave up. Then realised that visual studio allows you to catch CLR exceptions and here are the steps I have taken to find out the culprit :
1. First disable "Just My Code".
Tools -> Options



2. Enable CLR exceptions
Debug -> Exceptions



3. Now start debugging the code and skip all exceptions until you reach the exception that you are looking for.

4. After seeing the exception that you are looking for, use "Ok" button not "Continue" button.

5. Now see call stack window



6. You will have enable "Parameter Names" to see the control name that has caused the issue



Now your callstack should show something like this



Callstack will show you the control name and its data that has caused the failure.

Man is the best computer we can put aboard a spacecraft... and the only one that can be mass produced with unskilled labor. ~Werner von Braun

Continue Reading