Entendendo Aplicaes WEB Renato Haddad Microsoft Most Valuable Professional MVP, MCT, MCPD e MCTS

Tecnologias
Visual Studio .NET 2010, C#

Introduo
Neste artigo vamos falar sobre aplicaes ASP.NET e Web Services. As aplicaes feitas para rodarem em navegadores atingiram um nvel de apresentao e interao com o internauta excelente. Os prprios recursos atualmente nos permite executar aplicaes ASP.NET com desempenhos timos, por exemplo, sites do governo, pesquisa de preos, classificados e portais. Alguns destes tem uma grande quantidade de internautas simultneos e a aplicao aguenta tranquilamente.

J o Web Service uma forma de expor informaes de uma aplicao via WEB atravs de XML, HTTP e o protocolo SOAP (Simple Object Access Protocol). Internamente uma classe como outra qualquer contendo alguns atributos. O conceito de Web Service compartilhar informaes entre aplicaes e plataformas.

Aplicao ASP.NET Toda aplicao ASP.NET contm o layout que chamamos de interface com o usurio. Existe a linguagem HTML que aceita por todos os navegadores, e sendo assim, correto pensar em gerar o mximo possvel de HTML e Java Script para que a compatibilidade fique 100%.

No entanto, o ASP.NET tem uma particularidade porque a maioria dos tipos de controles utilizados nas pginas so assinados com a tag <asp:. Isto significa dizer que so controles executados no servidor, e o fluxo de execuo ocorre da seguinte forma: o internauta faz uma requisio no servidor, onde o mesmo processa o cdigo, gera um HTML e devolve para o navegador do internauta. Isto ocorre a cada solicitao no servidor. Desta maneira, o responsvel por gerar o HTML o servidor. Perceba ento que o desenvolvedor no coloca controles HTML no cdigo ASP.NET, mesmo porque se voc usar os controles do ASP.NET assinados como <asp: tem a enorme vantagem de disparar eventos, atribuir propriedades, ou seja, ele um objeto.

Em relao ao layout das pginas ASP.NET, 100% dos sites utilizam um arquivo de CSS (Cascade Style Sheet) o qual contm todas as configuraes de layout, cores, tamanhos e aspectos gerais de formatao. Uma aplicao ASP.NET pode ser modificada quase que 100% s com a utilizao de CSS, ento, dominar CSS muito importante, facilitando o desenvolvimento.

Para referenciar um arquivo CSS numa pgina ASP.NET coloque a seguinte declarao na sesso HEAD da pgina. Normalmente declaramos na Master.Page, assim todas as pginas que herdarem a Master j enxergam o CSS. Antes que voc pergunte, sim possvel ter vrios CSS na mesma pgina.

<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />

No Visual Studio .NET 2010 quando voc cria uma aplicao ASP.NET, j so criados alguns modelos para facilitar o desenvolvimento, por exemplo a Master.Page, um CSS, a pgina Default. Veja no cdigo a seguir os controles ASP.NET inseridos no ContentPlaceHolder da pgina default.aspx. Veja que h declaraes HTML como <h2>, <p>, <br /> assim como <asp:TextBox>, <DropDownList>, <Button> e <Label>. Cada controle contm as propriedades pois so objetos.

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> <h2> Welcome to ASP.NET! </h2> <p> To learn more about ASP.NET visit <a href="http://www.asp.net" title="ASP.NET Website">www.asp.net</a>. </p> Nome: <asp:TextBox ID="txtNome" runat="server"></asp:TextBox> <br /> Categoria: <asp:DropDownList runat="server" ID="ddlCategorias"> <asp:ListItem Text="Bebidas" />

<asp:ListItem Text="Massas" /> <asp:ListItem Text="Automoveis" /> <asp:ListItem Text="Acessorios" /> </asp:DropDownList> <br /> <asp:Button Text="Enviar" runat="server" id="btnEnviar" CssClass="bold" onclick="btnEnviar_Click"/> <br /> <asp:Label id="lblNome" runat="server" CssClass="failureNotification" /> </asp:Content>

A figura seguinte ilustra exatamente o cdigo anterior.

Como h um boto chamado btnEnviar, d um duplo clique para criar o evento de clicar. Digite o seguinte cdigo que ir exibir no Label lblNome o nome digitado no txtNomeconcatenado da categoria selecionada no DropDownList ddlCategorias.

protected void btnEnviar_Click(object sender, EventArgs e) { lblNome.Text = txtNome.Text + " - categoria: " + ddlCategorias.Text; }

Para executar pressione F5 e teste no navegador.

Exatamente no evento clicar do boto, enviada uma requisio ao servidor que ir ler os dados digitados/selecionados, gerar o HTML e devolver ao cliente o resultado. Isto o que chamamos de execuo no servidor.

J o processamento do lado do cliente usado o Java Script porque todo navegador entende isto. Desta forma, como tudo est no cliente, no h requisio feita no servidor, deixando o processamento muito mais rpido, afinal fica tudo local. As declaraes do Java Script podem ser feitas na sesso HEAD do HTML. Quando se utiliza Mater.Page na Master h o PlaceHolder chamado HeaderContent e exatamente aqui que declaramos o Java Script, conforme o cdigo a seguir. Est cdigo mostrar uma caixa de mensagem Ol toda vez que a pgina for carregada. O comando alert do Java Script contm a mensagem que quer exibir ao usurio.

Em alguns tipos de aplicaes quando preciso identificar um elemento na pgina, usado o document.getElementsByName("lblNome"); contendo o nome do controle em si, neste caso o lblNome.

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> <script type="text/javascript"> alert('Ola'); document.getElementsByName("lblNome"); </script> </asp:Content>

Isto foi apenas para voc ter uma ideia de processamento no cliente e no servidor.

Quando tiver um formulrio aberto no VS, abra a Toolbox para ver quais controles podem ser usados na aplicao, conforme a seguinte figura.

Web Service

Web Service uma forma de compartilhar informaes entre aplicaes e plataformas, permitindo assim expor servios de leitura e escrita pela WEB. Basicamente se eu disser que

muitas aplicaes trocam arquivos texto para conversarem voc saber o que estou dizendo. No entanto, Web Service foi feito para ser transparente, ou seja, voc cria um mtodo que recebe a solicitao via WEB, executa um determinado cdigo que s o mtodo sabe, e no retorno ao cliente gerado um XML. Para o trfego utilizado o protocolo SOAP (Simple Object Access Protocol) que trafegado via HTTP.

Veja no cdigo a seguir um Web Service criado no Visual Studio contendo os atributos de [WebService] e [WebServiceBinding]. Veja que a classe chama-se WebService1, poderia ser qualquer outro nome tambm o qual herda deSystem.Web.Service.WebServices.

J na declarao dos mtodos, o mais importante a declarao do atributo [WebMethod] que indica que este mtodo ser exposto via WEB. Neste exemplo, temos dois mtodos, o HelloWorld que default e eu no o apaguei, e o Somar que digitei. EsteSomar retorna um tipo int (inteiro) e tem dois parmetros de entrada do tipo int, que so os nmeros a serem somados. O contedo do mtodo apenas a soma dos dois parmetros n1 e n2.

[WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem(false)] [System.Web.Script.Services.ScriptService] public class WebService1 : System.Web.Services.WebService {

[WebMethod] public string HelloWorld() { return "Hello World"; }

[WebMethod(Description = "Somar 2 numeros")] public int Somar(int n1, int n2)

{ return n1 + n2; } }

Na execuo do Web Service no navegador (veja que a extenso do arquivo .asmx) so mostrados os dois mtodos.

Clique em Somar e aparecer uma tela solicitando a digitao dos dois nmeros.

Digite por exemplo os nmeros 27 e 3 e clique no boto Invoke. O resultado final ser um XML contendo o resultado da soma 30.

Agora vou mostrar como montar uma pgina ASP.NET chamada ConsomeWebService contendo o layout a seguir que ir invocar o web servisse criado.

<h1>Consome web service</h1> nmero 1: <asp:TextBox runat="server" id="txt1"/> <br />

nmero 2: <asp:TextBox runat="server" id="txt2"/> <br />

<asp:Button Text="Somar" ID="btnSomar" runat="server" onclick="btnSomar_Click" />

<br />

<asp:Label Text="0" ID="lblSomar" runat="server" />

Veja o layout do cdigo.

D um duplo clique no boto Somar e digite o seguinte cdigo que ir instanciar a classe WebService1, invocar o mtodo Somar passando os dois nmeros digitados como argumentos. O uso do int.Parse necessrio porque os parmetros no Web Service esperam um nmero do tipo int.

protected void btnSomar_Click(object sender, EventArgs e) { WebService1 ws = new WebService1(); lblSomar.Text = ws.Somar(int.Parse(txt1.Text), int.Parse(txt2.Text)).ToString(); }

Este exemplo prtico porque fiz o Web Service no mesmo projeto, mas se voc quiser separar os projetos, um de ASP.NET e outro de Web Service ou ainda referenciar um Web Service do mercado, basta adicionar a referencia no projeto ASP.NET. Neste caso, informa a URL completa do Web Service.

Bons estudos e sucesso nos projetos.

Sobre o Autor
Renato Haddad (rehaddad@msn.com www.renatohaddad.com ) MVP, MCT, MCPD e MCTS, palestrante em eventos da Microsoft em diversos pases, ministra treinamentos focados

em produtividade com o VS.NET 2010, ASP.NET 4, Entity Framework, Reporting Services e Windows Phone. Visite o blog http://weblogs.asp.net/renatohaddad.