Achindra Bhatnagar
Published © MIT

Capturing and Uploading Images to Azure Blob Storage

Completing the file upload story for Azure Fuctions Post.

IntermediateProtip6 hours5,396
Capturing and Uploading Images to Azure Blob Storage

Things used in this project

Story

Read more

Code

App.xaml

C#
<Application
    x:Class="PicUpload.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:PicUpload"
    RequestedTheme="Light">
    <Application.Resources>
        <x:String x:Key="SubscriptionKey">YOUR_COGNITIVE_SERVICE_KEY</x:String>
        <x:String x:Key="BaseURI">https://api.projectoxford.ai/face/v1.0/persongroups</x:String>
        <x:String x:Key="StoragePath">https://function073638f08fcd.blob.core.windows.net/</x:String>
        <x:String x:Key="StorageAccountName">function073638f08fcd</x:String>
        <x:String x:Key="StorageAccountKey">YOUR_STORAGE_ACCOUNT_KEY</x:String>
    </Application.Resources>

</Application>

Objects and Variables

C#
private static readonly string StorageAccountName = Application.Current.Resources["StorageAccountName"].ToString();
private static readonly string StorageAccountKey = Application.Current.Resources["StorageAccountKey"].ToString();
private static readonly StorageCredentials cred = new StorageCredentials(StorageAccountName, StorageAccountKey);

public static readonly string storagePath = Application.Current.Resources["StoragePath"].ToString();
public static readonly CloudBlobContainer blobContainer = new CloudBlobContainer(new Uri(storagePath + "originals"), cred);
public static readonly CloudBlobContainer thumbContainer = new CloudBlobContainer(new Uri(storagePath + "thumbnails"), cred);
        

Image File From Gallery

C#
        private async void btnPickFromFile_Click(object sender, RoutedEventArgs e)
        {
            FileOpenPicker filePicker = new FileOpenPicker();
            filePicker.SuggestedStartLocation = PickerLocationId.PicturesLibrary;
            filePicker.ViewMode = PickerViewMode.Thumbnail;

            filePicker.FileTypeFilter.Clear();
            filePicker.FileTypeFilter.Add(".jpeg"); filePicker.FileTypeFilter.Add(".jpg");
            filePicker.FileTypeFilter.Add(".png"); filePicker.FileTypeFilter.Add(".gif");

            StorageFile file = await filePicker.PickSingleFileAsync();
            if (null != file)
            {
                string blobFileName = await updateToBlob(file);
                AddFaceToPerson(blobFileName);
            }
        }

Image File From Camera

C#
        private async void btnPickFromCamera_Click(object sender, RoutedEventArgs e)
        {
            CameraCaptureUI dialog = new CameraCaptureUI();
            StorageFile file = await dialog.CaptureFileAsync(CameraCaptureUIMode.Photo);
            string blobFileName = await updateToBlob(file);
            AddFaceToPerson(blobFileName);
        }

Upload Image To Blob Storage

C#
        private async Task<string> updateToBlob(StorageFile file)
        {
            CloudBlockBlob blob = null;
            string filename = null;
            BitmapImage bitmapImage = new BitmapImage();
            IRandomAccessStream fileStream = await file.OpenAsync(FileAccessMode.Read);

            if (null != fileStream)
            {
                fileName = System.Guid.NewGuid() + "." + file.Name.Split('.').Last<string>();
                bitmapImage.SetSource(fileStream);
                
                // Show image in a image box - CapturedPhoto
                CapturedPhoto.Source = bitmapImage;
                
                await blobContainer.CreateIfNotExistsAsync();
                blob = blobContainer.GetBlockBlobReference(blobFileName);
                await blob.DeleteIfExistsAsync();
                await blob.UploadFromFileAsync(file);
            }
            return filename;
        }

Credits

Achindra Bhatnagar

Achindra Bhatnagar

20 projects • 161 followers
Windows Kernel Hacker, IoT Hobbyist, Enthusiast, Developer and Dreamer

Comments