Gymnase

Apparence

TP Réseaux ​

Objectifs ​

  • Expliquer et utiliser les ports
  • Héberger un site web sur son propre ordinateur
  • Connaître son adresse IP privée et publique
  • Tester la connexion entre deux ordinateurs
  • Utiliser un DNS

Théorie ​

Les ports ​

Un ordinateur possède des ports physiques et des ports logiciels. Les premiers permettent de connecter des périphériques à l'ordinateur. Les seconds permettent de connecter des logiciels à l'ordinateur.

Les ports logiciels sont les points d'entrée et de sortie d'un ordinateur sur un réseau. Lorsqu'on souhaite communiquer avec un ordinateur sur un réseau, on indique son adresse IP et le port logiciel sur lequel on souhaite communiquer.

Les ports sont numérotés de 0 à 65535 (encodés sur 16 bits). Les ports de 0 à 1023 sont réservés pour les services les plus courants. Par exemple :

  • 80 pour le web
  • 443 pour le web sécurisé
  • 25 pour le courrier électronique SMTP
  • 25565 pour le jeu Minecraft

Hébergement ​

Héberger un site web veut dire qu'on expose le site web sur un port d'un ordinateur. Par exemple, on peut exposer notre site web sur le port 80. Ainsi, les autres ordinateurs peuvent accéder à notre site web en utilisant notre adresse IP et le port 80.

Pratique ​

Héberger votre propre site web ​

Héberger sur le port 80 ​

  • Ouvrez le Terminal sur le dossier site-web, pour cela :
    • Avec le Finder, naviguez jusqu'à votre dossier site-web où devrait se trouver votre site index.html
    • Effectuez un clic-droit sur le dossier et sélectionnez Nouveau terminal au dossier.
  • Lancez le serveur web avec la commande python3 -m http.server 80 dans le terminal :
    • Copiez la commande sur le terminal
    • Appuyez sur la touch Enter
  • Ouvrez votre navigateur web et allez à l'adresse http://localhost

Héberger sur un autre port ​

  • Arrêtez le serveur web avec la combinaison de touches Ctrl + C.
  • Relancez le serveur web sur le port 8080 avec la commande python3 -m http.server 8080 dans le terminal.
  • Sur votre navigateur web, allez à l'adresse http://localhost:8080
  • Choisissez un port entre 1024 et 65535 et lancez le serveur web sur ce port avec la commande python3 -m http.server <port> dans le terminal, par exemple python3 -m http.server 1291
  • Indiquez le numéro de port choisi sur la feuille Excel partagée sur Teams tp-reseaux.xlsx.

Connaître son adresse IP ​

  • Allez sur https://www.whatismyip.com/ pour connaître votre adresse IP publique.
  • Pour voir votre adresse IP privée, choisissez le menu Pomme > Préférences Système, puis cliquez sur Réseau.
  • Comparer les deux adresses IP. Que remarquez-vous ? Pourquoi ?
  • Comparer vos adresses IP avec celles de vos camarades de classe.
  • Indiquez vos adresses IP sur la feuille Excel partagée sur Teams tp-reseaux.xlsx.

Tester la connexion entre deux ordinateurs ​

  • Sur votre navigateur web, tapez l'adresse ip avec le bon port d'un·e de vos camarades de classe. Par exemple http://10.0.0.0:1291.
    • Que voyez-vous ?
    • Que se passe-t-il si vous tapez l'adresse IP publique de votre camarade de classe ?
    • Essayez avec l'adresse ip avec le bon port de votre propre ordinateur.

Utiliser le DNS du Gymnase ​

  • Sur chaque ordinateur, il y a une étiquette avec un nom. Par exemple gyp-mac-009-00.
    • On peut utiliser ce nom pour accéder à l'ordinateur depuis un autre ordinateur à la place de l'adresse IP.
    • Notez le nom de votre ordinateur sur la feuille Excel partagée sur Teams tp-reseaux.xlsx.
  • Sur votre navigateur web, accédez à la page web d'un·e de vos camarades de classe en utilisant le nom de son ordinateur. Par exemple http://gyp-mac-009-00:1291.

Lier les sites web ​

Réponses HTTP ​

Lorsque vous accédez à un site web, votre navigateur envoie une requête HTTP au serveur web. Le serveur web répond avec une réponse HTTP qui contient un code de statut et un corps. Le code de statut est un nombre à trois chiffres qui indique si la requête a réussi ou non. Par exemple :

  • 200 : OK
  • 301 : Moved Permanently
  • 404 : Not Found
  • 500 : Internal Server Error

Le site https://httpstatus.io/ permet de visualiser les codes de statut HTTP d'un site web. Essayez avec les sites web suivants :

Vous pouvez trouver une liste amusante de tous les codes de statut HTTP sur https://http.cat/. Jetez un œil au 418.

Améliorer votre site web ​

Dans Visual Studio Code, ajoutez l'extension (Live Server)[https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer] et lancez votre site web avec cette extension. Elle vous permettra de rafraîchir automatiquement votre site web lorsque vous modifiez un fichier.

Ajoutez du CSS à votre site web :

Sources ​