simulateur de réseau filius niveau 2

Sciences Numérique et Technologie – Page : 1

Simulateur de réseau Filius – Niveau 2

Etape 6 : DHCP

Dans les grands réseaux, il est pratique de configurer un serveur DHCP qui assigne automatiquement les adresses IP aux ordinateurs. Nous allons implémenter un serveur DHCP sur notre réseau.

Reprenez le réseau de l’étape 5 « Peer to peer » et rajoutez un serveur DHCP, donnez-lui l’adresse 192.168.0.10

Puis cliquez sur DHCP server Setup

Rentrez une plage d’adresses IP alant de 192.168.0.100 à 192.168.0.200.

N’oubliez pas de cliquer sur « Activate DHCP »

Ensuite, pour chaque ordinateur, cochez la case “Utiliser DHCP » dans la configuration pour utiliser le serveur DHCP pour l'attribution d'adresse IP. Vous remarquerez que vous ne pourrez pas modifier manuellement les configurations.

Dès que vous passerez en mode simulation tous les fils clignoteront pendant un court instant pour configurer les nouvelles configurations.

Maintenant, démarrez chaque ordinateur et installez le command line. Testez ensuite l'adresse IP attribuée aux ordinateurs par le serveur DHCP à l'aide de la commande ipconfig.

1. Que remarquez-vous ? 2. Rajoutez un second réseau avec un routeur. 3. Configurez les DHCP pour que tous les postes puissent communiquer ensemble. (test par ping)



Etape 7 : Serveurs Mails

Construisez le réseau suivant :

Nom Liz Bob Jef Fmail Hop

Ip adress 192.168.0.10 192.168.1.10 192.168.1.20 192.168.2.10 192.168.2.20

Netmask 255.255.255.0 255.255.255.0 255.255.255.0 255.255.255.0 255.255.255.0

Gateway 192.168.0.1 192.168.1.1 192.168.1.10 192.168.2.1 192.168.2.1

DNS 192.168.2.10 192.168.2.10 192.168.2.10 192.168.2.10 192.168.2.10

Configurer les adresses passerelles dans les routers (attention à bien cocher « Automatic Routing »

FILIUS offre la possibilité de simuler le travail de différents serveurs de messagerie. Au début, nous allons configurer un serveur de messagerie unique et utiliser un ordinateur portable avec un programme de messagerie installé pour utiliser le service de messagerie. Plus tard, nous installerons plusieurs serveurs de messagerie liés les uns aux autres.

Un serveur de messagerie électronique est un logiciel serveur de courrier électronique. Il a pour vocation de transférer les messages électroniques d'un serveur à un autre. Un utilisateur n'est jamais en contact direct avec ce serveur mais utilise soit un client de messagerie installé sur son terminal (ordinateur ou smartphone), soit une messagerie web, qui se charge de contacter le serveur pour envoyer ou recevoir les messages.

Lancez la simulation



Nous allons créer un serveur de messagerie fictif Fmail

Sélectionnez le serveur Fmail pour installer l'application «Email Serveur» et démarrez-la en double-cliquant. Renommez le « mail domain » en fmail.com et créez un nouveau compte avec nom d'utilisateur (user) Liz et password « liz ». Faites de même avec Bob (mdp : bob)

Puis lancez le serveur sur « start »

Ensuite, nous devons configurer notre serveur DNS pour lui faire accepter le nouveau domaine de messagerie.

Démarrez l'application “DNS serveur” sur le serveur Fmail. Ajouter dans l’onglet Mail Exchange (MX) un nouveau domaine de messagerie Mail :

Mail domain fmail.com

Mail server domain name www.fmail.com

Cependant nous devons aussi référencer dans le DNS le nom de domaine www.fmail.com. Dans l’onglet « Adress » du DNS Serveur rajouter le « domain name » www.fmail.com associé avec l’adresse IP du serveur.

Enfin, nous devons installer le programme Email sur l’un de nos portables et le configurer.

Sélectionnez l’ordinateur de Liz pour installer la nouvelle application «Email programme» et lancez-la. Cliquez sur le bouton «Account» pour créer un nouveau compte et configurez-le avec les informations suivantes de votre serveur de messagerie:

Faites de même avec le compte de Bob.

Envoyez un e-mail à Liz avec le compte de Bob pour l’inviter à son anniversaire.

1. Que signifie POP3 et que permet-il ? 2. Qu’est-ce qu’un serveur SMTP ? 3. Dans le « Log panel » de l’application « Email Server », que pouvez-vous observer ?

Activité : Jef a créé un compte e-mail chez le serveur Hop. Configurez ce nouveau client de messagerie @hop.com et envoyez un e-mail à Liz et Bob.

http://www.fmail.com/

http://www.fmail.com/



Etape 8 – Utilisation de Filius sur un réseau local

Composant modem

FILIUS offre également la possibilité de lier plusieurs programmes FILIUS exécutés sur différents ordinateurs d’un réseau local existant, tel qu’une salle de classe. Il est important de vous assurer que votre pare-feu autorise de telles connexions. Pour utiliser cette fonctionnalité, tous les réseaux Filius doivent inclure un modem.

Dans leur réseau virtuel. Le modem de l'un des réseaux virtuels doit être défini en tant que destinataire.

Pour ce faire, cochez la case «Wait for incoming connection request», puis cliquez sur le bouton «Connect» pour commencer à accepter les demandes entrantes.

Tous les modems des autres réseaux virtuels peuvent désormais établir une connexion réseau physique en utilisant l'adresse IP réelle du modem récepteur. Tous les modems indiqueront une connexion réussie avec un petit point vert.

Il s’agit d’un réseau comprenant au moins deux ordinateurs exécutant FILIUS et un pare-feu local configuré pour ne pas bloquer les signaux de FILIUS.

Vous pouvez avoir une impression de cette configuration grâce à l'exemple suivant, dans lequel un seul ordinateur portable est capable de communiquer avec le réseau existant physiquement via un modem.

Réseaux virtuels et réseaux physiques

Nous allons relier ensemble plusieurs réseaux Filius grâce à l'exemple suivant, dans lequel un ordinateur portable est capable de communiquer avec le réseau existant physiquement via un modem.

Créez la structure de réseau affichée ci-dessous sur deux ordinateurs (physiquement) différents (appelons-les ordinateur A et ordinateur B) avec les adresses IP de l’ordinateur réel faisant partie d’un réseau physique.

Rappel : Utilisez la commande Ipconfig dans le cmd de Window pour connaitre l’ip privée du réseau !

Sur l'ordinateur A, configurez le modem pour qu'il accepte les demandes entrantes, en cochant la case «Wait for incoming connection request», puis cliquez sur le bouton «Connect».

Sur l'ordinateur B, configurez le modem pour qu'il se connecte à l'ordinateur A. Pour ce faire, insérez l'adresse IP physique de l'ordinateur A dans le champ nommé « adresse IP » du Modem et appuyez sur le bouton «Connect». (Si vous voulez essayer ceci sur un seul ordinateur, écrivez simplement ‘localhost’ en tant qu’adresse IP et choisissez un port.)

Les deux modems afficheront une lumière verte si la connexion est établie avec succès.



Attention : Le modem d’agit que comme un « pont », les ip de toutes les machines doivent toujours avoir la même partie réseau

Activité :

Réalisez un ping de l’ordinateur A sur l’ordinateur B afin de tester la connexion

Faite en sorte que l’ordinateur A puisse accéder à un site web hébergé sur l’ordinateur B (avec un DNS et un Webserver)



Modifier un site web en HTML

Sur Filius, le site web affiché par le webbrowser est toujours identique. Nous allons voir dans cette partie comment modifier une page Web et son code HTML.

Dans l’ordinateur qui héberge un site web, installez « File Explorer », « Text Editor » et « Images viewer »

Dans les fichiers de l’ordinateur vous verrez plusieurs dossiers. Les dossiers du site web se trouvent dans le dossier « webserver ».

Dans ce dossier nous avons 2 documents :

index.html : c’est la page web que vous consulter lorsque vous simulez votre site web

splashscreen-mini.png : c’est l’image qui s’affiche sur le site

Dans l’application « Images Viewer » ouvrez splashscreen-mini.png et dans « Text Editor » ouvrez index.html

L’application « Text Editor » permet de modifier la page index.html.

Nous allons nous intéresser de plus près au code HTML…



Le Web Le Web (ou Toile) est un ensemble d’information numériques reliées et accessibles par des liens cliquables, sur Internet. A partir des années 2000, le Web devient « social » avec l’apparition de sites sociaux comme Facebook, Twitter, Youtube ou Flickr, permettant le partage en tout genre.

Aujourd’hui le Web continue de se développer en devant immersif et en interagissant avec le réel. Ainsi, les accès au Web se diversifient et se joignent à tout type de terminal (lecteur mp3, tablette, smartphone, montre connectée, etc…). Ces données collectées alimentent des bases de données dont l’exploitation et le traitement présentent un enjeu économique majeur.

Le Web démocratise les voix de l’information en se calquant sur le phénomène de mondialisation. Il gomme les frontières, mais reste tout de même façonné selon les lois et les particularités des pays.

Il faut bien différencier Internet et le Web ! Internet est le réseau physique sur lequel se trouve le Web.

Le web désigne un ensemble de données reliées entre elles par des liens hypertexte et accessibles sur Internet, formant ainsi une gigantesque « toile d’araignée »mondial : le World Wide Web !

Les liens Hypertextes

Les pages Web sont constituées de diverses informations (textes, images, etc…) et de liens hypertextes qui permettent de naviguer de l’une à l’autre lorsque l’on clique dessus. Ces liens sont soit des images, soit des morceaux de texte cliquables que les concepteurs de pages Web signalent, par convention, en les soulignant. Au survol de la souris, le curseur se transforme en une petite main. Au clic sur le texte ou l’image, une nouvelle page se charge dans le navigateur.

L’HTML

Depuis sa création en 1990,c’est le langage informatique HTML (HyperText Markup Language) qui est utilisé pour créer des pages Web. C’est l’une des trois inventions issus du W3C avec le protocole http et les adresses Web. Son acronyme signifie « langage de balisage d’hypertexte » car il permet en effet de réaliser de l’hypertexte à base d’une structure de balisage.

Pour accéder au code source d’une page Web, il faut commencer par réaliser un clic droit sur la page. Dans le menu contextuel, il faut ensuite sélectionner la commande « Examiner l’élément »sur Firefox ou « Inspecter » sur Chrome

1. Inspecter le code HTML d’une page Wikipédia



Les balises HTML

Le langage HTML utilise des balises pour délimiter le début et la fin de chaque instruction lue par le navigateur. Chaque instructions HTML est délimitée par une balise ouvrante <élément> et une balise fermante </élément>.

Ces balises sont invisibles à l’écran mais elles permettent au navigateur d’interpréter ce qu’il doit afficher.

HTML

Nous allons modifier notre première page. Pour cela vous ouvrez le logiciel Notepad ++

Notepad++ est un éditeur de texte libre générique, fonctionnant sous Windows, codé en C++, qui intègre la coloration syntaxique de code source pour les langages et fichiers. Ce logiciel, fondé sur la composante Scintilla, a pour but de fournir un éditeur léger (aussi bien au niveau de la taille du code compilé que des ressources occupées durant l’exécution) et efficace.

Vous pouvez, pour vous aider, utiliser le service en ligne Thimble (https://thimble.mozilla.org/fr/) qui permet de modifier du code HTML dans un volet et de vérifier immédiatement son interprétation dans un autre volet.

1. Notepad++

Dans Notepad++, allez dans l’onglet langage et sélectionnez HTML dans l’onglet H.

Un fois Notepad++ ouvert, copier le code HTML qui se trouve dans l’éditeur de texte de FIlius :

Enregistrez sous le nom « mapage.html » dans un fichier accessible. Plus tard, vous pouvez aussi faire un clic droit sur une page HTML et « Editer avec Notepad++.

Pour observer le résultat de votre page, clic droit et faites ouvrir avec Chrome, Internet Explorer ou tout autre navigateur.

En ouvrant la page HTML, que remarquez-vous dans la page affiché ? Pourquoi ?

https://thimble.mozilla.org/fr/anonymous/00dab4bf-7d9e-4b04-820c-30a57785760c



a. Analyse de code

Les balises vont permettre de modifier une partie du texte de la page pour lui donner une particularité. Pour indiquer la section de texte qui va bénéficier de cette particularité, on débute la section par « <truc> » et on la termine par « </truc> ».

On va remarquer trois balises principales :

La balise <HTML> … </HTML> qui permet d’indiquer que tout ce qu’elle contient est du code HTML ;

La balise <HEAD> ... </HEAD> qui va contenir des informations sur la page comme son titre ;

La balise <BODY> … </BODY> qui va contenir les éléments à afficher de la page (texte, image, …).

Nous allons identifier le rôle des différentes balises présentent dans le document. Donnez le rôle de chacune des balises en vous appuyant sur la page web:

<title> … </title>

<h2> … </h2>

<p>…</p>

<img>

Certaines balises contiennent à l’intérieur des paramètres. Les paramètres de balises permettent de configurer de manière un peu plus précise ce qu’elles contiennent.

Donnez le rôle de chacun des paramètres suivant :

bgcolor="#ccddff"

style="font-family:Verdana

text-align:center

src="splashscreen-mini.png

b. Mise en forme du texte

Pour mettre en forme le texte nous pouvons utiliser plusieurs balises :

La balise </br> pour sauter une ligne ;

soit fermer et ouvrir les balises <p> pour créer des paragraphes et donc un saut de ligne avec espacement automatique.

<B></B> pour du texte en gras et <I></I> pour Italique

Il est aussi possible de créer des listes avec des puces pour cela il faut utiliser deux balises :

Les balises <ul> … </ul> pour indiquer le début et la fin de la liste ;

Les balises <li> … </li> pour indiquer chaque item.

Les balises HTML ne sont pas à connaitre par cœur. N’hésitez pas à regarder sur Internet pour trouver les votre ou consulter le memento HTML mis à disposition dans le document ressource.

Memento des balises HTML

https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3/1608357-memento-des-balises-html

https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3/1608357-memento-des-balises-html



c. Les liens Hypertextes

Pour créer un lien vers une page web qui se trouve dans le même dossier vous devez utiliser les balises a de la manière suivante :

<a href="nomdelapage.html">Texte du lien</a>

Attention ! Toutes vos pages HTML et les images doivent se trouver dans le même dossier. Si une page ou un document ne se trouve pas dans ce dossier et que vous n’avez pas indiqué dans votre code le chemin pour le retrouver, cela affichera une erreur ou une image manquante !

Modifier un site web en HTML

Activité : Sur notepad++, concevez un nouveau site Web pour vous présenter. Ce sera le site www.monnom.com. Copier ensuite l’ensemble du code HTML dans les fichiers du webserver (ainsi que les images potentiellement utilisées)

Projet de classe

Concevez un réseau sur chaque ordinateur permettant :

De créer une adresse mail et d’envoyer un mail aux autres utilisateurs

D’accéder à un serveur DNS pour retrouver n’importe quel site

Que chacun puisse avoir et consulter une page Web.

(Utilisez des modems pour connecter les différents postes informatiques entre eux)

http://www.monnom.com/

simulateur de réseau filius niveau 2

Documents