Dual Blog : DeFr's Weblog

Architecture client-serveur | mercredi 23 février 2005, 21h56

Mood: Goggle

La plupart des utilisations de nos jours d'Internet repose de facon fondamentale sur l'utilisation d'une architecture de type Client-Serveur : le web, les e-mails, la majorité des logiciels de messagerie instantanée - des applications utilisées quotidiennement par la majorité des lecteurs de ce weblog je pense. Pourtant, des conversations que j'ai eu par le passé ( et que ce post va peut-être, qui sait, éviter à l'avenir ) montre que ce concept ne semble pas être completement assimilé par l'ensemble de mes contacts webmaster. Notament, la mention du fait qu'un langage de programmation est client-side ou server-side - en francais dans le texte, langage de programmation "côté serveur" ou "côté client" - normallement assez visuel, ne semble pas amener l'effet escompté. J'espere que la lecture de ce post permettra à quiconque ayant encore des doutes de les dissiper. Plus concrètement, on s'interessera ici aux pages webs, avec PHP en langage côté serveur et JavaScript en langage côté client.

Tout d'abord, un petit schéma général, suivi d'explications sur ce que ca peut bien vouloir dire plus précisement dans notre cas d'étude :


Images extraites du set d'icone Crystal SVG par Everaldo, sous license GPL

Plus précisement, ici, le serveur est un logiciel ( Apache dans la grande majorité des cas ) s'executant sur l'ordinateur sur lequel est stocké le site web auquel vous souhaitez acceder, et le client est votre navigateur web ( lorsque l'on prend le point de vue client ). Constatation annexe à ce post, mais qui renforce ce que j'ai déja dit précédement : les clients peuvent être de natures variées, raison pour laquelle il est important de suivre des standards permettant de communiquer avec tous les clients... Mais revenons-en à notre sujet : on a maintenant vu plus précisement ce qu'étaient nos clients et serveur, maintenant, comme indiquer sur le diagramme, il faut que les deux parlent entre eux - contrairement à ce qu'on pourrait croire, réellement, les ordinateurs ne sont pas autistes, ils parlent énormement les uns avec les autres. La partie pas forcement explicite du schéma est celle disant que les communications sont séquentielles. Pour prendre une analogie courante, c'est comme les talkies walkies : on peut parler l'un après l'autre, mais pas en même temps. Pour ce qui est des pages webs, c'est exactement la même chose. Ce qui me file donc une excellente transition pour le paragraphe suivant : on va voir quels sont les étapes de récuperation d'une page web par le client, et voir à quels moments on peut faire différentes choses.

Première étape, le client - c'est à dire le navigateur du visiteur, je rapelle pour les deux au fond près du radiateur qui ont l'air un peu perdu... - va faire connaitre au serveur son désir de récuperer une page donnée. Typiquement, dans cette demande, il inclue des informations du genre : nom de la page souhaitée, types de fichiers acceptés par le client, identifiant du client ( le fameux UserAgent ) En somme, tout un tas de données utiles permettant au serveur de savoir exactement quoi répondre au serveur. D'un point de vue webmaster, il n'y a ici rigoureusement aucune action possible, puisque la communication émane du client, donc du visiteur.

Deuxieme ( ou Seconde pour les puristes, étant donné qu'il n'y en a pas à proprement parlé de troisieme ) étape du processus, le serveur va construire et envoyer sa réponse. C'est à cet instant qu'on va pouvoir utiliser du PHP, pour construire dynamiquement la réponse à la requete envoyé par l'utilisateur. Il est important de noter que par défaut, PHP va envoyer au client ce qu'il peut le plus tôt possible, même si toute la réponse n'est pas encore construite. Le gros avantage de cette méthode, c'est que le visiteur a le maximum d'information à tout instant, mais l'inconvenient, c'est qu'il n'est pas possible de revenir sur des informations déja envoyées, alors qu'on aimerait parfois le faire. Exemple type pour le titre de la page web : il est necessaire de déterminer le titre de la page avant d'envoyer du contenu. Une fois la page entierement construite et envoyée au client, c'est à dire pour simplifier lorsque le navigateur affiche "Done" ou "Terminé", le travail possible pour PHP est totalement terminé, et il n'est plus possible de faire intervenir ce langage sans recommencer l'intégralité du processus demande du client - réponse du serveur.

Puisque le serveur a envoyé toute sa réponse, il a terminé son travail, et va laisser le client seul. C'est donc à partir de là que les scripts de type côté client vont intervenir : au JavaScript d'accomplir son oeuvre. Toutefois, on constate de suite quelque chose : le JavaScript intervient en bout de chaine de l'élaboration de la page, et il est assez probable que le client est déja commencé à afficher des choses à ce moment là. Par conséquent, si on veut faire une gestion des alternates stylesheets entierement en JavaScript ( contrairement à ce blog où, comme détaillé précédement, elles sont en JavaScript et PHP ), on va se trouver confronter au problème suivant : lorsqu'on changera la feuille de style active de celle par défaut à celle chosisit par le client, le site aura fait un bref passage sur l'écran du visiteur sous son apparence par défaut, ce qui n'est pas des plus agréables.

Cependant, on comprend bien l'interet du JavaScript dans tout ce qui est dynamique : les comportements des elements lorsque la souris les survolent, lorsqu'on clique dessus, globalement, toutes les interactions avec l'utilisateur : au moment ou ces évenements se produisent, le temps ou le serveur avait un rôle est déja loin, et il est donc necessaire d'utiliser un langage de script côté client pour les gérer.

Pour conclure ce post, un exemple concret, qui devrait finir d'expliquer les domaines d'utilisation : pour rester dans les alternates stylesheet, le traitement de la feuille de style préférée du visiteur est effectuée en PHP, tandis que les changements de feuille de style, et la sauvegarde de la feuille de style préférée sont eux effectués en JavaScript.

J'espere que cet article aura pu éclairer quelques lanternes, les commentaires de ce post restant à votre entiere disposition pour eclairer toute zone d'ombre qui pourrait éventuellement rester ^^

Revenir au blog
Vous souhaitez ajouter un nouveau commentaire ? Faites donc, il vous suffit de remplir le petit formulaire ci-dessous.
Sites visités