BrSilverlight

Tutoriais e dicas sobre Silverlight

Sobre o autor

Sou Breno Ferreira, desenvolvedor em um Centro de Tecnologia em Petrópolis especializado em Silverlight. Criei este site com o objetivo de postar dicas, tutoriais e artigos sobre Silverlight, WPF e tecnologias Microsoft.

 

Acessando Azure Tables no Silverlight

Introdução

image_thumb

No ano passado, durante o PDC09, Ray Ozzie, Chief Software Architect da Microsoft, apresentou ao público a estratégia da Microsoft em relação a construção de Software de hoje em diante. Essa estratégia consiste do “lema” “3 Screens and the Cloud”, ou seja, aplicações que são acessíveis e integram-se através de tres dispositivos (TV, PC e Celular). E essas aplicações terão interfaces ricas, e com a centralização dos dados na nuvem, assim provendo uma grande User-Experience.

E para nós desenvolvedores que temos que começar a pensar em como construir essas aplicações, devemos começar a aprender como integrar nossas Rich Internet Applications com serviços hospedados no Azure Services Plataform, e assim centralizar nossos dados e torná-los acessíveis de qualquer lugar, através da internet.

E é sobre essa integração entre o Azure e Silverlight que este post irá tratar. Irei explicar como utilizar o Table Storage do Azure e disponibiliar esses dados através de serviços RESTful utilizando WCF Data Services e acessá-los em uma aplicação Silverlight.

Pré-Requisitos

O código-fonte deste tutorial pode ser baixado aqui:

http://cid-1498c467c14dc20b.skydrive.live.com/self.aspx/BrSilverlight/Tutoriais/CloudGameStorage.Silverlight.zip

Definindo os serviços e acessando o Table Storage

Para começar crie um novo projeto Silverlight no Visual Studio. Agora, crie um projeto do tipo “WCF Service Application”.

image Voce pode deletar o serviço criado automaticamente pelo template (IService1.cs e IService1.svc). Agora, voce irá adicionar duas classes a esse projeto, uma chamada Game e outra chamada GameDataContext.

Game.cs
  1. public class Game : TableServiceEntity
  2. {
  3.     public String Name { get; set; }
  4.     public String Website { get; set; }
  5.     public Int32 NumberOfPlayers { get; set; }
  6.     public Double Rating { get; set; }
  7.     public String Category { get; set; }
  8. }

Snippet 1

Essa classe define o tipo de dados que será salvo no Table Storage do Azure. Note que a classe herda de TableServiceEntity. Assim, o runtime do Azure saberá qual o nome da Table a ser criada e quais os tipos dos dados a ser guardados nessa Table.

Quando herdamos da classe TableServiceEntity, herdamos tres propriedade muito importantes:

PartitionKey: utilizado pelo Load Balancer do Azure para particionar e segmentar as tables no Storage. Assim, cada item das Tables com a mesma PartitionKey será salva no mesmo local e de maneira sequencial, garantindo assim um acesso mais eficiente aos dados.

RowKey: a RowKey é utilizada para identificar uma entidade específica no Table Storage.

Timestamp. essa propriedade é gerenciada internamente pelo Azure e não deve ser modificada. Ela é um valor DateTime que guarda a última modificação a ser feita na entidade.

Obs: o desenvolvedor deverá setar os valores das propriedade PartitionKey e RowKey, e esses valores deverão ser uma String de até no máximo 1K de tamanho.

Note que apesar do nome ser Tables, e cada Table possuir linhas (cada objeto do tipo Game salvo seria uma linha na Table) e colunas (cada propriedade da nossa classe), isso não possui nenhuma ligação com tabelas de banco de dados. Não é possível fazer Joins entre Tables nem ter Primary Keys ou Foreign Keys. Se voce deseja um banco de dados na nuvem, utilize o SQL Azure.

Na classe GameDataContext, adicione o código abaixo:

GameDataContext.cs
  1. public class GameDataContext : TableServiceContext, IUpdatable
  2. {
  3.     private static CloudStorageAccount account = CloudStorageAccount.DevelopmentStorageAccount;
  4.  
  5.     public GameDataContext(String baseAddress, StorageCredentials credentials)
  6.         : base(baseAddress, credentials)
  7.     {
  8.         CloudTableClient.CreateTablesFromModel(typeof(GameDataContext),
  9.                                     baseAddress,
  10.                                     credentials);
  11.     }
  12.  
  13.     public IQueryable<Game> Games
  14.     {
  15.         get { return this.CreateQuery<Game>("Games"); }
  16.     }
  17.  
  18.     #region IUpdatable Members
  19.     //thanks to Aleksey Savateyev
  20.     //from his blob post at http://blogs.msdn.com/ales/archive/2009/12/17/update-porting-silverlight-ria-to-windows-azure-data-access.aspx
  21.     
  22.     public void AddReferenceToCollection(object targetResource, string propertyName, object resourceToBeAdded)
  23.     {
  24.         AddLink(targetResource, propertyName, resourceToBeAdded);
  25.     }
  26.  
  27.     public void ClearChanges()
  28.     {
  29.         // clear out links
  30.         foreach (LinkDescriptor link in Links)
  31.             DetachLink(link.Source, link.SourceProperty, link.Target);
  32.  
  33.         // clear out entities
  34.         foreach (EntityDescriptor entity in Entities)
  35.             Detach(entity.Entity);
  36.     }
  37.  
  38.     public object CreateResource(string containerName, string fullTypeName)
  39.     {
  40.         object obj = Activator.CreateInstance(GetType().Assembly.GetType(fullTypeName));
  41.  
  42.         base.AddObject(containerName, obj);
  43.  
  44.         return obj;
  45.     }
  46.  
  47.     public void DeleteResource(object targetResource)
  48.     {
  49.         base.DeleteObject(targetResource);
  50.     }
  51.  
  52.     public object GetResource(IQueryable query, string fullTypeName)
  53.     {
  54.         object resource = null;
  55.  
  56.         // fullTypeName can be null for deletes
  57.         if (fullTypeName == null)
  58.         {
  59.               resource = query.Cast<Game>().SingleOrDefault();
  60.         }
  61.         else
  62.         {
  63.               // Check for types that will be updated or deleted
  64.               if (fullTypeName == typeof(Game).FullName)
  65.               {
  66.                     resource = query.Cast<Game>().SingleOrDefault();
  67.               }
  68.  
  69.               UpdateObject(resource);
  70.         }
  71.  
  72.         return resource;
  73.     }
  74.  
  75.     public object GetValue(object targetResource, string propertyName)
  76.     {
  77.         Type type = targetResource.GetType();
  78.  
  79.         PropertyInfo propInfo = type.GetProperty(propertyName);
  80.  
  81.         if (propInfo == null)
  82.         {
  83.             throw new Exception(string.Format("Can't find given property '{0}'.", propertyName ?? "NULL"));
  84.         }
  85.  
  86.         object val = propInfo.GetValue(targetResource, null);
  87.  
  88.         return val;
  89.     }
  90.  
  91.     public void RemoveReferenceFromCollection(object targetResource, string propertyName, object resourceToBeRemoved)
  92.     {
  93.         DeleteLink(targetResource, propertyName, resourceToBeRemoved);
  94.     }
  95.  
  96.     public object ResetResource(object resource)
  97.     {
  98.         Detach(resource);
  99.  
  100.         return resource;
  101.     }
  102.  
  103.     public object ResolveResource(object resource)
  104.     {
  105.         // Already gave object in CreateResource
  106.         return resource;
  107.     }
  108.  
  109.     public new void SaveChanges()
  110.     {
  111.         try
  112.         {
  113.             base.SaveChanges();
  114.         }
  115.         catch (KeyNotFoundException e)
  116.         {
  117.             var exception = e;
  118.         }
  119.     }
  120.  
  121.     public void SetReference(object targetResource, string propertyName, object propertyValue)
  122.     {
  123.         SetLink(targetResource, propertyName, propertyValue);
  124.     }
  125.  
  126.     public void SetValue(object targetResource, string propertyName, object propertyValue)
  127.     {
  128.         PropertyInfo propInfo = targetResource.GetType().GetProperty(propertyName);
  129.  
  130.         if (propInfo == null)
  131.         {
  132.             throw new Exception(string.Format("Can't find property '{0}'", propertyName ?? String.Empty));
  133.         }
  134.  
  135.         propInfo.SetValue(targetResource, propertyValue, null);
  136.     }
  137.     #endregion
  138. }
Snippet 2

Esta classe será responsável por fazer toda a comunicação com os serviços REST do Azure Table Storage. Por isso, herdamos nossa classe de TableServiceContext, que por sua vez, herda de DataServiceContext. O que isso quer dizer é que estamos utilizando o WCF Data Services para fazer as requisições HTTP com os serviços do Azure Table Storage.

Mas somente herdar de TableServiceContext não resolve todos os problemas. Precisamos implementar a Interface IUpdatable. Assim poderemos executar operações além de somente leitura, como inserts, deletes e updates nos nossos dados.

Agora precisamos colocar os dados de forma acessível aos clientes. Para isso, iremos criar um novo WCF Data Service.

image

Adicione o seguinte código ao serviço:

GameDataService.svc.cs
  1. public class GameDataService : DataService< GameDataContext >
  2. {
  3.     // This method is called only once to initialize service-wide policies.
  4.     public static void InitializeService(DataServiceConfiguration config)
  5.     {            
  6.         config.SetEntitySetAccessRule("*", EntitySetRights.All);
  7.         config.DataServiceBehavior.MaxProtocolVersion = DataServiceProtocolVersion.V2;
  8.     }
  9.  
  10.     protected override GameDataContext CreateDataSource()
  11.     {
  12.         var account = CloudStorageAccount.DevelopmentStorageAccount;
  13.  
  14.         var address = account.TableEndpoint.AbsoluteUri;
  15.         var credentials = account.Credentials;
  16.  
  17.         GameDataContext context = new GameDataContext(address, credentials);
  18.         return context;
  19.     }
  20. }

Snippet 3

Note que aqui nós criamos um serviço que irá expor os dados obtidos com o nosso DataContext criado anteriormente que acessa o TableStorage do Azure.

Importante: o método CreateDataSource é chamado quando o serviço é iniciado. Nesse método passamos as credenciais necessárias para acessar-se o TableStorage. No nosso caso, estamos utilizando as credenciais padrões usadas no ambiente de desenvolvimento provido pelo SDK do Azure. Em ambiente de produção, será necessário passar as suas credenciais para acessar os serviços do Azure.

Acessando os dados no Silverlight

Agora iremos criar nossa camada de apresentação em Silverlight. Para isso crie um novo projeto Silverlight no Visual Studio.

Agora, precisamos adicionar a referência ao nosso serviço ao projeto Silverlight. Para isso, clique com o botão direito no projeto e vá em “Add Service Reference…”.

image 

Na janela que abrir, clique em “Discovery” e o Visual Studio irá achar nosso serviço. Dê um nome a referencia do serviço e clique em OK.

image

Nosso xaml será composto do controle DataForm (caso voce não conheça ou não sabe como usá-lo, veja meu tutorial explicando como ele funciona, que irá mostrar e coletar os dados do usuário, e um botão que irá salvar os dados no Table Storage. Para isso, adicione o seguinte código ao MainPage.xaml:

MainPage.xaml
  1. <UserControl x:Class="CloudGameStorage.Silverlight.MainPage"
  2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  5.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  6.     xmlns:df="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.DataForm.Toolkit"
  7.     xmlns:in="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Input.Toolkit"
  8.     mc:Ignorable="d"
  9.     Loaded="UserControl_Loaded"
  10.     d:DesignHeight="400" d:DesignWidth="572">
  11.  
  12.     <Grid x:Name="LayoutRoot" Background="White">
  13.         <df:DataForm x:Name="gameForm" AutoEdit="False" AutoGenerateFields="False" EditEnding="gameForm_EditEnding" DeletingItem="gameForm_DeletingItem">
  14.             <df:DataForm.EditTemplate>
  15.                 <DataTemplate>
  16.                     <StackPanel df:DataField.IsFieldGroup="True">
  17.                         <df:DataField Label="Name:" Description="Name of the game">
  18.                             <TextBox Text="{Binding Path=Name, Mode=TwoWay}" />
  19.                         </df:DataField>
  20.                         <df:DataField Label="Website:" Description="Website of the game">
  21.                             <TextBox Text="{Binding Path=Website, Mode=TwoWay}" />
  22.                         </df:DataField>
  23.                         <df:DataField Label="Number of Players" Description="Number of players supported by the game" >
  24.                             <in:NumericUpDown Minimum="1" Value="{Binding Path=NumberOfPlayers, Mode=TwoWay}" Width="70" HorizontalAlignment="Left" />
  25.                         </df:DataField>
  26.                         <df:DataField Label="Rating" Description="How good is this game?">
  27.                             <in:Rating ItemCount="5" Value="{Binding Path=Rating, Mode=TwoWay}" />
  28.                         </df:DataField>
  29.                         <df:DataField Label="Category" Description="Game category (Shooter, Sports, Action, ...)">
  30.                             <TextBox Text="{Binding Path=Category, Mode=TwoWay}" />
  31.                         </df:DataField>
  32.                         <!--<df:DataField Label="Image" Description="Game box cover">
  33.                             <Image Cursor="Hand" mouselef />
  34.                         </df:DataField>-->
  35.                     </StackPanel>
  36.                 </DataTemplate>
  37.             </df:DataForm.EditTemplate>
  38.         </df:DataForm>
  39.         <Button Width="50" Height="20" HorizontalAlignment="Left" VerticalAlignment="Top" Content="Save" Click="Button_Click" />
  40.     </Grid>
  41. </UserControl>

Snippet 4

Aqui criamos um DataForm fazendo DataBinding com as propriedades do nosso modelo de dados. Note que tratamos os eventos EditEnding e DeletingItem. Esses  eventos irão adicionar novos items e atualizar seus dados e deletá-los da fonte de dados. O botão será responsável por sincronizar as mudanças com o serviço que acessa o TableStorage.

Agora adicione o seguinte código ao code-behind da MainPage:

MainPage.xaml.cs
  1. public partial class MainPage : UserControl
  2.     {
  3.         private GameDataContext dataContext;
  4.         private Uri serviceUri;
  5.  
  6.         public MainPage()
  7.         {
  8.             InitializeComponent();
  9.  
  10.             //creates the data service context
  11.             this.serviceUri = new Uri("http://localhost:3213/GameDataService.svc");
  12.             this.dataContext = new GameDataContext(this.serviceUri);
  13.         }
  14.  
  15.         /// <summary>
  16.         /// Gets or sets the list of games currently registered
  17.         /// </summary>
  18.         public List<Game> Games { get; set; }
  19.  
  20.         private void UserControl_Loaded(object sender, RoutedEventArgs e)
  21.         {
  22.             //creates a query to get all games saved.
  23.             var query = this.dataContext.CreateQuery<Game>("Games");
  24.  
  25.             //asynchronously executes the query, passing a lambda exp. to get the results.
  26.             query.BeginExecute((result) =>
  27.                 {
  28.                     var games = query.EndExecute(result);
  29.                     
  30.                     //gets the list of games returned by the data service and
  31.                     //set the ItemsSource of the DataForm to use DataBinding
  32.                     this.Games = games.ToList();
  33.                     this.gameForm.ItemsSource = this.Games;                    
  34.                 }, null);
  35.         }
  36.  
  37.         private void Button_Click(object sender, RoutedEventArgs e)
  38.         {
  39.             //Saves the changes made to the games (inserts, updates, deletes).
  40.             this.dataContext.BeginSaveChanges((result) =>
  41.             {
  42.                 this.dataContext.EndSaveChanges(result);
  43.             }, null);
  44.         }
  45.  
  46.         private void gameForm_DeletingItem(object sender, System.ComponentModel.CancelEventArgs e)
  47.         {
  48.             //deletes a game.
  49.             var game = this.gameForm.CurrentItem as Game;
  50.  
  51.             this.dataContext.DeleteObject(game);
  52.         }
  53.  
  54.         private void gameForm_EditEnding(object sender, DataFormEditEndingEventArgs e)
  55.         {
  56.             if (e.EditAction == DataFormEditAction.Commit)
  57.             {
  58.                 //gets the game being edited.
  59.                 var currentGame = this.gameForm.CurrentItem as Game;
  60.  
  61.                 //if the PartitionKey and RowKey is null, then it's a new game.
  62.                 if (currentGame.PartitionKey == null && currentGame.RowKey == null)
  63.                 {
  64.                     currentGame.PartitionKey = DateTime.Now.ToString("MMddyyy");
  65.  
  66.                     // Row key allows sorting, so we make sure the rows come back in time order.
  67.                     currentGame.RowKey = String.Format("{0:10}_{1}", DateTime.MaxValue.Ticks - DateTime.Now.Ticks, Guid.NewGuid());
  68.  
  69.                     //adds a new game.
  70.                     this.dataContext.AddToGames(currentGame);
  71.                 }
  72.                 else
  73.                     //updates the game data.
  74.                     this.dataContext.UpdateObject(currentGame);
  75.             }
  76.         }
  77.     }
Snippet 5

No construtor, criamos o nosso DataContext, que será uma espécie de cliente do nosso serviço, e irá fazer toda a comunicação com o serviço, fazer a serialização dos objetos por debaixo dos panos para nós. Isso ajuda bastante, pois senão teríamos que fazer toda a comunicação e a leitura do ATOM retornado pelo serviço (o que pode ser bem trabalhoso!). Note que precisamos passar a URI do serviço no construtor do DataContext. No meu ambiente de desenvolvimento, o serviço estava rodando na porta 3213, no seu caso, ela pode mudar, então preste atenção nisso e faça as alterações necessárias.

No evento Loaded do UserControl, chamamos o nosso serviço e retornamos os games já cadastrados. Para isso, criamos uma query passando o nome da entidade que desejamos, nesse caso “Games”.

Para receber os dados, precisamos fazer a requisição de maneira assíncrona, então chamamos o método BeginExecute do nossa query, e passamos uma lambda expression que será chamada quando a requisição terminar trazendo os resultados. Esses resultados então são guardados na nossa propriedade Games (do tipo List<Game>) e usado como fonte de dados (ItemsSource) do nosso DataForm para fazermos o DataBinding.

Nos eventos DeletingItem e EditEnding do DataForm, criamos, editamos e deletamos um item do TableStorage. Isso é feito chamando-se o método AddToGames, UpdateObejct e DeleteObject respectivamente. Note que ao chamar esses métodos, a requisição salvar as alterações não é realmente feita. Os dados só são sincronizados quando chamamos o método SaveChanges no evento do click do botão.

Importante: no evento EditEnding definimos as duas propriedades necessárias para todos os items salvos no TableStorage do Azure. Então checamos se esses valores já foram criados para o item que foi editado. Caso esses valores sejam null, setamos a PartitionKey para a data de hoje (assim os objetos criados em um determinado dia serão armazenados sequencialmente e no mesmo lugar no storage do Azure) e a RowKey para um valor que possa ser ordenado pela hora em que eles foram criados, adicionando-se uma GUID que irá identificá-los unicamente.

Conclusão

Neste tutorial, vimos como expor e acessar dados salvos no Table Storage do Windows Azure em uma aplicação Silverlight. Vimos que não é uma tarefa tão complicada e que pode agregar grande valor as aplicações. Principalmente agora, que podemos criar aplicações Silverlight que rodam tanto no PC e Windows Phone. Ou seja, podemos ter nossa aplicação rodando em dois dispositivos acessando os mesmos dados, que estão salvos na núvem, assim acessíveis de qualquer lugar.


Tags: , , ,
Categories: Silverlight | Azure
Posted by breno on domingo, 21 de março de 2010 6:19
E-mail | Kick it! | DZone it! | del.icio.us
Permalink | Comentários (0) | Post RSSRSS comment feed