Interactions client-serveur – HTTP

Merci !

Fiches
Classe(s) : 1re Générale | Thème(s) : Interface homme-machine et Web
 

Le schéma client-serveur désigne un mode de communication entre programmes : l’un, qualifié de client, envoie des requêtes ; l’autre, le serveur, y répond. Dans le cas du Web, le client est le navigateur et le protocole utilisé est HTTP.

I Client-Serveur – Dialogue HTTP

1 Le côté client ou front-end

Centré sur le navigateur, il est constitué par des pages HTML, les feuilles de style CSS et les codes JavaScript qui les accompagnent. Les métiers concernés sont, par exemple, web designer, intégrateur CSS ou développeur front-end.

Certaines vérifications de formulaires sont faites dans le navigateur via des attributs HTML spécialisés comme pattern ou en invoquant du code JS.

2 Le côté serveur ou back-end

Il assure la réponse à une demande faite lors de la soumission du formulaire par validation (submit) ou lors d’un appel ajax en JS.

Les technologies employées sont très variées : PHP, Python, .NET, Java, ainsi que des bases de données relationnelles.

Ces programmes s’exécutent le plus souvent sur des serveurs distants, sur Internet. Des vérifications sur les données sont également effectuées côté serveur pour assurer la sécurité de l’application.

3 Le dialogue entre client et serveur : HTTP

05230_chap05_09

HTTP signifie HyperText Transfer Protocol, c’est le protocole de « haut niveau » permettant les échanges entre un navigateur et un serveur sur Internet. La transmission de paramètres (champs saisis dans le formulaire) se fait grâce à ce protocole.

Dans le cas de sites sécurisés, le protocole HTTPS ajoute une couche SSL (Secure Socket Layer) à HTTP, assurant le chiffrement et la confidentialité des échanges.

4 Méthodes GET et POST

Avec la méthode GET, les paramètres sont transmis dans la variable d’environnement QUERY_STRING et visibles sur l’URL.

Avec la méthode POST, les paramètres sont transmis au programme externe dans son entrée standard et sont invisibles sur l’URL.

II Un exemple de formulaire en HTML

Voici un formulaire complet avec différents types d’input dotés de plusieurs attributs comme :

– required qui indique les champs obligatoires ;

– placeholder qui donne un exemple ;

– pattern qui précise la valeur attendue à l’aide d’une expression régulière.

Mot clé

Les expressions régulières représentent des motifs, comme ici un numéro de téléphone comprenant uniquement des chiffres, d’où la plage de caractères [0-9], et de taille contrainte : {10,14} signifiant entre 10 et 14 éléments. Pour un email, l’expression régulière est étonnamment complexe et il vaut mieux laisser faire le navigateur avec sa valeur par défaut.

PB_Bac_05230_numerique1_TT_p137-170_C05_Groupe_Schema_7

Nous verrons une réponse en PHP à un formulaire dans cette fiche.

Annabac est gratuit en septembre !

Inscris-toi pour en profiter.