18 janvier 2010

Flex & .Net (part 2/3) : WebORB


Voici la seconde partie de l’article sur la communication entre un client Flex et un backend .Net
Voir la première partie : Flex & .Net (part 1/3) : FluorineFX
Voir la troisième partie : Flex & .Net (part 3/3) : Le bilan




Ma première application avec Weborb .net


Installez et configurez IIS et. NET

IIS est un pré-requis à l’installation de webOrb. Veuillez l’installer au préalable. Si IIS à été installé après .NET, vous devez inscrire .NET avec IIS. Cela peut être fait avec l’outil aspnet_regiis qui se trouve dans [windows]\microsoft.net\Framework\vX.XXX. Exécutez la commande suivante:


aspnet_regiis -i

Installez Weborb

Téléchargez WebORB de themidnightcoders et l’installer. Si vous installez WebORB sur votre serveur local, après la procédure d’installation, vous devriez avoir l’accès à l’Application WebORB sur cette URL: http://localhost/weborb30/. L’emplacement physique de l’installation WebORB sur le disque devrait être /Inetpub/wwwroot/weborb30/.


Côté Serveur

Maintenant, nous pouvons créer notre application serveur. Dans Visual Studio, nous devons créer un nouveau projet. Utilisez le modèle qui est maintenant intégré dans votre projet Visual Studio – catégorie Class library with WebOrb.

Ajoutez les classes définies ci-dessous à votre projet:


1
2
3
4
5
6
7
8
9
10
11
12
using System;	
 
namespace vo
{
  public class DataInfo
  {
    public DateTime dateValue;
    public string stringValue;
    public bool booleanValue;
    public int intValue;
  }
}



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
using System;
using System.Collections.Generic;
using System.Text;
 
using vo;
 
namespace service
{
  public class DataInfoService
  {
 
    public IList<DataInfo> getDataList()
    {
      List<DataInfo> result = new List<DataInfo>();
      for (int x = 0; x < 10; x++)
      {
        result.Add(getData(x));
      }
      return result;
    }
 
    public DataInfo getData()
    {
      return getData(0);
    }
 
    private DataInfo getData(int x)
    {
      DataInfo dataInfo = new DataInfo();
      dataInfo.intValue = x;
      dataInfo.stringValue = "value " + x.ToString();
      dataInfo.dateValue = new DateTime(2009, x + 1, x + 1);
      dataInfo.booleanValue = x % 2 == 0;
 
      return dataInfo;
    }
  }
}


Compilez votre projet (Générer -> Générer [projectName]). Visual studio génère une bibliothèque de classes dans le répertoire bin de votre projet,

Pour déployer l’assemblé sur WebORB nous avons 2 options :


  • Vous pouvez copier la dll dans le dossier /bin de l’application ASP.NET WebORB (ie /Inetpub/wwwroot/weborb30/bin)
  • Utilisez l’onglet « déploiement » de la console de gestion WebORB (http://localhost/weborb30/) puis cliquez sur le bouton deploy Assembly puis sélectionnez votre assemblé(dll)

Le résultat final devrait être le même, l’assemblé est déployée et  peut être appelée à partir de l’application Flex.

Une fois déployée, vous pouvez tester le service avec WebORB console (http://localhost/weborb30/weborbconsole.html) , onglet Deployment).


Écrire l’application Flex

  1. Lancez Flex Builder et créez un nouveau Flex Project.
  2. Copiez le contenu du répertoire inetpub\wwwroot\weborb30\web-inf\flex dans votre projet. Ces fichiers sont les fichiers de configuration qui contiennent notamment la définition des canaux de communication entre l’application client et le serveur applicatif (WebORB).
  3. Ajoutez l’argument de compilation suivant:
  4. -Services services-config.xml
  5. Ajoutez les fichiers définis ci-dessous à votre projet

  6. 1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application 
      xmlns:mx="http://www.adobe.com/2006/mxml" 
      layout="vertical">
      <mx:Script>
        <![CDATA[
          import mx.collections.ArrayCollection;
          import mx.charts.chartClasses.DataDescription;
          import mx.utils.ObjectUtil;
          import vo.DataInfo;
          import flash.net.registerClassAlias;
          import mx.rpc.events.FaultEvent;
          import mx.rpc.events.ResultEvent;
          import mx.rpc.remoting.RemoteObject;
          import mx.events.FlexEvent;
     
          private function handleGetDataButtonClick(event:Event):void
          {
            service.getData();
          }
          private function handleGetDataListButtonClick(event:Event):void
          {
            service.getDataList();
          }
          private function handleGetDataResult(event:ResultEvent):void
          {
            var data:DataInfo = event.result as DataInfo
            log.text += ObjectUtil.toString(data);
          }
          private function handleGetDataListResult(event:ResultEvent):void
          {
            var data:Array = event.result as Array;
            log.text += '\n'+ObjectUtil.toString(data);  
          }
          private function handleFault(event:FaultEvent):void
          {
            log.text += '\n'+ObjectUtil.toString(event.fault);
          }
     
        ]]>
      </mx:Script>
        <mx:RemoteObject id="service"   destination="GenericDestination"
                         source="service.DataInfoService" fault="handleFault(event)">
          <mx:method name="getData"     result="handleGetDataResult(event)"/>
          <mx:method name="getDataList" result="handleGetDataListResult(event)"/>
        </mx:RemoteObject>
      <mx:HBox>
        <mx:Button label="DataInfoService.getData"     click="handleGetDataButtonClick(event)" />
        <mx:Button label="DataInfoService.getDataList" click="handleGetDataListButtonClick(event)"/>
      </mx:HBox>
      <mx:TextArea id="log" width="100%" height="100%"/>
    </mx:Application>



    ACTIONSCRIPTDataInfo.as
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    
    package vo
    {
      [RemoteClass(alias='vo.DataInfo')]
      public class DataInfo
      {
        public function DataInfo() {}
     
        public var dateValue:Date;
        public var stringValue:String;
        public var booleanValue:Boolean;
        public var intValue:int;
      }
    }


  7. Vous pouvez maintenant exécuter l’application.




Voir la première partie : Flex & .Net (part 1/3) : FluorineFX

Voir la troisième partie : Flex & .Net (part 3/3) : Le bilan


  • Twitter
  • LinkedIn
  • viadeo FR
  • Facebook
  • Google Buzz
  • Netvibes
  • Tumblr
  • del.icio.us
  • Digg


2 commentaires

Ajouter votre commentaire
  1. PIA Blog / Productivity by Design » Flex & .Net (part 1/3) : FluorineFX
    [...] traite de la communication entre un client Flex et un backend .Net. Voir la seconde partie : Flex & .Net (part 2/3) : WebORB Voir la troisième partie : Flex & .Net (part 3/3) : Le [...]
  2. PIA Blog / Productivity by Design » Flex & .Net (part 3/3) : Le bilan
    [...] Flex & .Net (part 3/3) : Le bilan Par Eric             Catégorie: Developpement  Voici la dernière partie de l’article sur la communication entre Flex et un backend .Net Voir la première partie : Flex & .Net (part 1/3) : FluorineFX Voir la seconde partie : Flex & .Net (part 2/3) : WebORB [...]