This is a migrated thread and some comments may be shown as answers.

Integrating RadUpload Control with Azure Blob Storage

22 Answers 266 Views
Upload (Obsolete)
This is a migrated thread and some comments may be shown as answers.
Daniel
Top achievements
Rank 1
Daniel asked on 13 Aug 2011, 03:05 AM
We're migrating to Azure and need to figure out how to configure the RadUpload control to write binary files (images specifically) to Azure Blob storage.  Can someone point me to documentation that demonstrates how to accomplish this? Thanks!

22 Answers, 1 is accepted

Sort by
0
Peter Filipov
Telerik team
answered on 17 Aug 2011, 12:18 PM
Hi Daniel,

Unfortunately RadUpload control doesn't support direct upload to Azure Blob Storage. After a postback, you can access the uploaded file through the UploadedFiles property of the RadUpload control and manipulate the files as you want.

Greetings,
Peter Filipov
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

0
Shaw
Top achievements
Rank 1
answered on 10 Jun 2012, 10:22 PM
Hello,

I had to do this today and wanted to post since seeing this thread.

This worked for me. You can remove the "DirectoryName" part if you don't need it.

<telerik:RadUpload ID="radUploader" runat="server"></telerik:RadUpload>
<telerik:RadButton ID="uploadBtn" runat="server" Text="Upload" onclick="uploadBtn_Click"></telerik:RadButton>

        protected void uploadBtn_Click(object sender, EventArgs e)
        {
            CloudStorageAccount cloud = CloudStorageAccount.Parse(cnStringStorage);
            CloudBlobClient client = cloud.CreateCloudBlobClient();

            CloudBlobContainer container = client.GetContainerReference(containerStr);
            container.CreateIfNotExist();

            CloudBlob blob = container.GetBlockBlobReference("DirectoryName/" + radUploader.UploadedFiles[0].FileName);
            blob.Properties.ContentType = radUploader.UploadedFiles[0].ContentType;
            blob.UploadFromStream(radUploader.UploadedFiles[0].InputStream);
        }
0
Peter Filipov
Telerik team
answered on 11 Jun 2012, 11:19 AM
Hello Shaw,

Thank you for sharing your solution.
Once the files are uploaded you can iterate through the UploadedFiles collection and apply your logic for every one of them.

Kind regards,
Peter Filipov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Hector Medrano
Top achievements
Rank 1
answered on 03 May 2013, 10:27 PM
Thanks Shaw..a year later but it helped out.
0
Chris Honselaar
Top achievements
Rank 1
answered on 08 Jun 2013, 12:35 PM
Shaw's approach works for small files.. but what about 2G+ video files that you want to upload in chunked fashion directly to Azure/S3? 

Has anyone got this to work easily with RadAsyncUpload?
0
Shinu
Top achievements
Rank 1
answered on 10 Jun 2013, 05:42 AM
Hi,

I have tried with RadAsycnUpload and here is the sample code.

C#:
protected void btnUpload_Click(object sender, EventArgs e)
 {
  if (radUpload.UploadedFiles.Count != 0)
  {
     try
     {
       foreach (UploadedFile file in radUpload.UploadedFiles)
       {
        string fileName = file.FileName;
        long fileSize = file.ContentLength;
        DateTime uploadedDate = System.DateTime.Now;
                         
       /*Blob Storage*/
        CloudStorageAccount storageAccount =  CloudStorageAccount.Parse(ConfigurationManager.ConnectionStrings["blobConnection"].ConnectionString);
        Microsoft.WindowsAzure.StorageClient.CloudBlobClient blobClient = storageAccount.CreateCloudBlobClient();
        Microsoft.WindowsAzure.StorageClient.CloudBlobContainer container = blobClient.GetContainerReference("filecontainer");
    // Create the container if it doesn't already exist.
        container.CreateIfNotExist();
        container.SetPermissions(new Microsoft.WindowsAzure.StorageClient.BlobContainerPermissions
        {
           PublicAccess = BlobContainerPublicAccessType.Blob
        });
            /*Save in timestamp format*/
       CloudBlockBlob blockBlob = container.GetBlockBlobReference(DateTime.Now.ToString("MM-dd-yy-HH:mm:ss").Replace(":", "") + "-" + fileName);
       targetFolder = radUpload.TargetFolder;
       path = Path.Combine(targetFolder, fileName);
       filePath = Server.MapPath(path);
       using (var fileStream = System.IO.File.OpenRead(filePath))
         {
            blockBlob.UploadFromStream(fileStream);
         }
       string fileNameToSave = DateTime.Now.ToString("MM-dd-yy-HH:mm:ss").Replace(":", "") + "-" + fileName;
       string pathToSave = string.Empty;
       foreach (IListBlobItem item in container.ListBlobs())
        {
         if (item.GetType() == typeof(CloudBlockBlob))
           {
            CloudBlockBlob pageBlob = (CloudBlockBlob)item;
             string uri = pageBlob.Uri.ToString(); // to access the saved path
           }
         }
  }

Thanks,
Shinu.
0
Peter Filipov
Telerik team
answered on 10 Jun 2013, 07:50 AM
Hi,

In order to upload files to cloud storage we decided to create a new control which is called RadCloudUpload. The new component will be with high priority in our road map for Q3.2013. Here you could give us some feedback.

Regards,
Peter Filipov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Jason
Top achievements
Rank 1
answered on 10 Jun 2013, 12:28 PM
Hi Shinu,

Does your sample code handle chunked uploads for large files? I thought we have to create our own AsyncUploadHandler to handle large files like 1 GB.

Thanks,
Jason
0
Chris Honselaar
Top achievements
Rank 1
answered on 10 Jun 2013, 01:31 PM
@Shinu - Thanks, but this does not really help with large files, or a typical Azure scenario (ie. multiple web role instances). Even if it did, it would still involve the web server unnecessarily - effectively doubling transfer and load.
0
Chris Honselaar
Top achievements
Rank 1
answered on 10 Jun 2013, 01:35 PM
@Peter, thanks, but this was already on the roadmap for the Q2 release (and has been on the overall radar for 4 years).
We need a solution right now, so RadUpload/RadAsyncUpload is effectively out.
0
Jason
Top achievements
Rank 1
answered on 10 Jun 2013, 02:34 PM
This link has an example of an AsyncUploadHandler for Azure blobs, but calls methods which are not in the code snippet. It would be good to have a downloadable demo which works completely.
0
Peter Filipov
Telerik team
answered on 12 Jun 2013, 06:41 AM
Hello,

Unfortunately for the upcoming release Q2.2013 we are not going to introduce any upload to cloud storage functionality. Could you please give us some feedback about what kind of features do you want to see in  the new RadCloudUplaod control? First we want to create a module which will upload the files from the client side to a handler and then to the storage because if the upload is directly from the client side it is possible some to get your signed URL and use it.

Regards,
Peter Filipov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Chris Honselaar
Top achievements
Rank 1
answered on 12 Jun 2013, 10:05 AM
@Peter - you would be working with Shared Access Signatures and temporary security credentials in ABS and Amazon S3 respectively I assume. These mechanisms are time limited and use pre-signed access URLs that are created securely on the server prior to displaying the upload control.
The actual upload process can then proceed without involving the server at all.

For added security, you could implement restricted policies on the container/bucket used for the upload.
0
Paul
Top achievements
Rank 1
answered on 12 Jun 2013, 07:24 PM
Here's a link to an excellent article pertaining to "chunked" file uploads to Azure Blob Storage.  I believe this is what others are looking for, as am I, with the RadAsyncUpload control (or RadCloudUpload).

http://gauravmantri.com/2013/02/16/uploading-large-files-in-windows-azure-blob-storage-using-shared-access-signature-html-and-javascript/

BTW - CORS support for Azure is coming.  In fact, it may already be here.  If not, I sure wish MSFT would hurry up.  Amazon already supports CORS.
0
Chris Honselaar
Top achievements
Rank 1
answered on 12 Jun 2013, 07:35 PM
@Paul, great find! Thanks. That is exactly how it should work.

There would need to be some kind of fall-back for non-HTML5 File API enabled browsers, and S3 support etc, but this is basically why I had hoped Telerik would have added Cloud support by now.
0
Paul
Top achievements
Rank 1
answered on 12 Jun 2013, 07:59 PM
@Chris - Thanks!  I agree, a fall back for non HTML 5 clients would be nice, if possible.  I would have already implemented such a strategy for a product in development (and nearing completion) if not for Azure's lack of CORS support.  This upload mechanism is one of the last things on our "TO DO" list.  I don't see any reason to reinvent the wheel assuming Azure and Telerik can produce something in the very near future.  Fingers are crossed.  I need this ASAP.  It sounds as if others are in a similar boat.
0
Chris Honselaar
Top achievements
Rank 1
answered on 12 Jun 2013, 08:03 PM
0
Paul
Top achievements
Rank 1
answered on 12 Jun 2013, 08:19 PM
Sweet!  This is cause for a celebration!  Thanks for the heads-up.
0
Peter Filipov
Telerik team
answered on 17 Jun 2013, 07:30 AM
Hello guys,

I will summarize our plan for the RadCloudUpload control. First, we are to implement upload from a handler to a particular storage. With this we are going to cover all browsers and the ability to implement own storage providers and upload files to a custom location.
Next step will be the implementation of a client-side upload. The control will directly upload files with javascript to a particular storage.

Regards,
Peter Filipov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Brian
Top achievements
Rank 2
answered on 17 Sep 2013, 04:58 PM
Is there an update on this? Is there a beta available?
0
Peter Filipov
Telerik team
answered on 20 Sep 2013, 11:39 AM
Hello Brian,

Next week we are going to introduce the new control - RadCloudUpload. Please stay tuned and send us your feedback.

Regards,
Peter Filipov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Brian
Top achievements
Rank 2
answered on 20 Sep 2013, 12:05 PM
That is excellent news!
Tags
Upload (Obsolete)
Asked by
Daniel
Top achievements
Rank 1
Answers by
Peter Filipov
Telerik team
Shaw
Top achievements
Rank 1
Hector Medrano
Top achievements
Rank 1
Chris Honselaar
Top achievements
Rank 1
Shinu
Top achievements
Rank 1
Jason
Top achievements
Rank 1
Paul
Top achievements
Rank 1
Brian
Top achievements
Rank 2
Share this question
or