in

DotNetSide

Dot Net South Italy Developers User Group

Articoli

Articoli pubblicati dagli iscritti a .netSide

Silverlight 2.0 e l'accesso ai dati

di Vito Arconzo

Rilasciata da qualche settimana in beta 2, la versione 2.0 di Silverlight, offre davvero maggiore flessibilità e potenza rispetto alla prima versione di questa tecnologia Silverlight 1.0.

La differenza principale tre le due versioni sta nella modalità di interazioni con la pagina o con il controllo Silverlight stesso. Infatti, entrambi utilizzano XAML per "descrivere" il layout ma nella versione 2.0 abbiamo a disposizione il .NET Framework per poter gestire la parte di code-behind invece di Javascript usato nella versione 1.0.

Ovviamente, questo significa un più immediato accesso ai dati attraverso le classi messe a disposizione dal framework senza ricorrere a tecniche AJAX come si è costretti nella prima versione.

In questo articolo vedremo l’architettura più comune di implementazione di un’applicazione Silverlight 2.0 che fa uso di dati esposti da un servizio WCF.

INIZIAMO

Iniziamo lo sviluppo dell'applicazione creando, da Visual Studio 2008, un nuovo progetto Silverlight che troviamo nei nuovi templates che sono disponibili dopo l'installazione dei tools di sviluppo per Silverlight scaricabili dal sito ufficiale (http://www.silverlight .net).

image001

Creando un nuovo progetto Silverlight ci verrà chiesto se vogliamo creare anche un nuovo progetto web ASP.NET dove verrà "hostata" l'applicazione Silverlight oppure una semplice pagina web di test. Optiamo per la creazione di un progetto web abbinato in modo da poter, successivamente, aggiungere a questo anche la parte di interrogazione dei dati ed il servizio WCF per l'accesso a questi.

image003

Dopo questa operazione, nel Solution Explorer, avremo il progetto Silverlight e il progetto ASP.NET dove viene referenziato il primo e visualizzato nella pagina ASP.NET attraverso i nuovi controlli server per Silverlight.

Creazione del DAL

Adesso che la struttura dell’applicazione è pronta, possiamo passare alla definizione di un nostro semplice DAL dove saranno contenuto gli oggetti che rappresenteranno le tabelle del database, serializzabili, per poter essere utilizzati da servizi WCF. Per la creazione dello strato di accesso ai dati, utilizzeremo la novità del .NET Framework 3.5: Linq, in particolare la versione dedicata ai database SQL Server Linq To SQL.

Aggiungiamo, quindi, al progetto ASP.NET un nuovo oggetto Linq To SQL utilizzando l’apposito template disponibile in Visual Studio 2008.

image005

Aggiungendo il nuovo elemento Linq To SQL al progetto, ci verrà subito proposto il designer per la creazione delle entità che utilizzeremo.

image007

L’operazione di creazione degli oggetti mappati con le tabelle del database, grazie a Linq To SQL, è molto semplice in quanto è sufficiente trascinare le tabelle del database presenti nella Toolbox Server Explorer sull’area dedicata nel designer appena aperto. In questo articolo, come database, viene utilizzato l’onnipresente AdventureWork scaricabile direttamente da Codeplex (per Sql Server 2008 o Sql Server 2005).

Trasciniamo, quindi, la tabella Product presente nel database in uso.

 image009

Il designer, quindi, ci creerà un oggetto Product ed il DataContext associato. Proprio su questo occorre prestare attenzione in questo, per poter essere utilizzato tramite servizi WCF deve essere reso serializzabile attraverso la property SerializableMode impostata a Unidirectional.

image011

Con poche e semplici operazioni abbiamo quindi creato il nostro strato di accesso ai dati che si occuperà di generare automaticamente query al database e sempre, peraltro, ottimizzate.

Creazione del servizio

Passiamo adesso alla creazione del servizio che restituirà i dati interrogati attraverso lo strato Linq To SQL creato in precedenza. Per lo strato dei servizi, utilizzeremo Windows Communication Foundation (WCF) aggiungendo, quindi un nuovo servizio WCF dai templates presenti in Visual Studio 2008.

image013

Per il servizio definiamo, innanzitutto, l’interfaccia che conterrà il metodo GetProducts che restituirà l’elenco di prodotti ovvero una List di oggetti Product.

1 [ServiceContract]
2 public interface IService1
3 {
4 [OperationContract]
5 List<Product> GetProducts();
6 }

Implementiamo l’interfaccia definita nel servizio.

1 public class Service1 : IService1
2 {
3 #region IService1 Members
4
5 public List<Product> GetProducts()
6 {
7 DataClasses1DataContext db = new DataClasses1DataContext();
8
9 var query = (from p in db.Products
10 select p).Take(10);
11
12 return query.ToList();
13 }
14
15 #endregion
16
17 }

Nel metodo GetProduct viene, innanzitutto, creato un oggetto DataCOntext che gestisce autonomamente la connessione alla base dati e, attraverso la sintassi LINQ viene interrogato l’oggetto Product per richiederne i primi 10 elementi contenuti nella tabella e restituiti in formato List.

Nel file di configurazione del servizio, ossia nel file web.config occorre impostare il tipo di binding del servizio impostando questo come basicHttpBinding invece di wsHttpBinding.

1 <service behaviorConfiguration="SilverlightDataAccessWebsite.Service1Behavior"
2 name="SilverlightDataAccessWebsite.Service1">
3 <endpoint address="" binding="basicHttpBinding" contract="SilverlightDataAccessWebsite.IService1">
4 <identity>
5 <dns value="localhost" />
6 </identity>
7 </endpoint>
8 <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" />
9 </service>

Questa operazione è necessaria per il corretto funzionamento del servizio da parte di Silverlight visto che è l’unico formato compatibile con questa tecnologia.

Testiamo il servizio impostando questo come pagina di partenza della web application ASP.NET e lanciando in esecuzione il progetto.

Se il servizio è stato creato correttamente, dovremmo visualizzare la pagina seguente all’interno del browser e possiamo annotarci il percorso evidenziato.

image015

Prima di aggiungere il riferimento del web service all’applicazione Silverlight, occorre impostare una porta fissa su cui eseguire il sito ASP.NET in modo da avere sempre lo stesso e non venga creato dinamicamente.

image017

A questo punto possiamo aggiungere il riferimento del servizio all’applicazione Silverlight attraverso tasto destro “Add Service Reference…” sui References del progetto.

image019

Creazione della UI

Ora che lo strato di accesso ai dati ed il servizio che consumerà questi dati sono pronti possiamo definire l’interfaccia utente nel file Page.xaml che conterrà, appunto, il codice XAML per la definizione del layout. Definiamo un semplice layout contenente un Button per l’avvio dell’interrogazione ed una DataGrid per la visualizzazione dei prodotti restituiti dal servizio.

1 <UserControl
2 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4 xmlns:my="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"
5 x:Class="SilverlightDataAccess.Page"
6 Width="800" Height="600">
7
8 <Grid Background="White" ShowGridLines="True">
9 <Grid.RowDefinitions>
10 <RowDefinition Height="5*" />
11 <RowDefinition />
12 </Grid.RowDefinitions>
13 <my:DataGrid
14 x:Name="dataGrid"
15 Grid.Row="0"
16 />
17
18 <Button
19 Click="Button_Click"
20 Margin="5"
21 Content="Load"
22 Grid.Row="1"
23 />
24
25 </Grid>
26 </UserControl>

Nel code-behind, invece, verrà gestito l’evento click del Button.

1 private void Button_Click(object sender, RoutedEventArgs e)
2 {
3 ServiceReference1.Service1Client client = new SilverlightDataAccess.ServiceReference1.Service1Client();
4 client.GetProductsCompleted += new EventHandler<SilverlightDataAccess.ServiceReference1.GetProductsCompletedEventArgs>(client_GetProductsCompleted);
5 client.GetProductsAsync();
6 }
7

Nell’evento click del Button viene creato un client WCF che conterrà il metodo GetProducts o meglio, conterrà un metodo chiamato GetProductAsync, il nostro metodo eseguito in modalità asincrona per evitare blocchi del browser durante l’esecuzione della richiesta. Inoltre, avremo l’evento Completed del nostro metodo che verrà richiamato al termine dell’elaborazione.

Nell’evento di completamente della richiesta, infine, impostiamo la property ItemsSource del controllo DataGrid proprio con il risultato del servizio.

Cliccando, quindi, il pulsante Load, viene richiamato il servizio ed al suo completamento verrà popolato il controllo DataGrid proprio come nella figura seguente. Come potete notare, inoltre, la grid è completamente editabile e per aggiornare i dati basta utilizzare i metodi di commit messi a disposizioe da LINQ.

image021

Conclusioni

In questo articolo abbiamo come, in maniera abbastanza semplice, è possibile interrogare una sorgente dati attraverso un servizio WCF. Ovviamente, per lo strato di accesso ai dati possiamo utilizzare non solo LINQ ma anche altre tecnologie serializzabile e, quindi, consumabili da un servizio WCF.

Only published comments... Jul 16 2008, 12:00 AM by VitoA
Filed under:

Comments

 

Vito Arconzo's Blog said:

Duranti i vari workshop e training tenuti su Silverlight, ho notato che (ovviamente) la cosa che pi&amp;#249;

July 17, 2008 1:05 AM
Powered by Community Server (Commercial Edition), by Telligent Systems