Nel precedente tip è stato mostrato come dialogare con il server tramite un semplice webservice asmx. Sebbene questo modo di procedere sia molto intuitivo, comporta spesso un overhead causato dal file javascript generato dal server per permettere la chiamata del servizio. Nel precedente esempio infatti potete vedere, come oltre ai normali script, venga restituito al client il file http://localhost:21963/MyService.asmx/js che contiene tutto il codice per permettere l’invocazione del webservice.
jQuery mette a disposizione modi molto più intelligenti di dialogare con il server, in particolare la funzione getJSON che permette di effettuare una chiamata ad una url che restituisce i dati in formato json. Se controllate nel sorgente potrete vedere nella cartella tip4, una pagina aspx chiamata Servicepage.aspx il cui codice è veramente semplice.
public partial class ServicePage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
JavaScriptSerializer serializer = new JavaScriptSerializer();
Response.Write(serializer.Serialize(Membership.GetUser()));
Response.End();
}
}Come potete notare grazie alla classe JavaScriptSerializer è possibile restituire al chiamante un qualsiasi oggetto (in questo caso il MembershipUser) in formato json. Se chiamate direttamente la pagina potete infatti osservare cosa viene restituito.
{"UserName":"admin","ProviderUserKey":"5f7b1fdb-0322-4cab-96d8-c1c3771f414d","Email":"a@nablasoft.com"
,"PasswordQuestion":null,"Comment":null,"IsApproved":true,"IsLockedOut":false,"LastLockoutDate":"\/Date
(-6816268800000)\/","CreationDate":"\/Date(1242062048000)\/","LastLoginDate":"\/Date(1242470020860)\
/","LastActivityDate":"\/Date(1242470194907)\/","LastPasswordChangedDate":"\/Date(1242062048000)\/","IsOnline"
:true,"ProviderName":"SqlProvider"}Sebbene questa stringa sia di difficile lettura, è semplicemente la serializzazione json dell’oggetto MembershipUser, ecco quindi che nella pagina tip4/auth.aspx basta referenziare lo script scripts/tip4/auth.js che non fa altro che recuperare tramite jQuery tutte le info sull’utente attualmente loggato.
$(function() {
$('.askname').log('button').click(function() {
var button = this;
$.getJSON('/Tip4/ServicePage.aspx', {}, function(result) {
//Here result object has the same properties as MembershipUser
$(button).siblings('.userdata').text(
'UserName:' + result.UserName + ' Email:' + result.Email );
});
});
});Grazie alla getJSON si può invocare una pagina ed impostare come callback, una funzione anonima il cui unico parametro è l’oggetto restituito dalla pagina. L’aspetto importante è che nella callback si accede direttamente alle proprietà dell’oggetto MembershipUser come la result.UserName e result.Email. Tutto questo grazie al fatto che javascript è un linguaggio dinamico ;) e quindi può riscostruire l’oggetto dalla stringa json senza problemi.
Il vantaggio di questo approccio è evitare di passare al client file js inutili e anche in questo caso dato che la pagina che restituisce i dati è una normalissima pagina aspx, potete usare Session, Membership, proteggere la pagina con i ruoli, etc etc.
alk.
Il codice è scaricabile da qui.
Tags: jQuery