Saya sering menjumpai pertanyaan bagamana cara menyimpan image/file di Azure Website. Pada artikel ini saya ingin mencoba untuk menjawab pertanyaan tersebut, saya akan membuat sebuah aplikasi ASP.NET MVC yang mempunyai fasilitas untuk upload image. Aplikasi tersebut akan saya hosting di Windows Azure Website, dan file image akan disimpan pada Azure Storage.
1. Langkah pertama yang harus dilakukan adalah membuat azure storage baru pada windows azure.
2. Kemudian catat access keys yang nanti akan kita gunakan untuk menyimpan data ke azure storage.
3. Kemudian buat project ASP.NET MVC dengan nama ‘SampleWebBLOB’
4. Pada HomeController tambahkan satu action method baru dengan nama ‘ViewImage()’
1: public ActionResult ViewImage()
2: {
3: return View();
4: }
5. Kemudian tambahkan view dengan nama ViewImage.cshtml untuk membuat form upload image
1: <h2>Upload Gambar</h2>
2:
3: <br />
4: @using(Html.BeginForm("ImageUpload","Home",FormMethod.Post,
5: new{enctype="multipart/form-data"}))
6: {
7: <div>Please Select Image to Upload :</div>
8: <input type="file" name="image"/><input type="submit" value="Upload Image"/>
9: }
6. Tambahkan beberapa referensi library yang digunakan untuk upload ke BLOB storage.
7. Untuk proses upload file dan menambahkan ke BLOB storage di Windows Azure tambahkan action method baru pada HomeController.
1: [HttpPost]
2: public ActionResult ImageUpload()
3: {
4:
5: var image = Request.Files["image"];
6: if(image==null)
7: {
8: ViewBag.UploadMessage = "Gagal upload image";
9: }
10: else
11: {
12: ViewBag.UploadMessage = string.Format("Berhasil upload {0} dengan tipe {1} dan ukuran {2}",
13: image.FileName, image.ContentType, image.ContentLength);
14:
15: //bagian upload ke azure storage
16:
17: //koneksi
18: var storageAccount = CloudStorageAccount.Parse(
19: ConfigurationManager.ConnectionStrings["StorageConnection"].ConnectionString);
20:
21: //membuat container
22:
23: CloudBlobClient blobStorage = storageAccount.CreateCloudBlobClient();
24: CloudBlobContainer container = blobStorage.GetContainerReference("itemimage");
25: if(container.CreateIfNotExist())
26: {
27: var permission = container.GetPermissions();
28: permission.PublicAccess = BlobContainerPublicAccessType.Container;
29: container.SetPermissions(permission);
30: }
31:
32: //save image to the container
33: string uniqueBlobName = string.Format("itemimage/image_{0}{1}",
34: Guid.NewGuid().ToString(), Path.GetExtension(image.FileName));
35: CloudBlockBlob blob = blobStorage.GetBlockBlobReference(uniqueBlobName);
36: blob.Properties.ContentType = image.ContentType;
37: blob.UploadFromStream(image.InputStream);
38:
39: ViewBag.MyImage = blob.Uri.ToString();
40: }
41:
42: return View();
43: }
8. Kemudian tambahkan web.config untuk connection string ke BLOB storage di Windows Azure.
9. Kemudian publish aplikasi tersebut ke Windows Azure (cara publish aplikasi ASP.NET MVC ke Windows azure dapat dibaca pada artikel saya berikut.)
10. Hasil dari aplikasi ini ketika sudah diupload ke Windows Azure.
11. Anda juga dapat melihat file gambar yang berhasil diupload pada container di azure storage.
Dari artikel diatas dapat disimpulkan bahwa cukup mudah untuk menyimpan file ke azure blob storage. Pada artikel selanjutnya akan dibahas bagaimana membuat web services REST dengan ASP.NET Web API dan kemudian memasangnya di Windows Azure.
Erick Kurniawan 