Uma das principais vantagens da exploração da tecnologia AJAX com o ASP.NET é a possibilidade de serializar objetos .NET passando do servidor para o cliente e desserializando-os no sentido contrário, passando do cliente para o servidor. Isso deve acontecer de forma transparente, mas você deve prestar atenção à formulação dos objetos do JavaScript.
Suponhamos que os nossos leitores conhecem, pelo menos um pouco,a plataforma .NET e as páginas ASP.NET com tecnologia AJAX. Além disso, vamos nos basear no Framework.NET 3.5 com o IDE Microsoft Visual Studio 2008.
Vamos construir uma solução Web ASP.NET com uma página aspx, um serviço web e uma estrutura de objetos da seguinte forma:
Nós vamos, então, tentar chamar o serviço através da nossa página aspx, comunicando no sentido servidor/cliente, uma estrutura de objetos construída no servidor, e no outro sentido, passando uma estrutura JSon do cliente para o servidor .
Na nossa página aspx, definimos um botão html chamando uma função JavaScript durante o seu clique:
<input type="button" value="Retornar uma estrutura do servidor" onclick="javascript: chamadaRetorrnarUmaEstrutura();" />
A função chamada, por seu lado, chama o AJAX para o nosso serviço web passando dois parâmetros da seguinte maneira: function chamadaRetorrnarUmaEstrutura() { var dataDaChamada = new Date(); contadorDeChamadas++; AplicativoWebAjax.ServiçoWebAjax.RetornarUmaEstrutura(dataDaChamada, contadorDaChamada, RetornarUmaEstrutura_SucceededCallback, FailedCallback); }
No servidor, nosso serviço vai construir uma estrutura de objetos para fazê-la retornar como valor de retorno de sua função "RetornarUmaEstrutura" para o cliente:
[WebMethod] público MeuEspaço.MeuObjeto RetornarUmaEstrutura(DateTime dataDaChamada, int contador Da Chamada) { MeuEspaço.MeuObjeto meuObjeto = new MeuEspaço.MeuObjeto(); meuObjeto.MeuParamString = "Data da chamada: " + dataDaChamada.ToString() + " - Contador da chamada : " + contadorDaChamada.ToString(); meuObjeto.MeuParamInt = contadorDaChamada; meuObjeto.MeuParamDecimal = contadorDaChamada / 2; meuObjeto.MeuParamDateTime = dataDaChamada; meuObjeto.MeusSubObjetos.Add(new MeuEspaço.MeuSubObjeto("Param 1")); meuObjeto. MeusSubObjetos.Add(new MeuEspaço.MeuSubObjeto("Param 2")); return meuObjeto; }
A estrutura devolvida ao cliente pode ser usada com o código JavaScript sem problemas:
function RetornarUmaEstrutura_SucceededCallback(resultado) { document.getElementById('testDiv').innerHTML += '<b>Objeto recebido do servidor :</b><br />' + '<b> MeuParamString = ' + resultado.MeuParamString + '</b><br />' + '<b> MeuParamInt = ' + resultado.MeuParamInt + '</b><br />' + '<b> MeuParamDecimal = ' + resultado.MeuParamDecimal + '</b><br />' + '<b> MeuParamDateTime = ' + resultado.MeuParamDateTime + '</b><br />' + '<b> MeusSubObjetos[0].MeuParamString = ' + resultado.MeusSubObjetos[0].MeuParamString + '</b><br />' + '<b> MeusSubObjetos[1].MeuParamString = ' + resultado.MeusSubObjetos[1].MeuParamString + '</b><br />'; }
Como se trata de uma estrutura JSon, o processamento do cliente é bastante simplificado, porque podemos encontrar facilmente os nossos atributos com seus nomes definidos no servidor.
Vamos definir outro botão html:
<input type="button" value="Receber uma estrutura no servidor" onclick="javascript: chamadaReceberUmaEstrutura();" />
Este botão chama o método que se encarrega, em primeiro lugar, da construção de uma estrutura JSon conforme à estrutura objeto definida no servidor e, em segundo lugar, da chamada do método do serviço web, fazendo-o comunicar a estrutura pré-construída:
function chamadaReceberUmaEstrutura() { var meuObjeto = { "MeuParamString": "A ser tratado no servidor", "MeuParamInt": 3, "MeuParamDecimal": 1, "MeuParamDateTime": new Date(2008, 10, 10, 10, 30, 59, 88), "MeusSubObjetos": [{ "MeuParamString": "Param 1" }, { "MeuParamString": "Param 2"}] }; AplicativoWebAjax.ServiçoWebAjax.ReceberUmaEstrutura(meuObjeto, ReceberUmaEstrutura_SucceededCallback, FailedCallback); }
Observamos aqui, em particular, a necessidade de utilizar valores corretamente digitados. Este é o caso das datas que devem ser definidas respeitando o tipo de data JavaScript. É por isso que usamos em nosso exemplo o objeto "Data" JavaScript e não uma sequência de caracteres representando uma data formatada.
O uso das variáveis corretamente digitadas nos proporciona uma enorme vantagem na medida em que permanece independente da cultura escolhida no cliente e a outra, escolhida no servidor.
Finalmente, passemos à nossa função de servidor que deve receber a nossa estrutura, mas desta vez como um verdadeiro objeto.NET corretamente desserializado, se supomos, naturalmente, que proporcionamos um Json conforme:
[WebMethod] public string ReceberUmaEstrutura(MeuEspaço.MeuObjeto meuObjeto) { meuObjeto.MeuParamString = "Data da chamada: " + DateTime.Now.ToString(); return "<b> MeuParamString = " + meuObjeto.MeuParamString + "</b><br />" + "<b> MeuParamInt = " + meuObjeto.MeuParamInt + "</b><br />" + "<b> MeuParamDecimal = " + meuObjeto.MeuParamDecimal + "</b><br />" + "<b> MeuParamDateTime = " + meuObjeto.MeuParamDateTime + "</b><br />" + "<b> MeusSubObjetos[0].MeuParamString = " + meuObjeto.MeusSubObjetos[0].MeuParamString + "</b><br />" + "<b> MeusSubObjetos[1].MeuParamString = " + meuObjeto.MeusSubObjetos[1].MeuParamString + "</b><br />"; }
Olhando para o exemplo apresentado aqui, podemos concluir que não há nada mais fácil do que fazer passar um objeto .NET de um lado ou de outro, ou vice-versdo servidor para o cliente mas, na verdade, isso poderia esconder as dificuldades a serem ultrapassadas em função da complexidade dos objetos tratados. Recomendamos que você use uma ferramenta para observar o tráfego na web e visualizar a estrutura dos objetos enviados do servidor para o cliente, a fim de aprender, construindo esses objetos no cliente.