テスターですが何か?

ホビープログラマ略してHPです

【日本語訳】Exploring Windows Azure Storage part9

leave a comment »

このエントリーはMSDNのチュートリアル「Exploring Windows Azure Storage」の「Task2 – Uploading Blob Data to Storage」の日本語訳になります。このコンテンツ、日本語訳全体については、こちらのエントリーを参照してください。

 

Task2 – Uploading Blob Data to Storage

このエントリーでは、メタデータを入力し画像ファイルをWindows Azure Storageへアップロードする機能を追加します。ページにはすでに画像に対するメタデータを入力するTextコントロールがあり、ローカルから画像を読み取りWebページへポストする asp:FileUpload コントロールがすでに存在しています。

 

1.Visual Studio のテキストエディターから、Default.aspx.cs / Default.aspx.vb ファイルを開きます。ソリューションエクスプローラーから、Default.aspx を右クリックし、[コードの表示]を選択します。

2.コードの最後に画像とメタデータを Windows Azure Blob Storage へ保存するメソッドを追加します。このメソッドでは画像とメタデータから blob を作成するために CloudBlobContainer オブジェクトの GetBlobReference メソッドを使用しています。

(コードスニペット – ExploringWindowsAzureStorage-Ex02-06-SaveImageMethod-CS)

        private void SaveImage(string id, string name, string description, string tags,
                                string fileName, string contentType, byte[] data)
        {
            // blobコンテナを作成し、画像のbyte配列をアップロードする
            var blob = this.GetContainer().GetBlobReference(name);
            blob.Properties.ContentType = contentType;

            // 画像のメタデータを作成する
            var metadata = new NameValueCollection();
            metadata["id"] = id;
            metadata["Filename"] = fileName;
            metadata["ImageName"] = string.IsNullOrEmpty(name) ? "unknown" : name;
            metadata["Description"] = string.IsNullOrEmpty(description) ? "unknown" : description;
            metadata["Tags"] = string.IsNullOrEmpty(tags) ? "unknown" : tags;

            // blobへデータを追加し、コミットする
            blob.Metadata.Add(metadata);
            blob.UploadByteArray(data);
        }

(コードスニペット – ExploringWindowsAzureStorage-Ex02-06-SaveImageMethod-VB)

    Private Sub SaveImage(id As String, name As String, description As String, tags As String,
                          fileName As String, contentType As String, data As Byte())

        ' blobコンテナを作成し、画像のbyte配列をアップロードする
        Dim blob = Me.GetContainer.GetBlobReference(name)
        blob.Properties.ContentType = contentType

        ' 画像のメタデータを作成する
        Dim metadata = New NameValueCollection
        metadata("id") = id
        metadata("Filename") = fileName
        metadata("ImageName") = If(String.IsNullOrEmpty(name), "unknown", name)
        metadata("Description") = If(String.IsNullOrEmpty(name), "unknown", description)
        metadata("Tags") = If(String.IsNullOrEmpty(name), "unknown", tags)

        ' blobへデータを追加し、コミットする
        blob.Metadata.Add(metadata)
        blob.UploadByteArray(data)

    End Sub

3.upload_Click メソッドに以下のコードを追加して、UploadImage ボタンクリックイベントハンドラーのコード完成させます。

(コードスニペット – ExploringWindowsAzureStorage-Ex02-07-UploadClickMethod-CS)

        protected void upload_Click(object sender, EventArgs e)
        {
            if (imageFile.HasFile)
            {
                status.Text = "Inserted [" + imageFile.FileName + "] - Content Type ["
                              + imageFile.PostedFile.ContentType + "] - Length ["
                              + imageFile.PostedFile.ContentLength + "]";
                this.SaveImage(
                    Guid.NewGuid().ToString(),
                    imageName.Text,
                    imageDescription.Text,
                    imageTags.Text,
                    imageFile.FileName,
                    imageFile.PostedFile.ContentType,
                    imageFile.FileBytes
                    );
                RefreshGallery();
            }
            else
            {
                status.Text = "No image file";
            }
        }

(コードスニペット – ExploringWindowsAzureStorage-Ex02-07-UploadClickMethod-VB)

    Protected Sub upload_Click(ByVal sender As Object, ByVal e As EventArgs)

        If imageFile.HasFile Then
            status.Text = (("Inserted [" & imageFile.FileName & "] - Content Type [") + _
                           imageFile.PostedFile.ContentType & "] - Length [") + _
                           imageFile.PostedFile.ContentLength.ToString() + "]"
            Me.SaveImage(Guid.NewGuid().ToString(), imageName.Text, imageDescription.Text,
                         imageTags.Text, imageFile.FileName, imageFile.PostedFile.ContentType,
                         imageFile.FileBytes)
            RefreshGallery()
        Else
            status.Text = "No image file"
        End If

    End Sub

このコードでは、metadataをTextコントロールと asp:FileUpload コントロールのプロパティから取得しています、asp:FileUpload コントロールには post されたファイルのcontent type、ファイル名、画像ファイルのバイト配列を取得することができます。そして SaveImage メソッドを呼び出し、Windows Azure Storageへ画像とメタデータを保存します。

4.F5キーを押下し、アプリケションをビルド、ブラウザに画像ギャラリーページを表示します。

5.Name, Description, Tags テキストボックスにメタデータを入力します。画像ファイルの選択には、[Browse]ボタンをクリックし、「\Source\Assets\Images」へ移動して1つ選択します。

image

図16.metadataを入力し、画像ともにblob storageへ保存する

6.[Upload Image]ボタンをクリックしデータを post します。ページがリフレッシュされ、画面下の ListViewに新しく追加された画像が表示されます。ステータスメッセージにファイル名、content type、アップロードしたファイルサイズが表示されます。この時点では画像のメタデータが表示されないことに気づくと思います。次のエントリーで、Windows Azure の blob に保存されたメタデータを取得して表示する機能を追加します。

image

図17.アップロードした画像がギャラリーに表示される

7.Visual Studioで Shift+F5 キーを押下してデバッグを終了、Compute エミュレーター上に配置されたアプリケーションを削除します。

 

次は、「Task3 – Retrieving Metadata for Blobs in Storage」です。

Written by david9142

2011年12月10日 @ 10:15 PM

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。