Le Web : fonctionnement et protocoles⚓︎

Objectifs du chapitre

Comprendre ce qu'est une URL et savoir la décomposer
Connaître le rôle des liens hypertexte dans le Web
Comprendre le modèle client-serveur
Comprendre le fonctionnement d'une requête HTTP

1. URL — Uniform Resource Locator⚓︎

Une URL est l'adresse qui permet de localiser une ressource (page web, image, fichier…) sur Internet. C'est ce que l'on tape dans la barre d'adresse d'un navigateur.

Structure d'une URL⚓︎

📋 Texte

https://www.exemple.fr:443/cours/web.html?page=1#partie2

Composant	Valeur	Rôle
Schéma	`https`	Protocole utilisé
Hôte	`www.exemple.fr`	Nom du serveur
Port	`443`	Point d'entrée sur le serveur (optionnel)
Chemin	`/cours/web.html`	Emplacement de la ressource
Paramètres	`?page=1`	Données envoyées au serveur (optionnel)
Ancre	`#partie2`	Section dans la page (optionnel)

À retenir

Le port 80 est celui du protocole http, le port 443 celui du protocole https (sécurisé). Ils sont omis dans l'URL car implicites.

Protocole HTTP vs HTTPS⚓︎

HTTP (HyperText Transfer Protocol) : protocole d'échange de base du Web.
HTTPS : version sécurisée de HTTP. Les données échangées sont chiffrées grâce au protocole TLS. À privilégier pour toute connexion sensible (banque, identifiants…).

2. Les liens hypertexte⚓︎

Définition⚓︎

Un lien hypertexte (ou hyperlien) est un élément cliquable d'une page web qui permet de naviguer vers une autre ressource. C'est Tim Berners-Lee qui invente ce concept en 1989, à l'origine du World Wide Web.

Un lien peut pointer vers :

une autre page du même site (lien interne)
une page d'un autre site (lien externe)
une ancre dans la page courante

En HTML⚓︎

HTML

<a href="https://www.exemple.fr/cours/web.html">Accéder au cours</a>

L'attribut href contient l'URL cible. Le texte entre les balises est ce qui s'affiche à l'écran.

Le Web comme un graphe⚓︎

L'ensemble des pages web et de leurs liens forme un immense graphe orienté : chaque page est un nœud, chaque lien hypertexte est un arc. Les moteurs de recherche comme Google exploitent ce graphe (via des algorithmes comme PageRank) pour indexer et classer les pages.

3. Le modèle client-serveur⚓︎

Principe⚓︎

Le Web repose sur une architecture client-serveur :

Le client est le logiciel qui formule une demande. En général, c'est votre navigateur (Firefox, Chrome…).
Le serveur est la machine qui reçoit la demande, traite la requête et renvoie une réponse (la page web, une image, un fichier…).

📋 Texte

Client (navigateur)          Serveur web
        |                        |
        |--- Requête HTTP ------->|
        |                        |  (traitement)
        |<-- Réponse HTTP --------|
        |                        |

Rôles de chacun⚓︎

Côté client	Côté serveur
Envoie la requête	Reçoit et traite la requête
Affiche la réponse (HTML, CSS, images…)	Renvoie la ressource demandée
Exécute le JavaScript	Exécute les scripts serveur (PHP, Python…)
Dépend du navigateur	Fonctionne en continu, indépendamment

Exemple concret

Vous tapez https://www.lemonde.fr dans votre navigateur.

Votre navigateur (client) envoie une requête au serveur de lemonde.fr.
Le serveur cherche la page d'accueil.
Il renvoie le code HTML de la page.
Votre navigateur interprète ce code et affiche la page.

Plusieurs clients, un seul serveur⚓︎

Un serveur peut répondre à de très nombreux clients simultanément. Les grands sites (Google, YouTube…) utilisent en réalité des milliers de serveurs répartis dans le monde (fermes de serveurs).

4. Le protocole HTTP⚓︎

Qu'est-ce qu'une requête HTTP ?⚓︎

HTTP est le protocole qui définit le format des messages échangés entre le client et le serveur. Un échange HTTP se décompose en deux temps :

Le client envoie une requête HTTP
Le serveur renvoie une réponse HTTP

La requête HTTP⚓︎

Une requête HTTP contient :

une méthode (ou verbe) : ce que le client veut faire
l'URL de la ressource demandée
des en-têtes (headers) : informations complémentaires (navigateur utilisé, langue…)
éventuellement un corps (body) : données envoyées au serveur

Les deux méthodes les plus courantes sont :

Méthode	Usage	Les données sont…
`GET`	Demander une ressource	Dans l'URL (`?clé=valeur`)
`POST`	Envoyer des données (formulaire, login…)	Dans le corps de la requête (non visible)

Exemple de requête GET :

📋 Texte

GET /cours/web.html HTTP/1.1
Host: www.exemple.fr
User-Agent: Mozilla/5.0
Accept: text/html

La réponse HTTP⚓︎

La réponse du serveur contient :

un code de statut indiquant si la requête a abouti
des en-têtes de réponse
le corps : la ressource demandée (HTML, image, JSON…)

Exemple de réponse :

📋 Texte

HTTP/1.1 200 OK
Content-Type: text/html
Content-Length: 4523

<!DOCTYPE html>
<html>...

Les codes de statut HTTP⚓︎

Code	Signification
`200 OK`	Succès, ressource trouvée et renvoyée
`301 Moved Permanently`	Redirection permanente
`403 Forbidden`	Accès refusé
`404 Not Found`	Ressource introuvable
`500 Internal Server Error`	Erreur côté serveur

404 et vie privée

Même quand une page affiche une erreur 404, le serveur a bien reçu votre requête. Il sait donc que vous avez tenté d'accéder à cette URL.

5. Du nom de domaine à l'adresse IP : le DNS⚓︎

Lorsque vous tapez www.exemple.fr, votre ordinateur ne sait pas directement où se trouve ce serveur. Il doit d'abord résoudre ce nom en une adresse IP grâce au système DNS (Domain Name System).

📋 Texte

Navigateur          DNS                Serveur
    |                |                    |
    |-- "exemple.fr ?" ->                 |
    |               |                    |
    |<-- "93.184.216.34" --               |
    |                                    |
    |------------- Requête HTTP -------->|

Le DNS fonctionne comme un annuaire d'Internet : il traduit les noms de domaine lisibles par les humains en adresses IP utilisables par les machines.

Synthèse⚓︎

Quand vous accédez à une page web, voici ce qui se passe dans l'ordre :

Vous entrez une URL dans le navigateur.
Le navigateur interroge le DNS pour obtenir l'adresse IP du serveur.
Le client (navigateur) envoie une requête HTTP au serveur.
Le serveur traite la requête et renvoie une réponse HTTP (code de statut + contenu).
Le navigateur interprète le HTML/CSS/JS reçu et affiche la page.
Les liens hypertexte de la page permettent de recommencer le processus.

Exercices⚓︎

Exercice 1 — Décomposer une URL

Décomposez l'URL suivante en identifiant chaque composant :

📋 Texte

https://education.nationale.fr:443/snt/web/index.html?chapitre=2#exercices

Exercice 2 — Codes HTTP

Associez chaque situation à un code de statut HTTP :

a. Vous accédez à votre profil sur un réseau social.
b. Vous tapez une URL avec une faute de frappe.
c. Vous essayez d'accéder à une page réservée aux administrateurs sans vous connecter.
d. Le site est temporairement hors service suite à une panne.

Exercice 3 — Client ou serveur ?

Pour chaque action, dites si elle se passe côté client ou côté serveur :

a. Afficher le menu déroulant lorsque vous cliquez dessus.
b. Vérifier que votre mot de passe est correct lors d'une connexion.
c. Mettre en gras le titre de la page.
d. Rechercher vos messages dans une base de données.