Click here to Skip to main content
15,885,767 members
Articles / Web Development / ASP.NET
Article

Uploading Multiple Files To Amazon S3 From ASP.NET App

26 Mar 2010CPOL4 min read 31.9K   3   1
The article explains how to add possibility to upload multiple files in one click to Amazon S3 hosting service into an ASP.NET application using Aurigma Image Uploader.

This article is in the Product Showcase section for our sponsors at CodeProject. These articles are intended to provide you with information on products and services that we consider useful and of value to developers.

Introduction

When you design an upload-enabled Web application you should decide for yourself where to store uploaded files. Here you can use your server equipment; hence, you have to take care about its scalability, reliability, and security. Another way is to use a third-party solution and do not worry about how your data will be stored. If you choose the second way, take a look at cloud storages; for instance, Amazon Simple Storage Service (Amazon S3). This service provides not only a physical storage but also a simple web services interface to store and retrieve any amount of data. Moreover, Amazon S3 supports POST, which allows uploading files and metadata directly to Amazon S3 from a client browser.

See details at http://aws.amazon.com/s3/.

Amazon S3 Basics

To get started with Amazon S3 you need to create an Amazon Web Services (AWS) account. Right after you do it you obtain your Access Key Id and Secret Access Key. These parameters are used for authentication purposes. Access Key Id identifies the AWS account and Secret Access Key is used to sign AWS requests. To store objects Amazon S3 uses buckets which are quite similar to Internet domain names and must be unique within the Amazon S3. For example, if the object named myphotos/holiday.jpg is stored in the mybucket bucket, then the URL to access this object is http://mybucket.s3.amazonaws.com/myphotos/holiday.jpg. Every bucket has an associated access control list (acl) used to verify whether a user is able to access this bucket. Each object represents a file and metadata stored within a bucket using a unique key. A bucket and key together uniquely identify each object stored in the Amazon S3.

Find Amazon S3 documentation at http://docs.amazonwebservices.com/AmazonS3/latest/index.html?UsingHTTPPOST.html.

Aurigma Image Uploader and Amazon S3

As it was mentioned above, Amazon S3 supports direct uploading via HTTP POST requests. It means that to create a new Amazon S3 object you need to send the POST request which identifies the sender and defines the object to be created. While working on module responsible for communication with AWS you have options: either you implement forming of HTTP requests manually or utilize some ready to use upload component. As an example of such component we consider Aurigma Image Uploader. If you are not familiar with this component read the ImagingEnabledSites.aspx topic first.

In a word, Aurigma Image Uploader is a cross-browser and cross-platform application (ActiveX control or Java applet) which sends user-specified files to a server in HTTP POST request. To make it possible to use Image Uploader for uploading to Amazon S3, the component is shipped with a special extender which adjusts the POST request to be compatible with Amazon S3.

Using Image Uploader with Amazon S3 extender frees you from necessary to know Amazon S3 API and prepare requests yourself. All you need is just to provide your AWS account and bucket details to Amazon S3 extender and define a file and metadata to be uploaded. Let’s see how it can be done.

Example

Let’s consider a simple demo written for ASP.NET in C#. It shows how to use Aurigma Image Uploader to upload files directly to Amazon S3.

  1. Create new ASP.NET web site (in Visual Studio 2008 menu File -> New -> Web Site...).
  2. Add ImageUploader and AmazonS3Extender controls to the toolbox. These components are implemented in the Aurigma.ImageUploader.dll which is located in Image Uploader installation folder (typically this is C:\Program Files\Aurigma\Image Uploader 6.5 Dual).
  3. Open your default.aspx in the design mode and drag and drop the ImageUploader and AmazonS3Extender items into the desired positions.
  4. Bind the AmazonS3Extender to ImageUploader via its identifier.
  5. Specify your authentication details (Access Key Id and Secret Access Key) and bucket as values of the corresponding properties.
  6. Set acl and key for Amazon S3 object to be created. Here you can use the ${filename} variable to specify a name of the user-selected file.
XML
<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" 
    Inherits="_Default" %>

<%@ Register Assembly="Aurigma.ImageUploader" 
    Namespace="Aurigma.ImageUploader.AmazonS3" TagPrefix="aur" %>
<%@ Register assembly="Aurigma.ImageUploader" 
    namespace="Aurigma.ImageUploader" tagprefix="aur" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Amazon S3 Demo</title>
</head>
<body>
    <form id="form1" runat="server">
        <aur:ImageUploader ID="ImageUploader1" runat="server" 
            height="400" width="600">
        </aur:ImageUploader>
        
        <aur:AmazonS3Extender ID="AmazonS3Extender1" runat="server" 
            ImageUploaderID="ImageUploader1" 
            AWSAccessKeyId="<%$ _AWSAccessKeyId %>"
            SecretAccessKey="<%$ _SecretAccessKey %>"
            Bucket="<%$ _Bucket %>"
            SourceFile-Acl="public-read"
            SourceFile-Key="${filename}">
        </aur:AmazonS3Extender>
    </form>
</body>
</html>

That’s all. Try to run this application and upload files to Amazon S3 directly from your browser.

Note, the _AWSAccessKeyId, _ SecretAccessKey, and _Bucket variables should contain valid Amazon Web Services account details. If you have not Amazon Web Services account, you can try this sample on the Image Uploader online demo (http://www.aurigma.com/Products/ImageUploader/OnlineDemo.aspx).

To learn more about Image Uploader, refer to its online documentation located at http://www.aurigma.com/docs/iu/; in particular, the http://www.aurigma.com/docs/iu/UploadingtoCloudStorage.htm topic provides the detailed information about cloud storages supported by Image Uploader.

Free trial version of Image Uploader can be downloaded from official site: http://www.aurigma.com/Products/ImageUploader/

License

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


Written By
Unknown
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.
This is a Organisation

1 members

Comments and Discussions

 
GeneralMy vote of 1 Pin
nishantsolanki22-Nov-10 3:43
nishantsolanki22-Nov-10 3:43 

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.