Click here to Skip to main content
15,353,676 members
Articles / Web Development / ASP.NET
Posted 24 Jan 2010


39 bookmarked

7 Simple Steps to Run Your First Azure Blob Program

Rate me:
Please Sign up or sign in to vote.
4.59/5 (8 votes)
26 Feb 2014CPOL5 min read
7 simple steps to run your first Azure Blob Program

Table of Contents


In this section, we will create our first program using Azure blobs. This article creates a simple web page where we upload image files which are stored in Azure blobs. We have also created a simple search text box which will help us to search the image blobs with the image file name.

If you are really lazy like me, you can download my learn Azure Step by Step video which explain thoroughly all about Azure in step by step manner.

My Other Azure FAQ Articles

Step 1: Ensure You Have Things In Place

In case you are a complete fresher to Azure, please ensure you have all the pre-requisites in place. You can read this article to get the basic prerequisites.

Step 2: What Will We Do?

Azure Blobs help to store large items like files, in other words its file storage system. In this article, we will create a simple program to upload image files in Azure blob system.

Step 3: Create a Web Role

The first step is to a create a web role project. In case you are fresher in Azure, you can go through this article to understand how to create a web role project. So let’s create a simple project with name ‘BlobStorage’. Once you have created the project, it creates two projects one is the cloud service project and the other is the web role project. Cloud service project has all the necessary configuration needed for your cloud service project while the web role project is your ASP.NET project.

Image 1

Step 4: Set the Blob Connection String

Now the next step is to define a blob connection string in the service configuration file. So expand the ‘BlobStorage’ project, right click on roles and select properties.

Image 2

Once you select properties, go to settings tab and add the blob connection string as shown in the below figure. In the below figure, we have added blob connection string name as BlobConnectionString.

Image 3

Click on the right hand ellipse and select ‘Use development storage’. All the changes done using the setting UI will be reflected in the ‘ServiceConfiguration’ file as shown above.

Step 5: Create the Blob on Webrole Onstart

Now it’s time to start coding. Open the web role project and open ‘WebRole.cs’ file.

Image 4

Now let’s write code in the ‘onstart’ event to create the blob container.

public override bool OnStart()


Use the CloudStorageAccount static class to set the configuration environment.

public override bool OnStart()
// Set the configuration file
CloudStorageAccount.SetConfigurationSettingPublisher((configName, configSetter) =>

The next step is to get a reference of the cloudstorageaccount object using the blob connection string which was provided when you setup your web role project.

// get the blob connection string
CloudStorageAccount objStorage = 

Once we have access to the storage account object, use the blob end point to create the blob client.

// get the client reference
CloudBlobClient objClient = new CloudBlobClient
	(objStorage.BlobEndpoint, objStorage.Credentials);

Give a nice name to the container and create the container object using the client object which you have just created using the blob end point. Call the ‘CreateIfnotExist’ method of the container to ensure that you create the blob container only if it does not exist to avoid any errors.

// Get the reference to container
CloudBlobContainer objContainer = objClient.GetContainerReference("mycontainer");

// Create the container if it does not exist

Step 6: Code Your ASP.NET UI

The final step is to create the ASPX page which will help us upload image files in the blob container which we just created in the WebRole.cs file. You can see in the below figure that we have created a browse button which will help us upload image files and a search text box which will help us search blob files.

So create the below defined ASPX UI.

Image 5

In the above ASPX CS UI, first get the reference to the below specified name spaces.

using Microsoft.WindowsAzure;
using Microsoft.WindowsAzure.StorageClient;

In the file upload button, we need to insert the below code snippet to upload the file. So get access to the container object ‘MyContainer’ and call the ‘GetBlobReference’ function to get access to the cloud blob object.

// Get the storage account reference
CloudStorageAccount objStorage = 
// get the Client reference using storage blobend point
CloudBlobClient objClient = 
	new CloudBlobClient(objStorage.BlobEndpoint, objStorage.Credentials);
// Get Container reference
CloudBlobContainer objContainer = objClient.GetContainerReference("mycontainer");
// Get blob reference
CloudBlob obj =objContainer.GetBlobReference(FileUpload1.FileName.ToString());

Set the meta data of the cloud object and open a blob stream object to write the file. Do not forget to close the blob steam object once you are done.

// Set meta values
obj.Metadata["MetaName"] = "meta";
// Open a stream using the cloud object
BlobStream blobstream = obj.OpenWrite();
// Write the stream to the blob database
blobstream.Write(FileUpload1.FileBytes, 0, FileUpload1.FileBytes.Count());

Once we upload the file, we will browse through the blob list to get the list of blobs present in the container.

// Browse through blob list from the container
IEnumerable<IListBlobItem> objBlobList = objContainer.ListBlobs();
foreach (IListBlobItem objItem in objBlobList)
Response.Write(objItem.Uri + "<br>"); 

In the same UI, we have provided a search object to search a blob. To search a blob first get access to the container object and call the GetBlobReference function with the blob name to get a reference to the cloud object.

// Get the blob reference using the blob name provided in the search
CloudBlob obj = objContainer.GetBlobReference(txtSearch.Text);
BlobStream blobstream = obj.OpenRead();

Read the blob stream using the blob steam object and finally attach this stream with the Image object to display the same in the HTTP response.

// Create the image object and display the same on the browser response
System.Drawing.Image objimg=null;
objimg = System.Drawing.Image.FromStream(blobstream,true);
Response.ContentType = "image/gif";

Step 7: Run the Project and Enjoy

Finally enjoy your first blob program. You can see in the below figure that we have uploaded some image files in the blob.

Image 6

We can also search the blob using the search blob text box and you should be able to get the below image display from the blob database.

Image 7

For further reading do watch the below interview preparation videos and step by step video series.


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Comments and Discussions

QuestionWeb Role and Worker role Pin
bmulinti22-May-11 19:49
Memberbmulinti22-May-11 19:49 
QuestionHow do you created these images Pin
Jitendra Zaa18-May-10 21:01
MemberJitendra Zaa18-May-10 21:01 
AnswerRe: How do you created these images Pin
Shivprasad koirala18-May-10 21:43
MemberShivprasad koirala18-May-10 21:43 
GeneralRe: How do you created these images Pin
Jitendra Zaa18-May-10 21:45
MemberJitendra Zaa18-May-10 21:45 
QuestionSteps for deployment/usage in the actual Azure Blob? Pin
rghubert1-Apr-10 9:28
professionalrghubert1-Apr-10 9:28 
GeneralIf you are getting the exception " One of the request inputs is out of range.": Pin
p100017-Feb-10 7:18
Memberp100017-Feb-10 7:18 
GeneralConfiguring the blob container for public access. Pin
greghsr2-Feb-10 11:20
Membergreghsr2-Feb-10 11:20 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.