Accesso ai dati con Siliverlight 2 Beta 1

In questo fine settimana ho passato un po di tempo libero ad approfondire i bit disponibili della Beta 1 di Silverligth 2 . Tra le tantissime novità offerte dal supporto del codice managed,  la nuova versione mette a disposizione un'ampia parte delle librerie .NET tra cui nuovi meccanismi per accedere a dati esposti da siti Internet\Intranet via HTTP.

Sia Internet che nelle intranet è sempre più frequente l'utilizzo dell'HTTP per l'esposizione di informazioni attraverso diverse forme (Web Service Soap,RSS, REST, POX, JSON, etc).

image

Lo scenario tipico di sviluppo Web che prevedeva lo strato di accesso ai dati realizzato direttamente dalla parte server dell'applicazione Web ,  sta rapidamente evolvendo. Anche le  applicazioni  basate sul browser sono sempre più caratterizzate da una larga presenza di codice client, che sfrutta tecniche AJAX   per consumare dati offerti da servizi esposti da server. In particolare diventano sempre più frequenti gli scenari in cui si utilizzano fonti dati esposte da siti differenti, che vengono combinate in un unica interfaccia direttamente sul client.

image

Questo tipo di scenario non riguarda esclusivamente le applicazioni sviluppate per Internet ma diventa sempre più presente anche in scenari Intranet. Con sempre maggior frequenza le aziende cominciano a combinare il software interno con servizi esterni. Le applicazioni e le informazioni aziendali vengono utilizzate in combinazione  con servizi presenti su Internet e con le applicazioni delle aziende clienti o partner, creando scenari un cui la gestione dell'accesso ai dati da parte del codice che gira nel browser client, diventa sempre più sofisticata e complessa. Ad esempio, un azienda che ha bisogno di un software per la gestione di spedizioni presso i propri punti vendita potrebbe sviluppare un applicazione client che aggrega le informazioni sui punti vendita estratte da servizi presenti nella intranet , posizionando i punti vendita sulle mappe fornite da un provider di mappe su Internet ed i servizi del corriere utilizzato per effettuare le spedizioni, integrando con i dati aziendali  i servizi per gli ordini, lo stato della spedizione , etc.

Evidentemente in scenari più complessi di integrazione non tutta l'aggregazione dei servizi può essere implementata nel client , perchè in moltissimi casi il coordinamento dei servizi stessi comporta la gestione di processi asincroni che vanno gestiti con specific Business Process Manager , ma sono comunque molti gli scenari in cui ha senso aggregare nel client. Nel nostro scenario un esempio ll'invio di un ordine di spedizione verrà sicuramente gestito attraverso il BPM dell'azienda che provvederà poi ad inviare l'ordine al servizio del corriere mentre lo stato della singola spedizione  potrebbe direttamente essere richiesto dal client al servizio del corriere e combinato direttamente sulla mappa e con gli altri dati provenienti dall'Intranet.

image

Altra interessante modalità di integrazione dei servizi con i processi dell'azienda è rappresentata dalla possibilità di sfruttare office ed il pattern OBA per collegare un scenario di questo tipo , direttamente con gli strumenti di produttività che le persono utilizzano per portare avanti i processi di tutti i giorni, ed una blla implementazione reale di uno scenario simile è rappresentata daei servizi che sta implementando FedEx mostrati alla office developers conference  .

image 

Con la prima versione di Silverlight gestire l'accesso a fonti dati è possibile direttamente dallo XAML per immagini, video , suoni mentre per l'accesso a sorgenti dati  occorre utilizzare il JS e l'oggetto XmlHttpRequest . Attraverso queste modalità e gia possibile sviluppare delle interessanti applicazioni di mashup (esempio interessante sviluppato in Italia sul blog msdn) , ma ovviamente sviluppare completamente utilizzando JS XMLHttprequest con sorgenti dati JSON o XML non è semplice e nemmeno particolarmente performante nella parte di parsing e caricamento dei dati sull'interfaccia utente.

In alcuni casi, per eliminare il costo del parsing sul client, è anche possibile fare in modo di costruire dei servizi in grado di rispondere direttamente con delle porzioni di XAML che vengono valorizzate server side, con i dati estratti da sorgenti specifiche e caricati a partire da template disponibili sul server. Lato client si può utilizzare XMLHttpRequest o il downloader di Silverlight per connettrsi all'url sul server che restituisce lo XAML contenente i dati e caricarlo nell'interfaccia utilizzando CreateFromXaml . Questo Howto mostra un semplice esempio di utilizzo di questa tecnica che sfutta lo XAML mentre questo mostra l'utilizzo di web service da Silverligh 1.0  .

image

L'utilizzo di AJAX e quindi dello JavaScript e di XMLHttpRequest per accedere a fonti dati remote comporta una notevole difficoltà di debug ed è sottoposto alle restrizioni imposte dal browser per il cross-scripting . Infatti attraverso questa tecnica possono essere interrogati solo URL residenti sullo stesso dominio da cui è stata caricata la pagina in esecuzione sul Browser. E' possibile attraverso specifiche tecniche di impiego di script dinamici o proxy lato server, Iframe etc, superare una parte di queste limitazioni , ma il risultato incrementa ancora di più la complessità di sviluppo e debug.

Con l'arrivo di Silverlight 2 (SL2) ed il supporto di .NET nello sviluppo con Silverlight abbiamo a disposizione un' ampia serie di classi che andranno ulteriormente ad arricchisi nella versione finale del nuovo plug-in. Attraverso SL2 abbiamo a disposizione le classi per consumare sia Web Service SOAP che per accedere direttamente a URL in GET e POST che per l'utilizzo di RSS , aggiunte anche le classi per gestire socket in uscita. Attraverso il nuovo modello di sviluppo è possibile anche effettuate cross-scripting attraverso quei siti che impostano sulla root del loro dominio il file di policy per questa funzionalità. Viene supportato anche il file di policy di Flash , per cui su tutti i siti in cui è già presente questo file è possibile fare crossscripting con Silverlight.

image

Oltre al supporto per il cross-scripting, il nuovo modello di controlli di SL2 supporta le funzionalità di databinding con le stesse modalità che sono utilizzate nel .NET Framework e Windows Presentation foundation , rendendo di fatto estremamente semplice anche il caricamento dei dati estratti dai servizi  sui controlli dell'interfaccia utente. Disponibile anche il supporto per LINQ to XML che ci permette di gestire con semplicità la manipolazione delle strutture XML estratte dai servizi.

Facciamo un esempio pratico provando a sviluppare un client per video.msn.com ed in particolare per estrarre un elenco di video casuale e visualizzare le informazioni fornite in formato XML dall'URL: https://catalog.video.msn.com/randomVideo.aspx?mk=us&vs=0&ff=99&c=10&random=12345   . Di seguito l'XML che viene restituito dal servizio di MSN:

image

La piccola applicazione che realizzeremo avrà quindi la seguente struttura:

image

In particolare per accedere alle informazioni utilizzeremo la classe System.Net.WebClient messa a disposizione dalla versione di .NET associata a SL2 che consente di accedere ad URL Internet in GET e POST a patto di contattare un URL sullo stesso dominio da cui abbiamo scaricato l'applicazione o su un dominio che ha posizionato sulla sua root un file di policy per il cross-scripting Silverlight o Flash. Infatti su catalog.msn.video.com troviamo il file clientaccesspolicy.xml :

 image

Per costruire il nostro client SL2 utiliziamo Visual Studio 2008 selezionando lo specifico template di progetto per Silverlight scegliendo di farci generare anche il progetto Web per il test dell'applicazione:

image

 image

Ottenendo così una soluzione con due progetti: uno per l'implementazione dell'applicazione SL2, l'altro per l'applicazione Web:

image

SL2 supporta oltre al Canvas due nuovi controlli di Layout , ovvero i contenitori per il posizionamento dei controlli sulla nostra interfaccia. Per il nostro esempio utiliziamo una Grid, equivalente a quella che abbiamo nel fratello maggiore WPF, con due righe all'interno delle quali inseriremo gli elementi fondamentali dell'intrfaccia: nella prima riga i controlli per impostare i parametri della ricerca sul contenuto dei risultati, nella seconda il contenuto selezionato in base ad i parametri di ricerca impostati. Per poter inserire , impostiamo ,inoltre, la proprietà ShowGridLines a true per visualizza la struttura della griglia:

image

image

Sull'handler dell'evento click del controllo Button inserito per effetuare la ricerca:

 image

 

inseriamo il codice che utilizzando la classe WebClient  ci permetterà di accedere ai dati di cataalogo. La classe WebClient mette a disposizione i metodi per accedere ed estrarre informazioni da un URL solo attraverso un pattern asincrono. Per accedere al catalogo di MSN video ed estrarre le informazioni in XML utilizzaremo il seguente codice:

image

image

Le informazioni in XML ottenute dal servizio possono essere direttamente caricate in u Array utilizzando Linq To Xml . Per utilizzare questa funzionalità occorre referenziare lo specifico assembly System.Linq.Xml :

image

Dove ns è una proprietà per gestire in namespace contenuto nel file XML, GetUriAsset un metodo helper per estrarre idati e VideoSource una specifica classe inserita nel progetto per rappresentare le informazioni dei video:

image

Ottenuto l'array con le informazioni , possiamo sfruttare il databinding e collegare direttamente la collezione contenente i dati da visualizzare ad uno dei nuovi controlli offerti da SL2 completi di supporto per il databindig. Per questo semplice esempio utilizzeremo direttamente il nuovo controllo DataGrid che aggiungeremo allo XAML:

image

e poi lo collegheremo ai dati usando la proprietà ItemSource:

image

Ottenendo a runtime il seguente risultato:

image

Come tutto il modello dei controlli di SL2 in maniera speculare a quanto possibile in WPF è possibile definire dei template di visualizzazione per i controlli. Infatti , ad esempio, nella colonna contenente l'url dell'immagine di preview possiamo impostare un template per fare visualizzare l'immagine al posto dell'url nella specifica colonna utilizzando la funzionalità di databinding per collegare i dati ad i controlli inseriti nel template.

Nel nostro esempio, in particolare, andiamo ad usare il template della RowDetails ovvero la riga di dettaglio che viene supportata dal DataGrid per ogli riga inserita. Impostiamo un template sulla riga di dettaglio per permettere la visualizzazione dell'immagine di preview del video. Il campoSource del controllo immagine lo colleghiamo al campo ImageUrl del datacontext con la specifica funzionalità di databinding ( {Binding ImageUrl} ) corrente e  impostiamo anche la specifica proprietà della DataGrid che ci permette di mostrare la RowDetails nel momento in cui la riga viene selezionata:

image

Il risultato ottenuto a runtime sarà il seguente:

image

Oltre al campo Image, possiamo anche direttamente inserire un MediaElement e riprodurre il direttamente il video.

image

image

Agendo con altri template è possibile personalizzare completamente la griglia così come qualunque altro controllo adattandola come vogliamo alle nostre esigenze grafiche.

Come abbiamo già detto l'oggetto WebClient è solo uno dei meccanismi offerti da SL2 per l'accesso ai dati. Per l'accesso a servizi SOAP silverlight mette a disposizione lo stack client di WCF permettendo l'utilizzo del classico modello "Add Service Reference" che consente di generare da Visual Studio una classe proxy a partire dai metadati del WSDL esposto dal servizio, classe che poi può essere usata direttamente per l'accesso a servizio. Anche in questo caso il proxy genera solo la possibilità di utilizzare con un pattern asincrono le chiamate al servizio, per evitare di bloccare l'interfaccia utente. Di seguito uno schema dello stack WCF per SL2.

image

Facciamo anche un piccolo progetto di test per l'utilizzo di Web Services da SL2 utilizzando WCF come servizio server. Sviluppiamo un semplice client SL2 per estrarre le informazioni dei clienti del classico database Northwind esposto attraverso un servizio WCF. Partiamo con un nuovo progetto Silverlight e selezioniamo anche la costruzione dell'applicazione Web di test. 

All'interno dell'applicazione web di test aggiungiamo un modello LINQ To Sql  per accedere alla tabella Customers del database Northwind :

image

Con il wizard di LINQ To Sql selezioniamo la tabella Customers e ci facciamo generare il modello di classi per l'accesso ai dati dal nostro ORM:

image

Impostiamo la specifica proprietà che ci consente di rendere serializzabili le classi generate da Linq To Sql:

image

Aggiungiamo un servizio di tipo WCF al nostro progetto:

image

Dove implementiamo la seguente interfaccia per estrarre l'elenco dei clienti dal database customers che sono in una specifica città:

image

Implementiamo l'interfaccia sul servizio ed impostiamo con LINQ la query per estrarre i clienti in base al parametro selezionato:

image

Come ultimo step per permettere l'accesso a SL2 al servizio, impostiamo come profilo di banding il basicProfile , agendo sul file di configurazione della nostra applicazione client per fare in modo che l'implementazione SOAP del servizio sia compatibile con il Basic Profile SOAP che viene supportato da SL2:

image

Lato SL2 implementiamo una semplice interfaccia per l'invio della richiesta al servizio e la visualizzazione della risposta:

image

Per poter agganciare il servizio, dal progetto SL2 usiamo la classica add service reference, selezionando il servizio WCF :

image

L'ambiente di sviluppo carica il WSDL esposto dal servizio e ci implementa il proxy necessario per l'accesso al servizio e la configurazione di WCF:

image

Sull'evento di click del Button query inserito nell'interfaccia SL implementiamo il codice per accedere al servizio , e sul metodo di callback agganciamo non il databinding la DataGrid ai dati estratti dal servizio:

image

Completando il nostro esempio:

image

Per approfondire questo aspetto vi consiglio :  https://msdn2.microsoft.com/en-us/library/cc296254(VS.95).aspx

In SL2 avremo a disposizione anche i serializzatori JSON . Al link  https://code.msdn.microsoft.com/SilverlightWS   trovate alcuni esempi del supporto JSON su cui il team di sviluppo sta lavorando :

image

Interessante anche la funzionalità prevista per l'ambiente di sviluppo paste as XmlSerializable che ci consentirà da VisualStudio di fare copia e incolla di un frammento XML per generare direttamente una classe tipizzata per rappresentare lo stesso XML con una classe .NET, cosa che in parte è possibile con il tool da riga di comando XSD.EXE di .NET.

image

Disponibile anche il supporto per i socket, ma solo verso il dominio da cui è stata scaricata l'applicazione (no crossscripting al momento) ed il supporto per Syndication che è praticamente identico a quello disponibile in .NET 3.5.

Per chi volesse cominciare a provare Silverlight 2 suggerisco i seguenti link:

- https://silverlight.net/GetStarted/#betajump dove trovate i link per installare il Runtime , le estensioni per Visual Studio 2008 e la versione di Expression Blend per SL2

- https://silverlight.net/learn/tutorials.aspx    tutorial sul Silverlight 2

- https://silverlight.net/learn/labs.aspx .    laboratori sulle nuove funzionalità di Silverlight 2

 

Al link https://silverlight.net/Quickstarts/Remote/default.aspx trovate un quickstart sugli argomenti trattati.