O objetivo deste artigo é demonstrar como desenvolver uma aplicação ASP.NET MVC com acesso ao Azure SQL Database, utilizando para isso o Entity Framework. Serão demonstradas aqui os passos necessários para implementar todo o projeto, desde a criação do banco de dados na nuvem, até a publicação da aplicação no Azure App Services.

Introdução

O Azure SQL Database é uma opção de banco de dados baseada no SQL Server e hospedada na nuvem. Portanto, se mostra como uma alternativa escalável com a qual é possível desenvolver soluções de software capazes de lidar com grandes volumes de dados, em um ambiente que oferece facilidade de implantação e gerenciamento: o Microsoft Azure. Portanto, esse artigo é útil para quem trabalha com o ASP.NET MVC e o SQL Server, e deseja migrar seus projetos (ou mesmo desenvolver novos) total ou parcialmente para a plataforma de nuvem da Microsoft.

Criando o banco de dados

Diferentemente do que ocorre quando precisamos configurar um novo servidor do SQL Server em ambiente local, aqui não precisaremos nos preocupar com o processo de instalação, que pode ser bastante demorado. A criação do servidor e do banco de dados será feita através do portal de gerenciamento do Azure, que oferece uma interface simples e intuitiva, por meio da qual conseguimos criar a maior parte dos recursos que necessitamos.

Para proceder com a criação do banco de dados, devemos então acessar o portal do Azure e efetuar o login com uma conta que possua uma assinatura ativa para uso da plataforma. Em seguida, devemos clicar no botão New (ícone “+” verde no canto superior esquerdo). Na próxima aba que será aberta, encontraremos as categorias dos principais serviços da plataforma, como Redes e Armazenamento, e também podemos efetuar buscas pelos serviços que desejamos. Entre as opções oferecidas, devemos clicar em Databases e, na aba seguinte, selecionar SQL Database, entre as várias opções de bancos de dados disponíveis. Esse processo de criação do banco é ilustrado na figura abaixo.


A próxima aba exibida solicitará as configurações da base de dados que desejamos criar (seção esquerda da figura abaixo), então devemos informar seu nome (Database name), selecionar a assinatura que estamos usando (Subscription) e um grupo de recursos (Resource group).

Em seguida, no campo Select source podemos escolher uma estrutura e dados pré-definidos (como o tradicional banco Northwind, muito usado em exemplos com o SQL Server), ou manter a opção Blank database para criar uma base vazia. Aqui, optaremos por essa última opção, pois desejamos gerar nossa estrutura manualmente de acordo com nossa necessidade. Ainda nessa aba, mais abaixo devemos selecionar a opção de preço que desejamos (Pricing tier). Essa é uma escolha que deve ser feita com atenção, pois definirá os recursos disponíveis para nosso banco e o valor que será pago por ele.

Ainda nessa figura, podemos ver no lado esquerdo o item Server em destaque. Clicando sobre ele podemos escolher o servidor que irá comportar esse novo banco de dados, ou criar um novo (seção central da imagem). Caso ainda não tenhamos um servidor criado, será necessário configurar um novo, o que pode ser feito clicando em Create a new server e preenchendo as informações solicitadas, como nome do servidor, login do administrador e senha. Em seguida, basta clicar em Select, depois em Create e aguardar a conclusão do processo de criação para que apareça um novo bloco na tela inicial do dashboard apontando para o banco criado.

Quando a criação for finalizada, devemos acessar o novo banco de dados e, no topo da aba com as informações gerais, clicar em Set server firewall. Essa configuração é necessária para que seja possível acessar esse servidor do Azure SQL Database a partir do nosso ambiente de desenvolvimento. Na aba que pode ser vista na figura abaixo, devemos preencher o campo RULE NAME com um nome qualquer e nos campos START ID e END ID inserir o IP público da nossa máquina. Em seguida, basta clicar em Save no topo da página.

Nota: Caso você não saiba seu IP público, pode acessar o site meuip.com.br e verificar.



Criando o projeto

A aplicação de exemplo que desenvolveremos contará com um cadastro postagens para compartilhamento de texto. O usuário poderá acessar, cadastrar um novo conteúdo e depois receber um link para acessá-lo posteriormente e compartilhá-lo com outras pessoas (semelhante à ferramenta Pastebin, porém com uma abordagem simplificada). Como o objetivo é focar na conexão com o Azure SQL Database, não nos preocuparemos com questões de autenticação ou regras de negócio aprimoradas, ao invés disso nos concentraremos nas operações de armazenamento e recuperação de dados da nossa base.

Então, para criarmos o projeto devemos acessar, no Visual Studio, o menu File > New > Project, selecionar o template ASP.NET Web Application e dar um nome ao projeto (aqui se chamará AspNetMvcAzureSqlDatabase). Depois devemos selecionar o template MVC e alterar o modo de autenticação para No authentication. Feito isso, basta clicar em OK.

Habilitando o Entity Framework

Para acessar o banco de dados utilizaremos o framework de mapeamento objeto-relacional Entity Framework, que precisa ser instalado no projeto. Para isso, acesse o menu Tools > NuGet Package Manager > Package Manager Console e no console execute o seguinte comando:

Install-Package EntityFramework

Nesse projeto também utilizaremos o recurso de Migrations do Entity Framework, que facilitará e permitirá automatizar a atualização do banco de dados a partir das nossas classes de modelo. Mais adiante, após criar essas classes, habilitaremos esse recurso.

Model

Com o projeto criado, vamos então adicionar nossa classe de modelo, clicando com a direita sobre a pasta Models e depois em Add > Class. Daremos a essa classe o nome de Post, e seu código pode ser visto abaixo>:

public class Post
{
    public int Id { get; set; }
    public string Titulo { get; set; }
    public string Conteudo { get; set; }
}


Em seguida, precisamos criar a classe que representará o contexto do banco de dados, estrutura utilizada pelo Entity Framework para gerenciar o acesso às coleções de dados que representam as tabelas do banco. Para isso, devemos adicionar uma nova classe na pasta Models, dessa vez chamada PostsContext e cujo código é apresentado s seguir:


using System.Data.Entity;
 
namespace AspNetMvcAzureSqlDatabase.Models
{
    public class PostsContext : DbContext
    {
        public DbSet Posts { get; set; }
    }
}

Essa classe simplesmente contém uma coleção de objetos do tipo Post, que quando mapeada irá gerar no banco de dados uma tabela de mesmo nome, na qual serão armazenados os dados referentes às postagens.

Agora que a classe de contexto está criada, podemos habilitar as Migrations no projeto, bastando para isso acessar o console do NuGet e executar o seguinte comando:

Enable-Migrations

Com o recurso ativo, o próximo passo será criar a primeira migration, que será responsável por gerar a estrutura da tabela Posts no banco de dados. O comando para isso é o seguinte (e também deve ser executado no console do NuGet):

Add-Migration CriaTabelaPosts

Executados esses passos, nossa aplicação já está pronta para acessar o banco de dados. Para confirmar esse fato, podemos executar a primeira migration. Antes, porém, é necessário configurar a string de conexão. Devemos então retornar para o portal do Azure e clicar sobre o banco recém-criado. Na aba que é aberta, podemos então clicar em Show database connection strings e na próxima aba copiar o conteúdo que é exibido no campo ADO.NET (SQL Authentication), como mostra a figura abaixo.


Agora, no Visual Studio vamos abrir o arquivo Web.config e adicionar, na seção configuration uma nova string de conexão que será usada pela classe PostsContext. O código a seguir mostra como fazer isso:

<connectionStrings>
    <add name="PostsContext" connectionString="[String copiada do Azure]" providerName="System.Data.SqlClient"/>
</connectionStrings>

No atributo connectionString devemos colar o valor que copiamos do portal do Azure. Além disso, no valor colado devemos preencher os campos User Id e Password com aqueles que definimos ao criar o banco de dados. Com isso, a connection string estará completa. Podemos então voltar ao console do NuGet e executar o seguinte comando para atualizar o banco de dados:

Update-Database

Caso todas as configurações tenham sido feitas corretamente, o banco de dados já estará atualizado depois desse passo e já poderemos persistir informações.

Controller

Nesse projeto precisaremos apenas de um único controller, que será responsável por receber os dados do usuário em uma página e exibi-los posteriormente em outra. Para criá-lo, podemos clicar com a direita sobre a pasta Controllers e depois na opção Add > Controller. Na janela que será aberta, devemos selecionar o template MVC5 Controller – Empty, para gerar um controller vazio, e clicar em Add. Em seguida, daremos à nova classe o nome de PostsController.

Quando o controller for criado, devemos alterar o nome do método Index para Novo e em seguida clicar com a direita sobre ele e na opção Add view. Na janela que será aberta os campos devem ser preenchidos de acordo com a figura abaixo e clicar em Add. No campo View name manteremos o nome Novo; em Template selecionaremos Create; em Model class selecionaremos a classe Post; em Data context class selecionaremos a classe PostsContext.


A view Novo, da forma como foi criada automaticamente pelo Visual Studio, já permite a inserção de novos posts por meio de um formulário. Então, podemos dar continuidade à implementação do controller.

Agora precisaremos adicionar uma referência ao PostsContext para que tenhamos acesso ao banco de dados. Então vamos inserir dentro da classe PostsController, antes de qualquer método, a seguinte linha:

PostsContext db = new PostsContext();

Em seguida vamos adicionar uma nova action chamada Novo, porém decorada com o atributo [HttpPost]. Isso fará com que quando o usuário acessar a URL /posts/novo no browser, ele terá acesso à página de cadastro que criamos anteriormente, e quando ele preencher os dados do post e submeter os dados, esses serão recebidos por essa nova action que acabamos de criar, pois eles serão enviados via POST. No código abaixo temos a implementação da nova função do controller:

[HttpPost]
public ActionResult Novo(Post post)
{
    db.Posts.Add(post);
    db.SaveChanges();
    return RedirectToAction("Detalhes", new { id = post.Id});
}

Nesse método estamos recebendo um objeto do tipo Post, cujos dados virão do formulário, e o adicionamos ao banco utilizando o objeto db. Em seguida, redirecionamos o usuário para a action de detalhes do post, onde ele verá as informações que acabou de postar e poderá usar o link para acessá-las posteriormente.

O próximo passo será criar a action Detalhes no mesmo controller, de acordo com o código abaixo:

public ActionResult Detalhes(int id)
{
    var post = db.Posts.FirstOrDefault(p => p.Id == id);
    return View(post);
}


Nesse método apenas recuperamos o post solicitado do banco de dados, filtrando a coleção Posts pelo id, e o repassamos para a view Detalhes. Para que essa action funcione corretamente, precisaremos clicar com a direita sobre ele e depois em Add view para que o arquivo Detalhes.cshtml seja adicionado na pasta Views/Posts. Como aqui não nos concentraremos em questões de design, não precisamos realizar nenhuma alteração no código HTML dessa página.

Concluídas essas etapas, já podemos testar nosso projeto, executando-o e acessando no browser a URL http://localhost:[porta]/posts/novo, que deve exibir para nós uma página como a da figura a seguir.


Podemos então preencher o formulário e clicar em Create para que o post seja criado e então sejamos redirecionados para a página contendo os detalhes do novo registro, como mostra a seguinte figura.


A partir do link gerado, que deve ter o formato http://localhost:[porta]/posts/detalhes/id, poderemos acessar os dados do novo item posteriormente. Nesse ponto, como o post foi cadastrado com sucesso, sabemos que os dados foram armazenados corretamente no Azure SQL Database

Publicando a aplicação

Com o projeto pronto e acessando o banco de dados na nuvem, podemos publicar também nossa aplicação no Azure e disponibilizá-la, por exemplo, para testes em outros ambientes, uma vez que ela estará disponível na internet.

Para isso, vamos voltar ao portal do Azure e novamente clicar no botão New, mas dessa vez acessaremos as opções Web + Mobile e Web App, como vemos abaixo:


Na próxima aba que será aberta, devemos preencher os dados de forma semelhante ao que fizemos na criação do SQL Database: dar um nome à aplicação (App name); selecionar a assinatura ativa (Subscription); selecionar o mesmo grupo de recursos que usamos anteriormente (Resourge group); e selecionar ou criar um plano de serviço (App Service Plan), que definirá onde a aplicação será hospedada (localização geográfica) e sua camada de preços. Nesse ponto, é interessante que se utilize a mesma localização em que foi criado o servidor do banco de dados, assim reduzimos a latência no tráfego dos dados.

Quando a criação da aplicação for finalizada, podemos clicar sobre ela no dashboard e acessar suas configurações. Na primeira aba que será exibida, devemos acessar o menu More e clicar em Get publish profile, como na figura abaixo. Nesse momento receberemos um arquivo com extensão .PublishSettings contendo o perfil de publicação dessa Web App, ou seja, o conjunto de informações que o Visual Studio precisa para conseguir publicar nosso projeto nesse recurso que acabamos de criar no Azure.


Tendo feito o download do arquivo, devemos voltar ao Visual Studio, salvar o projeto e, no Solution Explorer, clicar com a direita sobre o projeto e depois na opção Publish. Na tela que será aberta, e pode ser vista abaixo, devemos clicar na opção Import e selecionar o arquivo que acabamos de baixar.


Na tela seguinte, veremos que o Visual Studio já preencheu todas as informações necessárias à publicação (importadas do perfil de publicação). Basta então clicar em NextLogo após (figura a seguir) devemos observar alguns pontos importantes. Primeiramente, o Visual Studio identificou a existência da classe PostsContext, que está relacionada a uma connection string, a qual é carregada do arquivo Web.config e exibida no campo logo abaixo. Nesse ponto, temos a opção de alterar essa string de conexão e apontar para outro servidor e banco de dados, se for necessário. Essa possibilidade é útil quando estivermos trabalhando com um banco local durante o desenvolvimento, e só no momento da publicação desejarmos direcionar a conexão para o novo banco. Se esse for o caso, devemos marcar a opção Execute Code First Migrations (segundo checkbox) para que o banco de dados seja atualizado automaticamente quando publicarmos a aplicação.


Clicando em Next novamente, podemos visualizar quais arquivos foram adicionados ou modificados no projeto e que, portanto, serão enviados para o ambiente de publicação. Como essa é a primeira vez que publicamos o projeto, todos os arquivos estarão marcados com a ação Add, indicando que foram recém-criados.

Agora, basta clicar em Publish e aguardar a conclusão do processo. Nesse momento, o browser será aberto com a aplicação já publicada e disponível na internet em um link no formato http://.azurewebsites.net. Assim, teremos tanto nossa aplicação ASP.NET MVC quanto seu banco de dados hospedados na nuvem, em um ambiente flexível que nos habilita a realizar diversas configurações com facilidade.