APPLICATION WEB POUR UN RESEAU PRIVE

Commande à réaliser

Mise en situation

Le client souhaite mettre à disposition des utilisateurs du réseau local d'une SS2I (Société de Services en Ingénierie Informatique) un logiciel de dessin. Il constituera un outil supplémentaire permettant de réaliser les illustrations des documents techniques produits par l'entreprise, dans un format unique et standard.

Le réseau de cette entreprise comporte environ 230 ordinateurs, répartis sur six pôles de compétitivité. Le client a validé la proposition de solution décrite ci-après.

Choix du type de logiciel

On peut distinguer deux grandes familles d'applications :

Dans les applications client-serveur, on distingue :

Les applications client lourd requièrent l'installation d'une application sur chaque poste utilisateur.

Les applications web constituent un exemple classique d'application client léger. Elles sont hébergées sur des serveurs et accessibles via un navigateur web. Elles ne sont installées qu'une seule fois sur le serveur. Il n'est donc pas nécessaire de passer sur chaque ordinateur du réseau local.

Les avantages sont évidents :

Choix du lieu d'installation

L'application peut être installée :

Le réseau local de l'entreprise est préféré. En effet, l'application doit fonctionner de manière efficace, même dans le cas d'un ralentissement ou d'un dysfonctionnement de l'accès à internet.

Choix de l'application

Les logiciels de dessin peuvent produire deux sortes d'images :

Les images vectorielles présentent l'avantage de conserver leur qualité optimale quel que soit l'agrandissement choisi. On retient le format SVG (Scalable Vector Graphics), basé sur XML et compatible avec les langages du web.

On propose l'éditeur libre SVG-edit, dont les caractéristiques semblent correspondre à celles recherchées.

Choix du serveur

Le serveur est installé sur un machine virtuelle, créée à l'aide du logiciel de virtualisation VirtualBox. La sauvegarde de l'installation est ainsi grandement simplifiée. En effet, il suffit de copier-coller le dossier contenant le disque dur de la machine virtuelle.

On propose Slitaz comme système d'exploitation. Celui-ci prend peu de place sur le serveur et devrait suffire pour l'installation demandée.

Pour le serveur web, le choix se porte sur LightTPD. C'est un serveur HTTP sécurisé, rapide, flexible, et utilisant une faible empreinte mémoire.

Installation du serveur

Préparation de la machine virtuelle

1. Récupérez l'image iso de SliTaz. Vous disposez de deux solutions :

2. Démarrez VirtualBox.

3. Créez une machine virtuelle nommé "slitaz_svgedit".

4. Créez un disque virtuel dynamiquement alloué d'une capacité maximale de 2 Go.

5. Configurez le réseau avec le mode d'accès par pont.

6. Placez le CD virtuel de Slitaz (son image ISO) dans le lecteur virtuel.

7. Démarrez la MV et laissez-vous guider : Choisissez la langue, le clavier puis le bureau apparaît.

Installation du système d'exploitation

1. Cliquez sur l'icône "Documentation" sur le bureau puis sur "Getting starded guide (en)". Retrouvez le mot de passe du super utilisateur dans le paragraphe "Becoming Root".

2. Cliquez sur l'icône "SliTaz Panel", en haut à gauche de l'écran. Connectez-vous en tant que super utilisateur.

3. Procédez à l'installation.

4. A l'aide de Gparted, partitionnez le disque dur en deux parties :

5. Continuez l'installation du système sur le disque dur virtuel :

6. L'installation étant terminée, vous pouvez éteindre la MV, retirer le CD virtuel et redémarrer la MV.

Installation du serveur HTTP

Tapez "su" pour vous mettre en root.

Installez ce serveur en tapant, en ligne de commande en tant que root :

# tazpkg get-install lighttpd

L'installation d'un paquet local avec l'extension .tazpkg est également possible :

# tazpkg install lighttpd-1.4.30.tazpkg

Il faut, au préalable, télécharger le paquet en cliquant sur le lien : lighttpd-1.4.30.tazpkg

Utilisation simplifiée du serveur HTTP LightTPD :

Installation de l'application

Mise en place des fichiers

Vous pouvez obtenir SVG-edit de deux manières :

L’installation est extrêmement simple puisque l'application web ne stocke aucune donnée sur le serveur et n’est constitué que d’HTML, de CSS et de JavaScript. Décompressez l’archive en local et placez l'ensemble des fichiers sur le serveur.

Pour décompresser un fichier compressé, vous pouvez utiliser la commande unzip :

unzip nom_du_fichier.zip -d destination

Pour tester le logiciel :

Point d'entrée de l'application

Pour démarrer SVG-edit, les utilisateurs se contenteront de taper l'adresse du serveur dans la barre d'adresse du navigateur. On demande donc de changer le nom du "svg-editor.html" en "index.html".

Testez le résultat obtenu en tapant "http://172.../" dans la barre d'adresse d'un navigateur.

Configuration du serveur

Adresse du serveur

L'adresse IP du serveur doit rester fixe et ne pas être attribuée par le serveur DHCP du réseau.

Démarrage du serveur

Vérifiez que le serveur HTTP démarre automatiquement avec le démarrage de la machine virtuelle.

Sauvegarde du serveur

Recherchez le dossier contenant le fichier slitaz_svgedit.vdi puis sauvegardez ce dossier sur une clé usb.

Configuration de l'application

Désactivation de la fenêtre de démarrage

Par défaut, SVG-edit est configuré pour sauvegarder automatiquement en local dans le navigateur les paramètres personnalisés de l’utilisateur et les images en cours d’édition. Ce comportement peut avoir des conséquences sur la confidentialité des données, lorsqu’un profil de navigateur est partagé par différents utilisateurs par exemple. Une fenêtre s’affiche au démarrage pour que l’utilisateur choisisse quelles données il souhaite mémoriser.

On demande de désactiver cette fenêtre. Pour cela, modifiez le fichier "config.js" et ajoutez

noDefaultExtensions : true,
extensions: [
   'ext-overview_window.js',
   'ext-markers.js',
   'ext-connector.js',
   'ext-eyedropper.js',
   'ext-shapes.js',
   'ext-imagelib.js',
   'ext-grid.js',
   'ext-polygon.js',
   'ext-star.js',
   'ext-panning.js'
],
noStorageOnLoad: true,

juste avant la ligne 11 (allowedOrigins: [window.location.origin]) de manière à désactiver l’extension "ext-storage.js".

Autre solution pour désactiver cette fenêtre

emptyStorageOnDecline : false

Amélioration de la traduction

A l'utilisation, on constate que certains textes n'ont pas été traduits correctement. Améliorez la traduction en modifiant le fichier de langue se trouvant dans "locale/lang.fr.js". Rédigez un compte-rendu des parties traduites.