Como usar o Cloud Storage com o .NET

Nesta parte do tutorial do Bookshelf em .NET, mostramos como armazenar imagens no Cloud Storage.

Esta página é parte de um tutorial com várias páginas. Para ver do início e ler as instruções de configuração, consulte o artigo App Bookshelf em .NET.

Como criar um intervalo do Cloud Storage

Veja nas instruções a seguir como criar um intervalo do Cloud Storage. Intervalos são os contêineres básicos que armazenam dados no Cloud Storage.

  1. Em uma janela de terminal, digite o seguinte comando:

    gsutil mb gs://[YOUR-BUCKET-NAME]

    Em que:

    • [YOUR-BUCKET-NAME] representa o nome do intervalo do Cloud Storage.
  2. Para visualizar imagens carregadas no aplicativo Bookshelf, defina a lista de controle de acesso (ACL, na sigla em inglês) padrão do intervalo como public-read.

    gsutil defacl set public-read gs://[YOUR-BUCKET-NAME]

    Como definir configurações

    1. No diretório getting-started-dotnet\aspnet\3-binary-data, clique duas vezes em 3-binary-data.sln para abrir o aplicativo de amostra no Visual Studio.

    2. No painel Gerenciador de soluções, clique em Web.config

    3. Em Web.config, conclua as etapas a seguir:

      1. Defina GoogleCloudSamples:ProjectId como código do projeto.

      2. Defina GoogleCloudSamples:BookStore com o mesmo valor usado na etapa Como usar dados estruturados deste tutorial.

      3. Se você usou o Cloud SQL ou o SQL Server na etapa de dados estruturados, localize o elemento XML <connectionStrings> e defina connectionString com o mesmo valor usado naquela etapa.

      4. Defina GoogleCloudSamples:BucketName como o nome do intervalo do Cloud Storage criado anteriormente.

    4. Salve e feche Web.config.

    Execução do app na máquina local

No Visual Studio, pressione F5 para executar o projeto. Agora é possível navegar pelas páginas da Web do aplicativo para adicionar, editar e excluir livros com imagens de capa.

Como implantar o app no Compute Engine

  1. No painel Gerenciador de soluções do Visual Studio, clique com o botão direito do mouse em 3-binary-data e depois selecione Publicar.

    Publicar app

  2. Crie um novo perfil personalizado, como você fez na parte Como usar o Cloud Datastore deste tutorial.

  3. Clique em Publicar.

Estrutura do app

Exemplo de estrutura de dados binários

O aplicativo usa o Google Cloud Storage para armazenar dados binários (neste caso, imagens). Ele continua usando um banco de dados estruturado para as informações de livros: Cloud Datastore, Cloud SQL ou SQL Server. O navegador busca imagens diretamente do Cloud Storage.

Como entender o código

Esta seção analisa o código do aplicativo e explica como ele funciona.

Como processar uploads de usuário

O formulário tem uma nova tag <input type="file"> para que o usuário possa fazer upload de um arquivo.

<div class="form-group">
    @Html.Label("Cover Image")
    <input type="file" id="image" name="image" value="@Model.Book.ImageUrl" class="form-control">
    @Html.HiddenFor(model => model.Book.ImageUrl)
</div>

Upload para o Cloud Storage

O método BooksController.Create() faz upload da imagem.

// POST: Books/Create
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> Create(Book book, HttpPostedFileBase image)
{
    if (ModelState.IsValid)
    {
        _store.Create(book);
        // If book cover image submitted, save image to Cloud Storage
        if (image != null)
        {
            var imageUrl = await _imageUploader.UploadImage(image, book.Id);
            book.ImageUrl = imageUrl;
            _store.Update(book);
        }
        return RedirectToAction("Details", new { id = book.Id });
    }
    return ViewForm("Create", "Create", book);
}

A classe ImageUploader chama a API do Google.Apis.Storage.v1.ClientWrapper.StorageClient para fazer upload da imagem.

_storageClient = StorageClient.Create();
        public async Task<String> UploadImage(HttpPostedFileBase image, long id)
        {
            var imageAcl = PredefinedObjectAcl.PublicRead;

            var imageObject = await _storageClient.UploadObjectAsync(
                bucket: _bucketName,
                objectName: id.ToString(),
                contentType: image.ContentType,
                source: image.InputStream,
                options: new UploadObjectOptions { PredefinedAcl = imageAcl }
            );

            return imageObject.MediaLink;
        }

Exibição de imagens do Cloud Storage

Como o app tem o URL público da imagem, é simples exibi-la. Vale a pena fazer isso direto do Cloud Storage porque as solicitações aproveitam a infraestrutura de exibição global do Google e o aplicativo não precisa responder a solicitações de imagens. Isso libera ciclos de CPU para outras solicitações.

<img class="book-image"
     src="@(String.IsNullOrEmpty(Model.ImageUrl) ?
"http://placekitten.com/g/128/192" : Model.ImageUrl)">
Esta página foi útil? Conte sua opinião sobre:

Enviar comentários sobre…