3. Introdução ao desenvolvimento web ASP.NET
3.1. Introduction
O capítulo anterior apresentou os princípios do desenvolvimento web, que são independentes da linguagem de programação utilizada. Atualmente, três tecnologias dominam o mercado do desenvolvimento web:
- J2EE, que é uma plataforma de desenvolvimento Java. Associada à tecnologia Struts, instalada em diversos servidores de aplicações, a plataforma J2EE é utilizada principalmente em grandes projetos. Devido à linguagem utilizada — Java —, uma aplicação J2EE pode funcionar nos principais sistemas operativos (Windows, Unix, Linux, Mac OS, ...)
- O PHP, que é uma linguagem interpretada, é também independente do sistema operativo. Ao contrário do Java, não se trata de uma linguagem orientada para objetos. No entanto, a versão PHP5 deverá introduzir a orientação para objetos na linguagem. De fácil acesso, o PHP é amplamente utilizado em projetos de pequena e média dimensão.
- O ASP.NET é uma tecnologia que funciona apenas em computadores Windows que disponham da plataforma .NET (XP, 2000, 2003, ...). A linguagem de desenvolvimento utilizada pode ser qualquer linguagem compatível com .NET, c.a.d. São mais de uma dezena, a começar pelas linguagens da Microsoft (C#, VB.NET, J#), Delphi da Borland, Perl, Python, ...
O capítulo anterior apresentou breves exemplos para cada uma destas três tecnologias. Este documento centra-se no desenvolvimento Web ASP.NET com a linguagem VB.NET. Partimos do princípio de que esta linguagem é conhecida. Este ponto é importante. Aqui, interessamo-nos exclusivamente pela sua utilização no contexto do desenvolvimento web. Vamos explicar melhor este ponto, abordando a metodologia MVC de desenvolvimento web.
Uma aplicação web que respeite o modelo MVC será arquitetada da seguinte forma:
Essa arquitetura, denominada de «3 camadas» ou «3 níveis», procura respeitar o modelo MVC (Model View Controller):
- a interface do utilizador é o V (a vista)
- a lógica da aplicação é o C (o controlador)
- as fontes de dados são o M (Modelo)
A interface do utilizador é frequentemente um navegador da Web, mas também pode ser uma aplicação autónoma que, através da rede, enviaria pedidos HTTP ao serviço Web e formataria os resultados que este lhe enviasse. A lógica da aplicação é constituída pelos scripts que processam os pedidos do utilizador. A fonte de dados é frequentemente uma base de dados, mas também pode consistir em simples ficheiros de texto, um diretório LDAP, um serviço web remoto, etc. É do interesse do programador manter uma grande independência entre estas três entidades, para que, caso uma delas mude, as outras duas não tenham de mudar, ou apenas ligeiramente.
- A lógica de negócio da aplicação será colocada em classes separadas da classe que controla o diálogo pedido-resposta. Assim, o bloco [Logique applicative] acima poderá ser constituído pelos seguintes elementos:
No bloco [Logique Applicative], poderemos distinguir
- a classe controladora, que é a porta de entrada da aplicação,
- o bloco [Classes métier], que agrupa as classes necessárias à lógica da aplicação. Estas são independentes do cliente.
- o bloco [Classes d'accès aux données], que agrupa as classes necessárias para obter os dados necessários ao servlet, frequentemente dados persistentes (BD, ficheiros, serviço WEB, ...)
- o bloco de páginas ASP, que constitui as vistas da aplicação.
Em casos simples, a lógica da aplicação é frequentemente reduzida a duas classes:
- a classe controladora, responsável pelo diálogo cliente-servidor: processamento da solicitação, geração das diversas respostas
- a classe de negócio, que recebe do controlador os dados a processar e lhe fornece, em troca, os resultados. Esta classe de negócio gere, então, ela própria o acesso aos dados persistentes.
A especificidade do desenvolvimento web reside na criação da classe controladora e das páginas de apresentação. As classes de negócio e de acesso aos dados são classes .NET clássicas, utilizáveis tanto numa aplicação web como numa aplicação Windows ou mesmo do tipo consola. A criação destas classes requer bons conhecimentos de programação orientada para objetos. Neste documento, elas serão escritas em VB.NET, pelo que partimos do princípio de que esta linguagem é dominada. Nesta perspetiva, não há motivo para nos alongarmos mais do que o necessário sobre o código de acesso aos dados. Em quase todos os livros sobre ASP.NET, há um capítulo dedicado ao ADO.NET. O esquema acima mostra que o acesso aos dados é feito por classes .NET totalmente clássicas, que ignoram que estão a ser utilizadas num contexto web. O controlador, que é o chefe de equipa da aplicação web, não precisa de se preocupar com o ADO.NET. Basta saber a que classe deve solicitar os dados de que necessita e como os solicitar. É tudo. Colocar código ADO.NET no controlador não está de acordo com o conceito MVC explicado acima e não o faremos.
3.2. As ferramentas
Este documento destina-se a estudantes, pelo que iremos trabalhar com ferramentas gratuitas que podem ser descarregadas da Internet:
- a plataforma .NET (compiladores, documentação)
- o ambiente de desenvolvimento WebMatrix, que inclui o servidor web Cassini
- vários SGBD (MSDE, MySQL)
Convidamos o leitor a consultar o anexo «Ferramentas da Web», que indica onde encontrar e como instalar estas diferentes ferramentas. Na maioria das vezes, só precisaremos de três ferramentas:
- um editor de texto para escrever as aplicações web.
- uma ferramenta de desenvolvimento VB.NET para escrever o código VB quando este for extenso. Este tipo de ferramenta oferece, geralmente, ajuda na introdução de código (preenchimento automático de código) e a deteção de erros sintáticos, quer durante a digitação do código, quer durante a compilação.
- um servidor web para testar as aplicações web criadas. Neste documento, utilizaremos o Cassini. O leitor que disponha do servidor IIS poderá substituir o Cassini pelo IIS. Ambos são compatíveis com .NET. No entanto, o Cassini está limitado a responder apenas a pedidos locais (localhost), enquanto o IIS pode responder a pedidos de máquinas externas.
Um excelente ambiente comercial para desenvolver em VB.NET é o Visual Studio.NET da Microsoft. Este IDE, muito completo, permite gerir todo o tipo de documentos (código VB.NET, documentos HTML, XML, folhas de estilo, etc.). Na escrita de código, oferece a ajuda inestimável da «autocompletar» de código. Dito isto, esta ferramenta, que melhora significativamente a produtividade do programador, tem o inconveniente de as suas qualidades: limita o programador a um modo de desenvolvimento padrão que, embora eficaz, nem sempre é adequado.
É possível utilizar o servidor Cassini fora do [WebMatrix] e é isso que faremos frequentemente. O executável do servidor encontra-se em <WebMatrix>\<versão>\WebServer.exe, onde <WebMatrix> é o diretório de instalação do [WebMatrix] e <versão> é o seu número de versão:
Abramos uma janela do DOS e acedamos à pasta do servidor Cassini:
E:\Program Files\Microsoft ASP.NET Web Matrix\v0.6.812>dir
...
29/05/2003 11:00 53 248 WebServer.exe
...
Executemos o [WebServer.exe] sem parâmetros:
O painel acima indica-nos que a aplicação [WebServer/Cassini] aceita três parâmetros:
- /port: número da porta do serviço web. Pode ser qualquer valor. Por predefinição, o valor é 80
- /path: caminho físico de uma pasta no disco
- /vpath: pasta virtual associada à pasta física anterior.
Colocaremos os nossos exemplos numa árvore de ficheiros com raiz P, contendo pastas chap1, chap2, ... para os diferentes capítulos deste documento. Associaremos a esta pasta física P o caminho virtual V. Assim, iremos iniciar o Cassini com o seguinte comando do DOS:
Por exemplo, se quisermos que a raiz física do servidor seja a pasta [D:\data\devel\aspnet\poly] e a sua raiz virtual [aspnet], o comando DOS para iniciar o servidor web será:
É possível colocar este comando num atalho. Depois de iniciado, o Cassini instala um ícone na barra de tarefas. Ao clicar duas vezes nesse ícone, tem-se acesso a um painel para ligar/desligar o servidor:
O painel apresenta os três parâmetros com os quais foi iniciado. Dispõe de dois botões de ligar/desligar, bem como de um link de teste para a raiz da sua árvore de diretórios web. Seguimos esse link. É aberto um navegador e é solicitada a página URL [http://localhost/aspnet]. Obtemos o conteúdo da pasta indicada no campo [Physical Path] acima:
No exemplo, o URL solicitado corresponde a uma pasta e não a um documento web, pelo que o servidor apresentou o conteúdo dessa pasta e não um documento web específico. Se, nessa pasta, existir um ficheiro chamado [default.aspx], este será visualizado. Criemos, por exemplo, o seguinte ficheiro e coloquemo-lo na raiz da árvore de diretórios web do Cassini (d:\data\devel\aspnet\poly, neste caso):
Vamos agora aceder ao URL [http://localhost/aspnet] com um navegador:
Vemos que, na realidade, foi o URL [http://localhost/aspnet/default.aspx] que foi apresentado. Mais adiante neste documento, indicaremos como o Cassini deve ser configurado através da notação Cassini(path,vpath), em que [path] é o nome da pasta raiz da árvore web do servidor e [vpath] o caminho virtual associado. Recorde-se que, com o servidor Cassini(path,vpath), a URL [http://localhost/vpath/XX] corresponde ao caminho físico [path\XX]. Colocaremos todos os nossos documentos numa raiz física a que chamaremos <webroot>. Assim, poderemos referir-nos ao ficheiro <webroot>\chap2\here1.aspx. Para cada leitor, esta raiz <webroot> será uma pasta no seu computador pessoal. Aqui, as capturas de ecrã mostrarão que esta pasta é frequentemente [d:\data\devel\aspnet\poly]. No entanto, nem sempre será esse o caso, uma vez que os testes foram realizados em computadores diferentes.
3.3. Primeiros exemplos
Vamos apresentar exemplos simples de páginas web dinâmicas criadas com o VB.NET. Convidamos o leitor a testá-los para verificar se o seu ambiente de desenvolvimento está corretamente instalado. Vamos descobrir que existem várias formas de construir uma página ASP.NET. Escolheremos uma delas para o resto dos nossos desenvolvimentos.
3.3.1. Exemplo básico – variante 1
Ferramentas necessárias: um editor de texto, o servidor Web Cassini
Retomamos o exemplo do capítulo anterior. Criamos o seguinte ficheiro [heure1.aspx]:
<html>
<head>
<title>Demo asp.net </title>
</head>
<body>
Il est <% =Date.Now.ToString("T") %>
</body>
</html>
Este código é o código HTML com uma baliza especial <% ... %>. Dentro desta baliza, é possível inserir código VB.NET. Aqui, o código
gera uma cadeia de caracteres C que representa a hora atual. A baliza <% ... %> é então substituída por essa cadeia de caracteres C. Assim, se C for a cadeia 18:11:01, a linha HTML que contém o código VB.NET passa a ser:
Coloquemos o código anterior no ficheiro [<webroot>\chap2\heure1.aspx]. Iniciemos o Cassini (<webroot>,/aspnet) e acedamos, através de um navegador, ao URL [http://localhost/aspnet/chap2/heure1.aspx]:
Assim que obtivermos este resultado, sabemos que o ambiente de desenvolvimento está corretamente instalado. A página [heure1.aspx] foi compilada, uma vez que contém código VB.NET. A sua compilação produziu um ficheiro DLL que foi armazenado numa pasta do sistema e, em seguida, executado pelo servidor Cassini.
3.3.2. Exemplo básico - variante 2
Ferramentas necessárias: um editor de texto, o servidor Web Cassini
O documento [heure1.aspx] mistura código HTML e código VB.NET. Num exemplo tão simples, isto não constitui um problema. Se for necessário incluir mais código VB.NET, será aconselhável separar ainda mais o código HTML do código VB. Isto pode ser feito agrupando o código VB dentro de uma baliza <script>:
<script runat="server">
' cálculo dos dados a apresentar pelo código HTML
...
</script>
<html>
....
' exibição dos valores calculados pela parte do script
</html>
O exemplo [heure2.aspx] ilustra este método:
<script runat="server">
Dim maintenant as String=Date.Now.ToString("T")
</script>
<html>
<head>
<title>Demo asp.net </title>
</head>
<body>
Il est
<% =maintenant %>
</body>
</html>
Colocamos o documento [heure2.aspx] na árvore de diretórios [<webroot>\chap2\heure2.aspx] do servidor web Cassini (<webroot>,/aspnet) e acedemos ao documento através de um navegador:
3.3.3. Exemplo básico - variante 3
Ferramentas necessárias: um editor de texto, o servidor Web Cassini
Levamos mais longe o processo de separação do código VB e do código HTML, colocando-os em dois ficheiros distintos. O código HTML ficará no documento [heure3.aspx] e o código VB no documento [heure3.aspx.vb]. O conteúdo do documento [heure3.aspx] será o seguinte:
<%@ Page Language="vb" src="heure3.aspx.vb" Inherits="heure3" %>
<html>
<head>
<title>Demo asp.net</title>
</head>
<body>
Il est
<% =maintenant %>
</body>
</html>
Existem duas diferenças fundamentais:
- a diretiva [Page] com atributos ainda desconhecidos
- a utilização da variável [maintenant] no código HTML, apesar de não estar inicializada em lado nenhum
A diretiva [Page] serve aqui para indicar que o código VB, que irá inicializar a página, se encontra noutro ficheiro. É o atributo [src] que indica este último. Vamos descobrir que o código VB pertence a uma classe chamada [heure3]. De forma transparente para o programador, um ficheiro .aspx é transformado numa classe que deriva de uma classe base chamada [Page]. Neste caso, o nosso documento HTML deve derivar da classe que define e calcula os dados que deve apresentar. Neste caso, trata-se da classe [heure3], definida no ficheiro [heure3.aspx.vb]. Além disso, é necessário indicar esta ligação pai-filho entre o documento VB [heure3.aspx.vb] e o documento HTML [heure3.aspx]. É o atributo [inherits] que especifica esta ligação. Deve indicar o nome da classe definida no ficheiro para o qual aponta o atributo [src].
Analisemos agora o código VB da página:
Public Class heure3
Inherits System.Web.UI.Page
' dados da página web a apresentar
Protected maintenant As String
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
' cálculo dos dados da página web
maintenant = Date.Now.ToString("T")
End Sub
End Class
É de salientar o seguinte:
- o código VB define uma classe [heure3] derivada da classe [System.Web.UI.Page]. É sempre assim, uma vez que uma página web deve sempre derivar de [System.Web.UI.Page].
- A classe declara um atributo protegido (protected) [maintenant]. Sabe-se que um atributo protegido é acessível diretamente nas classes derivadas. É isso que permite que o documento HTML [heure3.aspx] tenha acesso ao valor do dado [maintenant] no seu código.
- A inicialização do atributo [maintenant] é efetuada num procedimento [Page_Load]. Veremos mais adiante que um objeto do tipo [Page] é notificado pelo servidor Web sobre uma série de eventos. O evento [Load] ocorre quando o objeto [Page] e os seus componentes são criados. O gestor deste evento é designado pela diretiva [Handles MyBase.Load]
- o nome [XX] do gestor do evento pode ser qualquer um. A sua assinatura deve ser a indicada acima. Não iremos explicar esta assinatura por enquanto.
- Utiliza-se frequentemente o gestor do evento [Page.Load] para calcular os valores dos dados dinâmicos que a página web deve apresentar.
Os documentos [heure3.spx] e [heure3.aspx.vb] são colocados no [<webroot>\chap2]. Em seguida, utilizando um navegador, solicita-se o URL e o [http://localhost/aspnet/chap2/heure3.aspx] ao servidor web (<webroot>,/aspnet):
3.3.4. Exemplo básico – variante 4
Ferramentas necessárias: um editor de texto, o servidor Web Cassini
Mantemos o mesmo exemplo anterior, mas agrupamos novamente todo o código num único ficheiro [heure4.aspx]:
<script runat="server">
' dados da página web a apresentar
Private maintenant As String
' evt page_load
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
': calcula-se os dados da página web
maintenant = Date.Now.ToString("T")
End Sub
</script>
<html>
<head>
<title>Demo asp.net</title>
</head>
<body>
Il est
<% =maintenant %>
</body>
</html>
Encontramos aqui a sequência do exemplo 2:
Desta vez, o código VB foi estruturado em procedimentos. Encontramos aqui o procedimento [Page_Load] do exemplo anterior. Pretendemos mostrar aqui que uma página .aspx isolada (não associada a um código VB num ficheiro separado) é transformada implicitamente numa classe derivada de [Page]. Assim, é possível utilizar os atributos, métodos e eventos desta classe. É isso que se faz aqui, onde se utiliza o evento [Load] desta classe.
O método de teste é idêntico aos anteriores:
3.3.5. Exemplo básico - variante 5
Ferramentas necessárias: um editor de texto, o servidor Web Cassini
Tal como no exemplo 3, separamos o código VB e o código HTML em dois ficheiros distintos. O código VB é colocado no ficheiro [heure5.aspx.vb]:
Public Class heure5
Inherits System.Web.UI.Page
' dados da página web a apresentar
Protected maintenant As String
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
'calculam-se os dados da página web
maintenant = Date.Now.ToString("T")
End Sub
End Class
O código HTML é inserido em [heure5.aspx]:
<%@ Page Inherits="heure5" %>
<html>
<head>
<title>Demo asp.net</title>
</head>
<body>
Il est
<% =maintenant %>
</body>
</html>
Desta vez, a diretiva [Page] já não indica a ligação entre o código HTML e o código VB. O servidor web já não consegue localizar o código VB para o compilar (ausência do atributo src). Cabe-nos a nós efetuar essa compilação. Numa janela do DOS, compilamos, portanto, a classe VB [heure5.aspx.vb]:
dos>dir
23/03/2004 18:34 133 heure1.aspx
24/03/2004 09:47 232 heure2.aspx
24/03/2004 10:16 183 heure3.aspx
24/03/2004 10:16 332 heure3.aspx.vb
24/03/2004 14:31 440 heure4.aspx
24/03/2004 14:45 332 heure5.aspx.vb
24/03/2004 14:56 148 heure5.aspx
dos>vbc /r:system.dll /r:system.web.dll /t:library /out:heure5.dll heure5.aspx.vb
Compilateur Microsoft (R) Visual Basic .NET version 7.10.3052.4
Acima, o executável [vbc.exe] do compilador estava no PATH da máquina DOS. Se não fosse esse o caso, teria sido necessário indicar o caminho completo para o ficheiro [vbc.exe], que se encontra na árvore de pastas onde foi instalado o SDK.NET. As classes derivadas do [Page] requerem recursos presentes nos DLL e [system.dll, system.web.dll], daí a referência a estes através da opção /r do compilador. A opção /t:library serve para indicar que se pretende gerar um DLL. A opção /out indica o nome do ficheiro a gerar, neste caso [heure5.dll]. Este ficheiro contém a classe [heure5] de que o documento web [heure5.aspx] necessita. No entanto, o servidor web procura os ficheiros DLL de que necessita em locais bem específicos. Um desses locais é a pasta [bin], situada na raiz da sua árvore de diretórios. Esta raiz é o que designámos por <webroot>. Para o servidor IIS, trata-se geralmente de <unidade>:\inetpub\wwwroot, em que <unidade> é a unidade (C, D, ...) onde o IIS foi instalado. Para o servidor Cassini, esta raiz corresponde ao parâmetro /path com o qual o iniciou. Recorde-se que este valor pode ser obtido clicando duas vezes no ícone do servidor na barra de tarefas:
<webroot> corresponde ao atributo [Physical Path] acima referido. Criamos, portanto, uma pasta <webroot>\bin e colocamos o [heure5.dll] nessa pasta:
Estamos prontos. Solicitamos o URL [http://localhost/aspnet/chap2/heure5.aspx] ao servidor Cassini (<webroot>,/aspnet):
3.3.6. Exemplo básico – variante 6
Ferramentas necessárias: um editor de texto, o servidor Web Cassini
Até agora, demonstrámos que uma aplicação Web dinâmica tem dois componentes:
- código VB para calcular as partes dinâmicas da página
- código HTML, que por vezes inclui código VB para a exibição desses valores na página. Esta parte representa a resposta que é enviada ao cliente web.
O componente 1 é designado por componente controlador da página e o componente 2 por componente de apresentação. O componente de apresentação deve conter o mínimo possível de código VB, ou mesmo nenhum código VB. Veremos que isso é possível. Aqui, apresentamos um exemplo em que existe apenas um controlador e nenhum componente de apresentação. É o próprio controlador que gera a resposta para o cliente sem a ajuda do componente de apresentação.
O código de apresentação passa a ser o seguinte:
Vemos que já não existe qualquer código HTML nele. A resposta é elaborada diretamente no controlador:
Public Class heure6
Inherits System.Web.UI.Page
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
' elabora-se a resposta
Dim HTML As String
HTML = "<html><head><title>heure6</title></head><body>Il est "
HTML += Date.Now.ToString("T")
HTML += "</body></html>"
' envia-se a resposta
Response.Write(HTML)
End Sub
End Class
O controlador elabora aqui a resposta na íntegra, em vez de apenas as partes dinâmicas da mesma. Além disso, envia-a. Faz-o através da propriedade [Response], do tipo [HttpResponse], da classe [Page]. Trata-se de um objeto que representa a resposta enviada pelo servidor ao cliente. A classe [HttpResponse] dispõe de um método [Write] para escrever no fluxo HTML que será enviado ao cliente. Aqui, colocamos todo o fluxo HTML a enviar na variável [HTML] e enviamos esta última ao cliente através de [Response.Write(HTML)].
Solicitamos a URL [http://localhost/aspnet/chap2/heure6.aspx] ao servidor Cassini (<webroot>,/aspnet):
3.3.7. Conclusão
Posteriormente, utilizaremos o método 3, que coloca o código VB e o código HTML de um documento Web dinâmico em dois ficheiros separados. Este método tem a vantagem de dividir uma página Web em dois componentes:
- um componente controlador, composto exclusivamente pelo código VB, para calcular as partes dinâmicas da página
- um componente de apresentação, que é a resposta enviada ao cliente. Este é composto por código HTML, incluindo, por vezes, código VB para a exibição dos valores dinâmicos. O nosso objetivo será sempre ter o mínimo de código VB na parte de apresentação, sendo o ideal não ter nenhum.
Tal como demonstrado no método 5, o controlador poderá ser compilado independentemente da aplicação web. Isto apresenta a vantagem de nos concentrarmos exclusivamente no código e de obtermos, em cada compilação, a lista de todos os erros. Depois de o controlador estar compilado, a aplicação web pode ser testada. Sem compilação prévia, será o servidor web a realizar essa compilação, e os erros serão então sinalizados um a um. Isto pode ser considerado moroso.
Para os exemplos que se seguem, bastam as seguintes ferramentas:
- um editor de texto para criar os documentos HTML e VB da aplicação, quando estes forem simples
- um IDE de desenvolvimento .NET para criar as classes VB.NET, de modo a beneficiar da ajuda que este tipo de ferramenta proporciona na escrita de código. Uma ferramenta deste tipo é, por exemplo, a CSharpDevelop (http://www.icsharpcode.net). Um exemplo de utilização é apresentado no anexo [Les outils du développement web].
- a ferramenta WebMatrix para criar as páginas de apresentação da aplicação (ver o anexo [Les outils du développement web]).
- o servidor Cassini
Todas estas ferramentas são gratuitas.