Nous installerons ce serveur dans une machine virtuelle VMWare sur notre Mac.

Récupérez l’image du serveur Centos 5.5 qui est une version 32 bit

1 – Virtualisation

Pour l’installer dans VMWare, voici les étapes à suivres:

1. Dans le menu File, cliquer sur New
2. Sélectionnez le fichier iso que vous venez de récupérer
3. Dans le choix du système d’exploitation, choisissez : Linux et dans version : Autre Linux 2.6

Notes : Dans le dernier panneau de l’assistant, vous pouvez cliquer sur le bouton de Réglages. Assurez-vous que le réseau est en mode Pont (ou Bridged) afin de pouvoir obtenir une adresse IP pour votre serveur et communiquez avec lui facilement. Ce réglage est modifiable après installation, machine virtuelle arrêtée, via le menu Machines Virtuelles->Réglages

L’installation du serveur débute. Suivez les instructions.
Quelques minutes plus tard…
Une fois que CentOS est prêt (vous devez avoir le bureau en mode graphique) nous pouvons commencer à nous intéresser à la partie FMS.

Le clavier Macintosh ne semble pas être reconnu correctement. Pour cela nous allons utiliser le Terminal d’OS X pour nous connecter sur CentOS.
Arrêter la machine virtuelle de CentOS et cliquez dans le menu Machines Virtuelles->Réglages. Assurez-vous que le réseau est en mode Pont (ou Bridged) afin de pouvoir obtenir une adresse IP pour votre serveur et communiquez avec lui facilement.
Redémarrez CentOS. Lancez un Terminal CentOS et tapez la commande /sbin/ifconfig pour déterminez l’adresse IP de CentOS (192.168.1.90 pour moi).
Depuis un Terminal OS X, tapez

ssh <username>@<adresse IP Centos>

pour vous y connecter (j’ai créé un nom d’utilisateur centos).

Corebook:~ olivier$ ssh centos@192.168.1.90
The authenticity of host 'localhost (192.168.1.90)' cannot be established.
RSA key fingerprint is cf:65:d0:8b:ff:f5:f5:93:3c:4b:f7:6e:d6:1c:6a:ed.
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added 'centos,192.168.1.90' (RSA) to the list of known hosts.
centos@190.168.1.90 password:

2 – Flash Media Server

Nous pouvons maintenant nous concentrer sur la partie Flash Media Server. Pour commencer nous allons le télécharger ici. (il vous faudra un compte Adobe)
J’ai récupéré la version Flash Media Streaming Server 4 (en version Linux).

Vous allez récupérer un fichier zip (FlashMediaServer_4_all.zip) d’environ 460 Mo. Après extraction, allez dans le répertoire

pour y trouver deux fichiers:

• FlashMediaServer4_x64.tar.gz
• FlashMediaServer4.tar.gz

Lancez un autre Terminal OSX, tapez les commandes suivantes pour copier l’archive FMS sur notre serveur CentOS (dans la commande scp, remplacer centos par votre nom d’utilisateur CentOS et l’adresse IP par celle affiché par la commande ifconfig):

Corebook:~ olivier$ cd Downloads/FlashMediaServer_4_all/linux
Corebook:linux olivier$ scp FlashMediaServer4.tar.gz centos@192.168.1.90:/home/centos

Une fois la copie terminée, revenez sur la session CentOS de votre Terminal OS X et décompressez l’archive sur place:

centos@locahost:~$ tar -xzf FlashMediaServer4.tar.gz

Un répertoire FMS_4_0_0_r1121 est créé (au moment de la rédaction de cet article).

Pour installer FMS, nous devons passer en mode superuser :

centos@localhost:~$ su
root@localhost:~$ cd FMS_4_0_0_r1121
root@localhost:~/FMS_4_0_0_r1121$ ./installFMS

Le processus d’installation commence.

• Faites défiler les termes de la license en appuyant frénétiquement sur la barre espace.
• A la demande du numéro de license, appuyer sur la touche Entrée. FMS se lancera en mode développement (limité en connexion)
• Pour les autres questions, appuyer sur Entrée pour accepter les valeurs par défaut. Les valeurs sont stockées dans le fichier /conf/fms.ini.

3 – Comment tester ?

Le plus simple pour tester la configuration et d’essayer de streamer la video d’exemple fournie avec FMS.
Pour cela, nous allons effectuer une petite modification de la configuration de notre serveur Apache sur CentOS qui nous permettra de streamer la video directement depuis Safari sur le Mac.

Dans le Terminal OS X connecté en SSH à CentOS, ouvrez le fichier de configuration d’apache (en mode superuser)

root@localhost:~$ vim /etc/httpd/conf/httpd.conf

En fin de fichier, ajouter les lignes suivantes:

# Alias for fms webroot
Alias /fms "/opt/adobe/fms/webroot"
<directory "/opt/adobe/fms/webroot">
       Options Indexes FollowSymLinks MultiViews ExecCGI
       AllowOverride All
       Order allow,deny
       Allow from all
</directory>

Par ces lignes nous indiquons à Apache de créer un répertoire virtuel (accessible depuis le navigateur), sur le répertoire /opt/adobe/fms/webroot où se trouvent les fichiers d’exemples d’Adobe.
Relancez Apache:

root@localhost:~$ /etc/init.d/httpd restart

Dans Safari sur votre Mac, tapez l’url suivante: http://190.168.1.90/fms pour accéder à la page d’accueil (Flash Player 10 obligatoire).

Comme pour la version précédente l’IDE vient sous deux formes :

• version autonome
• version plugin pour éclipse

Les fonctionnalités proposées sont identiques. Ici nous parlerons de la version autonome.

1-Récupération et installation de FB4

Rendez-vous sur cette page. Là, cliquez sur le bouton [Version d'Evaluation] pour charger la page qui vous proposera la version de FB4 à télécharger en fonction des informations récupérées depuis votre environnement.

Je prends ici la version en anglais, étant habitué aux libellés des menus dans cette langue.

Une fois l’archive récupérée et décompressée aller dans le dossier Adobe Flash Builder 4 Standalone, et lancer l’application Install et laissez-vous guider par l’assistant d’installation.
Adobe en profite pour vous installer Flash Player 10, puisque c’est la version minimum pour exécuter du code Flex 4.

Une fois l’installation terminée, lancez l’application et poursuivons la configuration.

2-Installation des WebTools

Les WebTools sont un ensemble de composant qui vont ajouter a Eclipse la possibililité de créer des applications web en java.
Un des éléments intéressant est la possibilité de gérer, depuis Eclipse, votre serveur d’application java (Tomcat par exemple), ce qui permet de débugger le code java, lancer et arrêter le serveur.
Pour les ajouter, procéder aux étapes suivantes:

1. Dans FlashBuilder, allez dans le menu Help puis sélectionnez Install New Software…pour faire apparaître la boîte suivante. Cliquer sur le bouton Add…
   

   Ajout d'un serveur de plugin

2. Dans la boîte de dialogue qui apparaît, remplissez les champs tel que montré sur l’image ci-dessous pour créer une connection au serveur de mise à jour d’Eclipse (le socle de base de FlashBuilder) : http://download.eclipse.org/releases/galileo/
3. Pour ajouter les outils Web Java, sélectionnez ce nouveau site en dans la liste déroulante si ce n’est pas déjà le cas. Patienter le temps que FlashBuilder récupére la liste des plugins disponibles, puis sélectionnez celui intitulé Web, XML and Java EE Development
   

   choix plugin J2EE

4. Cliquez sur les boutons Next> et acceptez le texte de la license pour finir l’installation
5. Redémarrez FlashBuilder

Voilà ! c’est prêt.

1 – Les installations

FlashBuilder 4

Récupérer FlashBuilder 4 sur cette page (nous utiliserons ici la version standalone en anglais pour Mac) et l’installer.

BlazeDS (3 ou 4)

Récupérer BlazeDS 4 sur la page du site des builds (nous utiliserons ici le binaire (3MB) la version 4.0.0.1493 GA d’avril 2010).

Tomcat 6

Récupérer Tomcat 6 sur la page suivante . Dézipper pour installer.

Les WebTools

ATTENTION : Lorsque ce billet a été écrit, l’installation du plugin des WebTools entre en conflit avec le plugin de modeling, une nouvelle fonctionnalité proposée par LiveCycleDS. Ne procédez aux étapes suivantes que si vous êtes sûrs de ne pas utiliser LiveCycleDS.

Les WebTools sont un ensemble d’outils qui ajouteront des fonctionnalités à FlashBuilder, notamment pour développer des applications Web Java

Pour les ajouter, procéder aux étapes suivantes:

1. Dans FlashBuilder, aller dans le menu Help puis sélectionnez Install New Software…pour faire apparaître la boîte suivante. Cliquer sur le bouton Add…
   

   Ajout d'un serveur de plugin

2. Dans la boîte de dialogue qui apparaît, remplissez les champs tel que montré sur l’image ci-dessous pour créer une connection au serveur de mise à jour d’Eclipse (le socle de base de FlashBuilder) : http://download.eclipse.org/releases/galileo/
3. Pour ajouter les outils Web Java, sélectionnez le nouveau site en dans la liste déroulante. Patienter le temps que FlashBuilder récupére la liste des plugin disponibles, puis sélectionner celui intitulé Web, XML and Java EE Development
   

   choix plugin J2EE

4. Redémarrer FlashBuilder

2 – Préparation du projet Java

Basculer en perspective Java EE. Dans le menu de FlashBuilder, sélectionner dans la vue Project Explorer, faire un clic droit Import > War file.
Dans la boîte de dialogue, cliquer sur le bouton Browse… pour sélectionner le fichier blazeds.war.
Dans le champ Web project, entrer le nom de l’application serveur.
Il reste en configurer Tomcat dans Eclipse.
En face de Target Runtime, cliquer sur le bouton New…, sélectionner Apache>Apache Tomcat v6.0 puis cliquer sur le bouton Next.

Dans la fenêtre de choix du serveur, sélectionner Apache > Tomcat v6.0

Choix serveur Tomcat

puis choisir son répertoire d’installation en cliquant sur le bouton Browse… , puis Finish

On revient alors sur le panneau War Import avec le Target Runtime positionné sur Apache Tomcat v6.0. Cliquer sur le bouton Finish.

Il reste à rendre afficher ce serveur dans la vue Servers. Si cette dernière n’est pas déjà présente, vous pouvez l’afficher en allant dans le menu Window > Other Views…Dans la boite de dialogue Show Views qui apparaît, sélectionner la vue Servers

A l’intérieur de cette vue, faire un clic droit puis New > Server et là, sélectionner Apache > Tomcat v6.0 Server.

3 – Création de l’application serveur Java/BlazeDS

Dézipper le fichier .war (en le renommant .zip) pour pouvoir accéder à son contenu.
Dans un explorateur de fichier glisser tous les éléments du dossier WEB-INF, sauf le dossier src, dans le dossier WebContent/WEB-INF de votre application Java (ce n’est pas bien grave de glisser également src, mais il n’est pas utile). Le fichier web.xml ainsi que le dossier lib seront remplacés par ceux de BlazeDS.

Passer en perspective J2EE pour écrire la petite classe Java. Sur le dossier Ressource Java créer un package appelé baao (faire un clic droit puis dans le menu contextuel New > Package ).

Puis, toujours dans ce même dossier, créer une classe TransformationText (click droit, New > Class)

Dans cette classe, taper le code suivant:

package baao;
public class TransformationText
{
    public String inverser(String aValue)
    {
      return new StringBuilder( aValue ).reverse().toString();
    }
    public String mettreEnMajuscule(String aValue)
    {
      return aValue.toUpperCase();
    }
}

Notre petite application web Java est terminée. Il faut maintenant l’ajouter à Tomcat pour qu’elle soit exécutée. Dans la vue Servers, faire un clic droit sur la ligne Tomcat, et dans le menu contextuel sélectionner Add and Remove Projects…Double cliquer sur le projet JavaBlazeDS à gauche pour le faire passer dans la liste Configured

La classe étant prête, il ne reste plus qu’à exposer ses méthodes publiques aux applications Flex grâce à BlazeDS.

4 – Configuration BlazeDS

Nous allons créer la destination correspondant à notre classe Java dans le fichier remoting-config.xml situé dans le répertoire WebContent > WEB-INF > flex du projet . Juste avant la balise fermante </service>, ajouter ce qui suit:

	<destination id="textService">
		<properties>
			<source>baao.TransformationText</source>
			<scope>application</scope>
		</properties>
	</destination>

Nous pouvons à présent démarrer le serveur Tomcat, en faisant clic droit sur sa ligne dans la vue Servers, puis Start

Création de l’application Flex

Basculer en perspective Flex Dans le menu, sélectionner File > New > Flex Project. Entrer le nom du projet (Flex2Blaze) et sélectionner dans la section serveur J2EE, puis BlazeDS. Assurez-vous que la case Create combined… est bien décochée
Cliquez sur Next >

Dans le champ Root folder, à l’aide du bouton Browse…sélectionner le dossier WebContent de votre application JavaBlazeDS précédemment créée.
Dans le champ Root URL, entrer l’url permettant d’accéder à l’application JavaBlazeDS
Dans le Context root entrer le contexte de l’application JavaBlazeDS

Cliquer sur le bouton Validate Configuration. L’avertissement en haut de la boîte n’est pas bloquant. Cliquez sur Finish
Sélectionner le répertoire contenant le WEB-INF de l’application JavaBlazeDS
Ouvrer le fichier Flex2Blaze.mxml et copier le code ci-dessous:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
	<fx:Declarations>
		<s:RemoteObject id="ro" destination="textService"/>
	</fx:Declarations>
	<s:layout>
		<s:VerticalLayout/>
	</s:layout>
	<s:TextInput id="mot" enter="ro.inverser(mot.text);ro.mettreEnMajuscule(mot.text)"/>
	<s:Label text="{ro.inverser.lastResult}"/>
	<s:Label text="{ro.mettreEnMajuscule.lastResult}"/>	
</s:Application>

Il ne reste plus qu’à tester, en faisant simplement clic droit sur le fichier Flex2Blaze.mxml puis Run Application

Exécution de l'application

[Note] Cette méthode reste problématique, suivant certaines configurations (version de FB4, WTP installé…). Un bug a été soumis à Adobe ( bug WTP ). Nous attendrons sa résolution pour mettre à jour ce billet.
N’hésitez pas à voter pour la correction de ce bug pour augmenter sa priorité

Un billet similaire avait été écrit pour la version 3 de FlexBuilder. Cette version est adaptée à FlashBuilder 4.

1 – Les installations

FlashBuilder 4

Récupérer FlashBuilder 4 sur cette page (nous utiliserons ici la version standalone en anglais pour Mac) et l’installer.

BlazeDS (3 ou 4)

Récupérer BlazeDS 4 sur la page du site des builds (nous utiliserons ici le binaire (3MB) la version 4.0.0.1493 GA d’avril 2010).

Tomcat 6

Récupérer Tomcat 6 sur la page suivante . Dézipper pour installer.

Les WebTools

ATTENTION : Lorsque ce billet a été écrit, l’installation du plugin des WebTools entre en conflit avec le plugin de modeling, une nouvelle fonctionnalité proposée par LiveCycleDS. Ne procédez aux étapes suivantes que si vous êtes sûrs de ne pas utiliser LiveCycleDS.

Les WebTools sont un ensemble d’outils qui ajouteront des fonctionnalités à FlashBuilder, notamment pour développer des applications Web Java

Pour les ajouter, procéder aux étapes suivantes:

1. Dans FlashBuilder, aller dans le menu Help puis sélectionnez Install New Software…pour faire apparaître la boîte suivanteCliquer sur le bouton Add…
   

   Ajout d'un serveur de plugin

2. Dans la boîte de dialogue qui apparaît, remplissez les champs tel que montré sur l’image ci-dessous pour créer une connection au serveur de mise à jour d’Eclipse (la base de FlashBuilder) : http://download.eclipse.org/releases/galileo/
3. Pour ajouter les outils Web Java, sélectionnez le nouveau site en dans la liste déroulante. Patienter le temps que FlashBuilder récupére la liste des plugin disponibles, puis sélectionner celui intitulé Web, XML and Java EE Development
   

   choix plugin J2EE

4. Redémarrer FlashBuilder

2 – Préparation du projet Flex/Java dans le même projet

nouveau projet

Sélection dans le menu File > New > Flex Project. Dans la boîte de dialogue, remplissez les champs comme sur l’image ci-dessous, puis cliquez sur Next >

serveur J2EE à configurer

Dans la nouvelle fenêtre nous allons configurer le serveur web Java qui fera tourner notre petite application. Cliquez sur le bouton New…

Choix serveur Tomcat

Dans la fenêtre de choix du serveur, sélectionner Apache > Tomcat v6.0

puis choisir son répertoire d’installation en cliquant sur le bouton Browse… ,puis Finish

De retour sur la boîte de configuration du serveur cliquer dans la liste déroulante pour sélectionner Apache Tomcat, puis cliquez sur Browse du champ BlazeDS WAR File pour sélectionner le fichier .war

war blazeds

NOTE: Un message d’alerte peut apparaitre en haut de cette boîte de dialogue. Il est sans conséquence.

IMPORTANT : Le champ ContentFolder doit comporter la même valeur que le Context root. Cette valeur est utilisée dans l’url de connexion Flex-Serveur.
Il est possible de modifier directement le fichier de propriétés. Ouvrez le fichier .flexProperties situé à la racine du projet que l’on vient de créer. Chercher la propriété serverContextRoot et modifier sa valeur (/WebContent en général) par /FlexAndJava

Le WebContent doit simplement être le même que le nom de l’application.

Puis cliquer sur Finish

Attention. Si le panel Flex Server (dans les propriétés de FlashBuilder) est ouvert, il écrasera cette modification. Il faudra donc de nouveau modifier le fichier et faire un clean du projet.

Il reste à rendre afficher ce serveur dans la vue Servers. Si cette dernière n’est pas déjà présente, vous pouvez l’afficher en allant dans le menu Window > Other Views…Dans la boite de dialogue Show Views qui apparaît, sélectionner la vue Servers

A l’intérieur de cette vue, faire un clic droit puis New > Server et là, sélectionner Apache > Tomcat v6.0 Server.

3 – Création de l’application serveur Java/BlazeDS

Passer en perspective J2EE pour écrire la petite classe Java. Sur le dossier Ressource Java créer un package appelé baao (faire un clic droit puis dans le menu contextuel New > Package ).

Puis, toujours dans ce même dossier, créer une classe TransformationText (click droit, New > Class)

Dans cette classe, taper le code suivant:

package baao;
public class TransformationText
{
    public String inverser(String aValue)
    {
      return new StringBuilder( aValue ).reverse().toString();
    }
    public String mettreEnMajuscule(String aValue)
    {
      return aValue.toUpperCase();
    }
}

Installer la WebApp dans Tomcat

Notre petite application web Java est terminée. Il faut maintenant l’ajouter à Tomcat pour qu’elle soit exécutée. Dans la vue Servers, faire un clic droit sur la ligne Tomcat, et dans le menu contextuel sélectionner Add and Remove Projects…Double cliquer sur le projet FlexAndJava à gauche pour le faire passer dans la liste Configured

La classe étant prête, il ne reste plus qu’à exposer ses méthodes publiques aux applications Flex grâce à BlazeDS.

4 – Configuration BlazeDS

Nous allons créer la destination correspondant à notre classe Java dans le fichier remoting-config.xml situé dans le répertoire WebContent > WEB-INF > flex du projet . Juste avant la balise fermante </service>, ajouter ce qui suit:

	<destination id="textService">
		<properties>
			<source>baao.TransformationText</source>
			<scope>application</scope>
		</properties>
	</destination>

Nous pouvons à présent démarrer le serveur Tomcat, en faisant clic droit sur sa ligne dans la vue Servers, puis Start

5 – Création de l’application Flex

Basculer en perspective Flex. Dans le répertoire src-flex, ouvrir l’application en double-cliquant sur le fichier FlexAndJava.mxml
Entrer le code suivant:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
	<fx:Declarations>
		<s:RemoteObject id="ro" destination="textService"/>
	</fx:Declarations>
	<s:layout>
		<s:VerticalLayout/>
	</s:layout>
	<s:TextInput id="mot" enter="ro.inverser(mot.text);ro.mettreEnMajuscule(mot.text)"/>
	<s:Label text="{ro.inverser.lastResult}"/>
	<s:Label text="{ro.mettreEnMajuscule.lastResult}"/>	
</s:Application>

Il ne reste plus qu’à tester.

6 – Exécuter l’application

Hello World!

En Flex 3, il suffirait de sélectionner dans le menu Run > Run FlexAndJava pour lancer l’application dans le navigateur.
En Flex 4 cette même opération entraîne une page d’erreur 404. En regardant l’url on comprend pourquoi :

http://localhost:8080/FlexAndJava/FlexAndJava/bin-debug/FlexAndJava.html

L’url n’appelle pas notre web application correctement.
Il faut corriger l’url en : http://localhost:8080/FlexAndJava/FlexAndJava.html

Voilà.

Il semble qu’Adobe ne teste pas trop ce type de configuration (vu le nombre de correction à faire) qui est pourtant très pratique pour faire petite application.

Pour des applications de plus grande envergure, une séparation des projets Flex et Java est préférable. Cette installation est expliquée dans un autre billet.

Je vous propose de vous le présenter rapidement (d’après le doc d’installation fournie).

Installation

Récupérer la doc ici ainsi que les jars nécessaires : plugin et annotations .

Jar du plugin:
Ajouter le jar du plugin dans le répertoire plugins de votre Eclipse.

Jar des annotations:
Créer un projet Flex/Java en comme d’habitude, puis faites un clic-droit sur le projet pour ouvrir ses propriétés. Sélectionnez l’élément « Java Build Path » sur la gauche pour pouvoir ajouter le .jar (utilisez le bouton « Add External Jar… »)

Configuration

Nous allons maintenant donnez quelques informations à cet utilitaire pour qu’il sache où générer les classes AS3.

Encore dans cette boîte de dialogue, allez dans Java Compiler->Annotation Processing->Factory Path, pour y cocher la case « Enable project specific settings » puis cliquez sur le bouton Apply.

Toujours dans cette même boîte de dialogue, revenez sur le menu parent (Annotation Processing) pour y ajouter une nouvelle option pour cette annotation.
Cliquez sur le bouton New…
Dans le champ key entrez l’information suivante:
-Acom.faratasystems.dto2fx.output
Dans le champ value entrez indiquez le chemin du répertoire source de où devront être générés vos classes AS3.

Note: C’est ce qu’indique la doc de configuration pour une application Java classique. Pour une application Web, j’ai du ajouter (glisser/déposer) le jar d’annotation dans le répertoire WebContent/WEB-INF/lib pour qu’il soit pris en compte.

Ouf! c’est fini pour la configuration, on va pouvoir coder.

Utilisation de l’outil

Dans le répertoire des sources Java, créer un package vo, puis dedans une classe User avec les propriétés username et password.
Générez les getters/setters.

Au dessus de la classe, ajoutez l’annotation @FXClass ou @FXClass(« <package.classe.flex.NomClasseAS3> »). Sauvegardez pour lancez la compilation et la génération des classes AS3.

package vo;
import com.farata.dto2fx.annotations.FXClass;
//pour générer une classe AS3 du même nom, dans le même package
//il suffit de mettre @FXClass
@FXClass("dto.UserVO")
public class User
{
	protected String _username;
	protected String _password;
 
	public String getUsername() {
		return _username;
	}
	public void setUsername(String username) {
		_username = username;
	}
	public String getPassword() {
		return _password;
	}
	public void setPassword(String password) {
		_password = password;
	}
}

Faites un refresh du projet pour voir apparaître les classes dans le répertoire des sources flex.

Deux classes AS3 sont générées pour chaque classe Java : _ClasseAS3.as et ClasseAS3.as (qui hérite de _ClasseAS3.as)
Ne modifier sous aucun prétexte la classe _ClasseAS3. Le générateur de code l’écrase à chaque modification de la classe Java.
Par contre vous pouvez modifier la classe ClasseAS3.as

Il existe une annotation @FXIgnore que l’on peut positionner sur les méthodes Java afin qu’elles ne soient pas générées.
Par exemple, un @FXIgnore sur un setter, entrainera la génération d’un accesseur get (et uniquement) côté AS3, pour protéger la classe AS3 contre l’écriture.

Conclusion

Cet utilitaire de génération de classe AS3 m’a paru très pratique car bien intégré à Eclipse. Du coup, une fois sa configuration effectuée, il travaille pour nous de façon quasi transparente.

Dites-moi ce que vous en pensez et si vous connaissez d’autres outils de génération intéressant.

Dans l’univers des frameworks web java, il en est un qui s’est imposé depuis quelques années : Spring.
Adobe l’avait reconnu, puisqu’il est assez simple de configurer BlazeDS pour lui indiquer d’utiliser Spring comme container des classes java. Mais il fallait alors gérer la configuration de BlazeDS d’un côté et la configuration de Spring de l’autre.

Il y a quelques mois, Spring a proposé une nouvelle intiative permettant de simplifier l’intégration avec BlazeDS.

Dans ce billet nous vous proposons de créer un petit projet qui vous permettra d’évaluer cette nouvelle solution.

Vous aurez besoin des librairies suivantes contenues dans les projets suivants:

• spring-flex-integration
• spring

Création d’une webapp Flex/Java

Commençons par créer une simple webapp en suivant ce billet si nécessaire.
Note: Dans cet exemple, nous utiliserons une table d’une base de données mysql, mais nous vous laissons libre d’adapter le code à votre propre contexte.

A cette webapp, ajouter (glisser/déposer) les libraries suivantes dans le dossier lib:

• driver de votre base de données
• spring.jar (dans le dossier /dist du projet spring)
• spring-webmvc.jar (dans le dossier /dist/modules du projet spring)
• org.springframework.flex.-1.0.0.RELEASE.jar (dans le dossier /dist du projet spring-flex-integration)
• cglib-nodep-2.1_3.jar (dans le dossier /lib/cglib du projet spring)
• com.springsource.org.codehaus.jackson-1.0.0.jar (dans le dossier /projects/ivy-cache/repository/org.codehaus.jackson/com.springsource.org.codehaus.jackson/1.0.0 du projet spring-flex-integration)

Votre dossier lib doit ressembler à ceci:

Adaptation des fichiers de configuration

 
Maintenant que Spring est en place, c’est sa servlet qui va intercepter les appels Flex vers le serveur. Pour ce faire, nous allons remplacer le fichier web.xml d’origine par ceci:

<?xml version="1.0" encoding="UTF-8"?>
 
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd">
 
<web-app>
    <display-name>Spring BlazeDS Integration</display-name>
    <description>Spring BlazeDS Integration</description>
 
	<!-- The front controller of this Spring Web application, responsible for handling all application requests -->
	<servlet>
	    <servlet-name>Spring MVC Dispatcher Servlet</servlet-name>
	    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
	    <init-param>
	        <param-name>contextConfigLocation</param-name>
	        <param-value>/WEB-INF/config/web-application-config.xml</param-value>
	    </init-param>
	    <load-on-startup>1</load-on-startup>
	</servlet>
 
    <!-- Map all *.spring requests to the DispatcherServlet for handling -->
    <servlet-mapping>
        <servlet-name>Spring MVC Dispatcher Servlet</servlet-name>
        <url-pattern>/spring/*</url-pattern>
    </servlet-mapping>
 
    <welcome-file-list>
        <welcome-file>index.html</welcome-file>
        <welcome-file>index.htm</welcome-file>
    </welcome-file-list>
 
</web-app>

Vous avez du remarqué la référence à un autre fichier : web-application-config.xml. Dans le répertoire WEB-INF de WebContent, créez un nouveau dossier config, puis créez un nouveau fichier nommé : web-application-config.xml .

Son contenu est le suivant pour notre petit exemple:

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	   xmlns:flex="http://www.springframework.org/schema/flex"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
           http://www.springframework.org/schema/beans/spring-beans.xsd
           http://www.springframework.org/schema/flex
           http://www.springframework.org/schema/flex/spring-flex-1.0.xsd">
 
	<!-- Lance le MessageBroker BlazeDS -->
	<flex:message-broker />
 
    <!-- Implementation de CandidateDAO -->
    <bean id="candidate" class="dao.CandidateDAO" >
        <constructor-arg ref="dataSource"/>
    <!-- Exposition de CandidateDAO en tant que destination -->
        <flex:remoting-destination />
    </bean>
 
    <bean id="dataSource" class="org.springframework.jdbc.datasource.DriverManagerDataSource">
        <property name="driverClassName" value="com.mysql.jdbc.Driver" />
        <property name="url" value="jdbc:mysql://localhost:3306/<votre base>" />
        <property name="username" value="<votre compte>" />
        <property name="password" value="<votre mot de passe>" />
    </bean>
 
</beans>

Remarque: Pour faire simple nous exposons directement la la classe DAO, plutôt que de créer une classe façade.

Dans ce fichier, nous devons spécifier toutes les classes dont nous souhaitons rendre les méthodes accessibles à Flex. Cela ce fait par la définition du bean dans lequel on précise le nom complet de la classe, ainsi que le nom de la destination (id= »candidate »).
Par la balise on précise que ce bean sera exposé à Flex.

Du coup, inutile de configurer le fichier remoting-config.xml comme on le ferait dans une projet BlazeDS classique.

Enfin, il est nécessaire de modifier dans le fichier services-config.xml (situé dans WebContent/WEB-INF/flex).
Dabord rajouter un channel par défaut:

    <services>
        <service-include file-path="remoting-config.xml" />
        <service-include file-path="proxy-config.xml" />
        <service-include file-path="messaging-config.xml" />
        <default-channels>
            <channel ref="my-amf"/>
        </default-channels>
    </services>

Ensuite, les urls d’accès aux classes de sérialisation AMF (notez le ‘spring’ dans l’url):

        <channel-definition id="my-amf" class="mx.messaging.channels.AMFChannel">
            <endpoint url="http://{server.name}:{server.port}/{context.root}/spring/messagebroker/amf" class="flex.messaging.endpoints.AMFEndpoint"/>
        </channel-definition>

Côté Java

Nous allons maintenant créer les classes java qui exposeront leurs méthodes pour permettre à Flex d’accéder à la base et de retourner son contenu.
Créez un nouveau package dao, puis créez les classes suivantes:
Classe CandidateDAO.java

package dao;
 
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.List;
import java.util.HashMap;
 
import java.util.Map;
 
import javax.sql.DataSource;
 
import org.springframework.jdbc.core.simple.ParameterizedRowMapper;
import org.springframework.jdbc.core.simple.SimpleJdbcInsert;
import org.springframework.jdbc.core.simple.SimpleJdbcTemplate;
 
public class CandidateDAO implements IGenericDAO<candidate>
{
	private final SimpleJdbcTemplate template;
	private final SimpleJdbcInsert insertCandidate;
 
	private final ParameterizedRowMapper<candidate> rowMapper = new ParameterizedRowMapper<candidate>()
	{
		public Candidate mapRow(ResultSet rs, int rowNum) throws SQLException
		{
			Candidate candidate = new Candidate();
			candidate.setId(rs.getInt("id"));
			candidate.setEmail(rs.getString("email"));
			return candidate;
		}
	};
 
	public List<candidate> findAll() {
		return template.query("SELECT * FROM candidates ORDER BY firstname", rowMapper);
	}
 
	public CandidateDAO(DataSource dataSource) {
		template = new SimpleJdbcTemplate(dataSource);
		insertCandidate = new SimpleJdbcInsert(dataSource).withTableName("Candidate").usingGeneratedKeyColumns("ID");
	}
}

Classe Candidate.java

package dao;
 
public class Candidate
{
	private int id;
	private String email;
 
	public void setId(int id) {
		this.id = id;
	}
	public int getId() {
		return id;
	}
	public void setEmail(String email) {
		this.email = email;
	}
	public String getEmail() {
		return email;
	}
}

Côté Flex

Mettons en place une simple Datagrid pour afficher les résultats:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
	<mx:RemoteObject id="ro" destination="candidate"/>
	<mx:DataGrid dataProvider="{ro.findAll.lastResult}" width="100%" height="100%"/>
	<mx:Button label="Get Data" click="ro.findAll()" />
</mx:Application>

Maintenant vous devriez pouvoir lancer le projet depuis le connecteur Tomcat et lancer l’exécution de l’application Flex.
Si tout se passe bien vous devriez voir le contenu de votre table s’afficher.

Ajout de la sécurité

Attention:Testez bien tous les niveaux d’accès de votre application avant de la déployer. L’implémentation telle que décrite ci-dessous fonctionne telle que décrite, mais n’a pas été testée au-delà.
La possibilité de gérer finement l’accès aux méthodes des services exposés est un atout de Spring/BlazeDS par rapport à BlazeDS seul.

Pour ce faire nous allons un peu modifier me projet que nous venons de mettre en place.

Ajouter de nouvelles librairies java

Sur la page, cliquez sur le lien download de la section « Spring Security » (version 2.0.4 pour nous).
Dans le répertoire dist de cette librairie, copiez les jars suivant dans le répertoire lib de notre projet:

• spring-security-acl-2.0.4.jar
• spring-security-core-2.0.4.jar
• spring-security-core-tiger-2.0.4.jar
• spring-security-taglibs-2.0.4.jar

et également aspectjrt.jar (que vous trouverez dans le répertoire lib/aspectj de la librairie spring)

Modifications de web-application-config.xml

On rajoute les namespaces concernant la sécurité:

<beans xmlns="http://www.springframework.org/schema/beans"
	   xmlns:flex="http://www.springframework.org/schema/flex"
	   xmlns:security="http://www.springframework.org/schema/security"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
           http://www.springframework.org/schema/beans/spring-beans.xsd
           http://www.springframework.org/schema/flex
           http://www.springframework.org/schema/flex/spring-flex-1.0.xsd
           http://www.springframework.org/schema/security
           http://www.springframework.org/schema/security/spring-security-2.0.4.xsd">

On ajoute la possibilité d’utiliser les notations pour définir la sécurité dans le code directement:

<security:global-method-security secured-annotations="enabled" jsr250-annotations="enabled"/>

On indique que l’on ajoute la sécurité au niveau du MessageBroker:

<flex:message-broker>
	<flex:secured />
</flex:message-broker>

On définit la classe chargé de filtrer les accès:

<security:http entry-point-ref="securedEntryPoint"/>
<bean id="securedEntryPoint" class="org.springframework.security.ui.preauth.PreAuthenticatedProcessingFilterEntryPoint"/>

Puis on ajoute quelques lignes pour définir les rôles pouvant accéder aux services

<security:authentication-provider>
    <security:user-service>
	<security:user name="admin" password="admin" authorities="ROLE_USER,ROLE_ADMIN" />
		<security:user name="user" password="user" authorities="ROLE_USER" />
	</security:user-service>
</security:authentication-provider>

Et puis on va en profiter pour faire la déclaration du service non pas dans le fichier xml, mais par annotation. Une seule des deux déclarations possible à la fois.
Transformer le bean « contact » en lui enlevant la baliser <flex:remoting-destination />

<bean id="candidate" class="dao.CandidateDAO" >
    <constructor-arg ref="dataSource"/>
</bean>

Voilà concernant ce fichier.

Modification de la classe java exposant le service

On va maintenant pouvoir rajouter les annotations sur la classe java pour indiquer les filtres d’accès aux différentes méthodes.
Ajoutez ces annotations juste au-dessus de la classe:

@Service("candidate")
@RemotingDestination(channels={"my-amf"})

Maintenant, ajoutons les annotations d’accessibilité aux méthodes, dont voici deux exemples:

/*
* accessible uniquement au role ROLE_ADMIN
*/
@RemotingInclude
@Secured("ROLE_ADMIN")
public List<candidate> findAll() {
	return template.query("SELECT * FROM candidates ORDER BY firstname", rowMapper);
}
/*
* accessible à tous
*/
@RemotingInclude
public Candidate findById(int id) {
	return template.queryForObject("SELECT * FROM candidates WHERE id=?", rowMapper, id);
}

Il est possible d’indiquer à Spring qu’une méthode, même publique, ne devra pas être exposé à Flex, en utilisant l’annotation : @RemoteExclude

Modification de la partie Flex

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"
creationComplete="onCreationComplete()"
>
<mx:Script>
<![CDATA[
private function onCreationComplete():void
{
	ro.setCredentials("admin","admin");
//			ro.setCredentials("user","user");
}
private function onLogoutClick():void
{
	ro.logout();
}
]]>
</mx:Script>
<mx:RemoteObject id="ro" destination="candidate"/>
<mx:HBox>
	<mx:Button label="Load!" click="ro.findAll();ro.findById(3)"/>
	<mx:Button label="Logout" click="onLogoutClick()"/>
</mx:HBox>
<mx:Label text="Candidate(3)={ro.findById.lastResult.email}"/>
<mx:DataGrid dataProvider="{ro.findAll.lastResult}" width="100%" height="100%"/>
</mx:Application>

Cette application fait appel aux 2 méthodes exposées.
Tester-la en mode admin et user pour voir la différence.
Il doit être possible de trapper l’erreur de sécurité de façon plus propre en utilisant l’évènement fault sur le RemoteObject.

En cas de comportement inattendue, fermer votre navigateur (pour enlever le swf du cache), et relancer l’application.

Le bouton logout permet d’indiquer au serveur une déconnexion de l’application. Sinon, la session est conservée et si l’on ne fait que relancer l’application (ou rafraîchir), une erreur est générée.

Encore une fois, cette application semble fonctionner correctement. Mais indiquez en commentaires les erreurs que vous pourriez rencontrer.
Note: Ce billet a été écrit en se basant sur ce billet ainsi que celui-ci.

La raison est assez simple : chaque application Flex contient une partie du framework. Le Flash Player ne contient aucune classe Flex, ce qui le rend plus léger au téléchargement et aussi plus indépendant des évolutions.

Adobe nous donne cependant la possibilité de séparer notre swf applicatif des classes du framework.
Il y a un gros avantage à cette façon de déployer notre application. Le framework peut donc être disponible au téléchargement en tant qu’entité propre (sans classes applicatives). Il se trouve alors sous la forme d’un fichier d’extension .swz (signé par Adobe, qui pour le moment est la seule société à pouvoir signer des librairies). Ce fichier signé, une fois téléchargé, peut alors résider dans le cache du Flash Player (et pas du navigateur comme un vulgaire swf).
Vous voyez tout de suite l’intérêt si toutes les applications Flex étaient compilées de cette manière. Plus personne n’aurait à télécharger le framework, et les applications Flex seraient allégées en poids.

Comment procéder ? C’est très simple. Sous Flex Builder, dans les propriétés du projet (clic droit sur le projet puis Properties), sélectionnez « Flex Build Path » dans le panel de gauche.
Là, la combo box intitulée « Framework linkage » affiche par défaut « Merge into code » (c’est à dire que le framework est intégré dans le swf de votre application).
Il suffit de sélectionner l’autre option « Runtime shared library (RSL) » pour externaliser le framework.

Après cette opération, le projet est recompilé, et vous pouvez voir apparaître dans le répertoire bin-debug, les fichiers framework_3.2.0.3958.swz et framework_3.2.0.3958.swf.
Ces deux fichiers sont à déployer sur votre serveur de production, dans le même répertoire que votre application Flex.
(Note: Le swf est pour les Flash Player < 9.0.115 )

Le fichier du framework pèse environ 550 Ko. C’est donc pénalisant lors du premier chargement (quand le Flash Player ne l’a pas dans son cache). Mais par la suite on gagne quelques centaines de Ko.
Une petite action de plus pour sauver la planète !

Sur downloads dans la rubrique « Adobe Flash Player 10 Update for Flash CS4 Professional » télécharger le gros zip de 41 Mo.

Dézipper et dans le répertoire Debug, prendre l’installeur qui vous correspond. (ActiveX pour IE, Plugin pour FireFox) et aussi les versions standalone.

2- S’assurer d’avoir la version 3.0.2 de FB

En effet, celle-ci contient le SDK 3.2 dont le compilateur sait générer des swf pour le FP10. Pour vérifier votre version de FB, menu Help/About Adobe FlexBuilder 3 en bas à gauche pour la version (procédure de maj ?)

3- Récupérer le projet

Ce projet contient une appli qui utilise la nouvelle API du FP10 pour le File Reference (en parler)

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:net="flash.net.*">
	<mx:Script>
		<![CDATA[
 
			private function saveAsFile():void
			{
				fr.save(logArea.text, "MyFile.txt");
			}
 
			private function loadFile():void
			{
				fr.browse();
			}
 
			private function loadComplete():void
			{
				var bt:ByteArray = fr.data as ByteArray;
				logArea.text = bt.readUTFBytes(bt.length);
			}
 
		]]>
	</mx:Script>
 
	<net:FileReference id="fr" complete="loadComplete()" select="fr.load()"/>
 
	<mx:Panel height="100%" width="100%">
		<mx:TextArea id="logArea" height="100%" width="100%"/>
		<mx:ControlBar>
			<mx:Button label="Load" click="loadFile()"/>
			<mx:Button label="Save" click="saveAsFile()"/>
		</mx:ControlBar>
	</mx:Panel>
</mx:Application>

Normalement, par défaut ce projet ne devrait pas compiler (l’API FP10 n’est pas reconnue)

4- FP10 Pour le projets de type ‘Flex Project’

Il suffit d’aller dans les propriétés du projet ;
dans l’onglet « Flex compiler » mettre la version du wrapper à 10 – 0 – 12

C’est tout (normalement, ça devrait recompiler tout seul) et les erreurs devrait partir. Si ce n’est pas le cas, faire un clean

-Yann ]]> http://blog.baao.com/blog/?feed=rss2&p=139 1 http://blog.baao.com/blog/?p=109 http://blog.baao.com/blog/?p=109#comments Mon, 02 Feb 2009 12:49:37 +0000 olivier http://baao.com/blog/?p=109 « Faudrait que tu installes un serveur FMS sur ton Mac pour faire des tests ». La tâche ne me paraissait pas compliquée. Un p’tit coup de google et hop! l’affaire devrait être réglée.

 Et puis après quelques clics, modifications de critères de recherche j’ai bien l’impression que je m’embarque dans une installation un peu exotique, pour les raisons suivantes :

1. FMS 3.5 vient de sortir, donc pas beaucoup de commentaire, support…
2. Adobe précise que le linux supporté est Red Hat (mais un linux est un linux n’est-ce pas ?)
3. Pas de support de Mac OS X

1 – Virtualisation

L’environnement de production est un ubuntu server 8. Autant se mettre dans le même environnement pour effectuer les tests. Pour cela, je vais donc installer Ubuntu server sur le Mac, grâce à VMWare (L’installation de VMWare s’effectue sans soucis donc je ne la détaille pas ici).
Attention, la version Desktop de Ubuntu ne semble pas permettre l’installation de FMS (message « plateforme non reconnue »)
Sur la page de téléchargement du site Ubuntu sélectionner bien l’onglet « Server ». J’ai pris la version par défaut (32 bits), car je n’ai pas réussi à installer FMS avec la version 64 bits (même après triturage des scripts d’installation. Le fichier fmsini ne semble pas pouvoir se lancer. Si l’un de vous y parvient la solution m’intéresse). Sélectionner un miroir et récupérer le fichier iso (environ 650 Mo).

Pour l’installer dans VMWare, voici les étapes à suivres:

1. Dans le menu File, cliquer sur New
2. Sélectionnez le fichier iso que vous venez de récupérer
3. Quand le panneau des options est affiché, cliquez sur l’icône de l’adapteur réseau pour sélectionner le mode « Bridged ». Ce mode vous permettra d’associer une adresse internet à votre serveur virtuel différente de celle de votre machine.

La configuration est terminée. Allez dans le menu Virtual Machine et sélecionnez le menu « Start up guest… » pour commencer l’installation du serveur. (Note: pour récupérer la souris, appuyez sur Pomme/Command + Ctrl)

Pour faire simple, on ne créera pas de partition (on prend tout l’espace attribué par défaut, 20Go).

Concernant les packages à installer (dans la liste proposée en fin d’installation), il n’est pas nécessaire d’en installer un. Mais il est bien pratique d’avoir au moins un serveur LAMP installé (Linux/apache/MySQL/PHP) que nous allons donc sélectionner et installer.

Attention, Apache et FMS peuvent entrer en conflit au niveau du port 80. FMS peut en effet streamer sur ce port pour essayer de passer les firewall (mais certain sont plus malins que ça et bloquent quand même). Voir plus loin dans ce billet.

Une fois l’installation terminée, le serveur est relancé:

Bien que nous ayons installé le clavier Français Macintosh, vous remarquerz que les caractères spéciaux (~, | ) ne sont pas reconnus. Pour cette raison il est plus pratique de se connecter à notre serveur Ubuntu virtuel en ssh depuis un Terminal OS X…(soupirs).

Pour cela, dans la fenêtre vmware, sur le prompt connectez vous avec votre identifiant, puis tapez:

sudo apt-get install openssh-server

Cette simple commande va installer et démarrer le deamon ssh sur notre serveur ubuntu, ce qui nous permettra de nous y connecter.

Depuis un Terminal OS X, nous pouvons maintenant taper la commande de connection ssh <identifiant>@<nom du serveur donné lors de l’installation>, ce qui donne pour moi :

Corebook:~ olivier$ ssh olivier@ubuntu
The authenticity of host 'ubuntu (192.168.1.13)' can't be established.
RSA key fingerprint is cf:65:d0:8b:ff:f5:f5:93:3c:4b:f7:6e:d6:1c:6a:ed.
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added 'ubuntu64,192.168.1.13' (RSA) to the list of known hosts.
olivier@ubuntu's password:

2 – FMS

Nous pouvons maintenant nous concentrer sur la partie FMS. Pour commencer nous allons le télécharger ici. (il vous faudra un compte Adobe)
J’ai pris la version Linux du Flash Media Development Server 3.5 update qui est destinée justement aux environnements de test/developpement avec une limitation de 10 connexions simultanées.

Vous allez récupérer un fichier zip (Flashmedia3_5_Int_Strm_ALP.zip) d’environ 275Mo contenant un fichier FlashMediaServer3.5.exe (???…de 100 Mo tout de même) et un fichier FlashMediaServer3.5.tar.gz qui nous intéressera beaucoup plus.
En téléchargeant avec Safari, le fichier zip est placé dans le répertoire Downloads et le zip est automatiquement décompressé.
Lancez un autre Terminal OSX, tapez les commandes suivantes pour copier l’archive FMS sur notre serveur ubuntu (dans la commande scp, remplacer olivier par votre nom d’utilisateur):

Corebook:~ olivier$ cd Downloads/Flashmedia3_5_Int_Strm_ALP/
Corebook:Flashmedia3_5_Int_Strm_ALP olivier$ scp FlashMediaServer3.5.tar.gz olivier@ubuntu:/home/olivier

Une fois la copie terminée, revenez sur la session ubuntu de votre Terminal OS X et décompressez l’archive sur place:

olivier@ubuntu:~$ tar -xzf FlashMediaServer3.5.tar.gz

Un répertoire FMS_3_5_0_r405 est créé. Mais avant de pouvoir effectuer l’installation de FMS sur notre serveur ubuntu, nous devons installer un certain nombre de choses (si le script d’installation ne les trouve pas il s’arrêtera en cours de route…essayez si vous ne me croyez pas Je vous ai fait une synthèse de mes recherches sur internet.

Sur le prompt Ubuntu de votre Terminal OSX, tapez:

olivier@ubuntu:~$ sudo apt-get install libnspr4-dev

Puis nous devons patcher le script d’installation pour l’adapter aux spécificité de Ubuntu:

cd FMS_3_5_0_r405
olivier@ubuntu:~/FMS_3_5_0_r405$ wget http://www.joeterranova.net/code/fms-3.5-ubuntu.patch
olivier@ubuntu:~/FMS_3_5_0_r405$ sudo patch -p1 < fms-3.5-ubuntu.patch

Note: Grand merci à Joe ! 

Ensuite, le script d’installation fera appel à chkconfig qu’il ne trouvera pas, pace que sur Ubuntu ce script s’appelle différemment.

Nous allons devoir l’installer et créer un lien/alias pour le faire passer pour chkconfig avec la commande suivante:

olivier@ubuntu:~$ sudo apt-get install sysv-rc-conf
olivier@ubuntu:~$ sudo ln -s /usr/sbin/sysv-rc-conf /sbin/chkconfig

Enfin, le script va chercher à installer FMS sur le user nobody, de groupe nobody. Là encore, sur Ubuntu tout n’est pas tout à fait en place. A nous de le faire:

olivier@ubuntu:~$ sudo addgroup nobody
olivier@ubuntu:~$ sudo usermod -g nobody nobody

Voilà! Notre serveur est prêt. Nous pouvons installer FMS en tapant la commande:

olivier@ubuntu:~$ cd FMS_3_5_0_r405
olivier@ubuntu:~/FMS_3_5_0_r405$ sudo ./installFMS

Note: Il n’y a pas license pour cette version. Quand le script vous le demande, appuyer sur la touche Entrée. Puis à la question:

You have not entered a serial number.  Falling back to
the Adobe Flash Media Development Server!
 
Would you like to try again? y/n:  Default [n]: n

Tapez n puis Entrée.
Note 2:

The Adobe Flash Media Server communicates on the IANA-assigned
port of 1935, which is the port most Flash applications expect,
and can also communicate on port 80, both for tunneling Flash
over HTTP, and for proxying HTTP to a webserver.
 
Please enter the Adobe Flash Media Server port(s), comma-separated
Default [1935,80]: 1935

Remarquez que le port 80 peut-être utilisé par FMS (pour faire du RTMPT, c.à.d. RTMP encapsulé dans HTTP). Comme nous avons notre serveur Apache sur ce port, entrez 1935 pour interdire à FMS l’utilisation du 80. Ces valeurs sont modifiables après installation dans le fichier /conf/fms.ini.

A la question sur l’installation d’Apache tapez ‘n’, encore une fois pour ne pas entrer en conflit avec une version existante:

Do you want to install apache? (y/n)
Default [y]: n

Voici mes réponses en résumé:

----------- Install Action Summary -----------
WARNING: You have chosen to overwrite a previous installation.
 
Installation directory         = /opt/adobe/fms
 
Flash Media Server Port        = 1935
Flash Media Admin Server Port  = 1111
 
Apache Install                 = No
 
Administrative username        = admin
Administrative password        = (suppressed)
 
service owner                  = nobody
 
service user                   = nobody
service group                  = fms
 
Run as daemon                  = Yes
Start Flash Media Server       = Yes
 
Proceed with the installation? (y/n/q):

Une fois que vous tapez ‘y’, FMS s’installe et est lancé en fin de procédure.

Vous devriez obtenir les messages suivants en fin d’installation:

Installing Adobe Flash Media Server files...
Configuring Adobe Flash Media Server...
Adding "fms" service.
Setting default admin to "fms".
Applications directory created at /opt/adobe/fms/applications. Add users that will install applications to the fms group.
update-rc.d: warning: /etc/init.d/fms missing LSB style header
 Adding system startup for /etc/init.d/fms ...
   /etc/rc0.d/K20fms -> ../init.d/fms
   /etc/rc1.d/K20fms -> ../init.d/fms
   /etc/rc6.d/K20fms -> ../init.d/fms
   /etc/rc2.d/S20fms -> ../init.d/fms
   /etc/rc3.d/S20fms -> ../init.d/fms
   /etc/rc4.d/S20fms -> ../init.d/fms
   /etc/rc5.d/S20fms -> ../init.d/fms
Setting autostart for "fms".
Server:fms command:start
NPTL 2.8.90
Starting Adobe Flash Media Server (please check /var/log/messages)
 
Admin server:fmsadmin command:start
Starting Adobe Flash Media Admin Server (please check /var/log/messages)
 
The Adobe Flash Media Server installation is complete.

3 – Comment tester ?

Le plus simple pour tester la configuration et d’essayer de streamer la petite video fournie avec FMS.
Pour cela, nous allons effectuer une petite modification de la configuration de notre serveur Apache qui nous permettra de streamer la video directement depuis le Mac.

Ouvrez le fichier de configuration d’apache:

olivier@ubuntu:~$ sudo vim /etc/apache2/apache2.conf

Note: remplacer vim par votre editeur en ligne préféré.
En fin de fichier, ajouter les lignes suivantes:

# Alias for fms webroot
Alias /fms "/opt/adobe/fms/webroot"
<directory "/opt/adobe/fms/webroot">
       Options Indexes FollowSymLinks MultiViews ExecCGI
       AllowOverride All
       Order allow,deny
       Allow from all
</directory>

Par ces lignes nous indiquons à Apache de créer un répertoire virtuel (accessible depuis le navigateur), sur le répertoire /opt/adobe/fms/webroot où se trouvent les fichiers d’exemples d’Adobe.
Relancez Apache:

olivier@ubuntu:~$ sudo /etc/init.d/apache2 restart

Dans le navigateur préféré de votre Mac, tapez l’url suivante: http://ubuntu/fms
Vous devriez voir la jolie vidéo du train (à condition d’avoir Flash version 10 mais la mise à jour se fait en un simple click .

Sinon rendez-vous sur mon billet sur ce même blog.

1- Créons la JavaFlexApp

a- Création du projet Flex

Dans la perspective Flex Development allez dans le menu File->New->Flex Project

b- Etape 1

1. Project Name : JavaFlexApp
2. Application Type : Web Application
3. Application server Type : J2EE
4. Décochez Use remote object…service
5. Cochez Create combined…WTP
6. Changez le java source folder : srcjava

Next…

c- Etape 2

J’ai laissé toutes les valeurs par défaut

Next…

d- Etape 3

J’ai changé pour srcflex (je préfère

Finish…

Pour ceux qui ont connu l’équivalent en Flex 2, c’est trop simple

2- Codons la partie serveur

a- Créons la classe Clock

Basculons dans la perspective J2EE pour créer la classe Java com.baao.test.Clock (cliquez droit sur le répertoire Java Resources: srcjava puis New-> Class) dont voici le code:

package com.baao.test;
 
import java.util.Date;
 
public class Clock
{
  public String getTimeAsString()
  {
    return (new Date()).toString();
  }
}

b- Créons la JSP ClockView.jsp

Cliquons droit sur le répertoire WebContent puis New->JSP. Recopions le code ci-dessous:

<xml version="1.0" encoding="utf-8"?>
<%@page import="com.baao.test.Clock;"%>
 
<%
	//Pour éviter la mise en cache par le navigateur de la réponse
	response.setHeader("Cache-Control","no-cache");
	response.setHeader("Pragma","no-cache");
	response.setDateHeader ("Expires", 0);
%>
 
<info&gt;
  <date><%= (new Clock()).getTimeAsString() %></date>
</info>

Testons

1. Lancer le serveur s’il ne tourne pas (dans la vue serveur)
2. Sélectionnons la JSP par un click droit Run as->Run on server
3. Sélectionnez le bon serveur (Tomcat 6 chez moi)
4. Ajoutons JavaFlexApp au projet
5. Update du Context Root
6. Finish…

3- Du Flex, du flex, du flex !

Création

Dans srcflex, remplaçons le contenu de la JavaFlexApp.mxml par:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	creationComplete="clockService.send()">
 
	<mx:HTTPService id="clockService" url="ClockView.jsp"/>
 
	<;mx:Label id="clockLabel" text="{clockService.lastResult.info.date}"/>
	<mx:Button label="Refresh!" click="clockService.send()"/>
 
</mx:Application>

b- Exécution

Sur ce mxml, click droit puis Run as->Flex Application

Bienvenue dans le monde JavaFlexApp

-Yann