X-Git-Url: http://git.nguyen.vg/gitweb/?a=blobdiff_plain;f=unix_prog_web%2Funix_prog_web_04.xhtml;fp=unix_prog_web%2Funix_prog_web_04.xhtml;h=0000000000000000000000000000000000000000;hb=8a2e36282654d761b5bee1b2832d25f27097094b;hp=2d8f3096331738e06f1c395299cfdd90f54d3951;hpb=6e8bc5175a0d55e46d072fce27496d93beee3f83;p=hacks%2FsimpleWebSlides.git diff --git a/unix_prog_web/unix_prog_web_04.xhtml b/unix_prog_web/unix_prog_web_04.xhtml deleted file mode 100644 index 2d8f309..0000000 --- a/unix_prog_web/unix_prog_web_04.xhtml +++ /dev/null @@ -1,581 +0,0 @@ - - - - - Web et HTML - - - - - - - - - - - - - - - - - - - -
-

Unix et Programmation Web

-

Cours 4

- kn@lri.fr
- http://www.lri.fr/~kn -
-

Internet et ses services

-
-

Bref historique d'Internet (1/2)

- - - - - - - - - - - - - - - -
1959-1968 ARPA - (Advanced Research Project Agency) crée un réseau - de quelques machines capable de résister à une attaque.
1969 ARPANET. Interconnexion des ordinateurs - centraux des grandes universités et institutions - américaines. Première utilisation du concept de paquet d'information.
1970-1982 Interconnexion avec la Norvège et le Royaume-Uni. -
1982 Passage au protocole TCP/IP. Naissance de l'Internet actuel.
-
-
-

Bref historique d'Internet (2/2)

- - - - - - - - - - - - - - - -
1986 « Autoroutes de - l'information ». Des super-ordinateurs et les premières - connexions à fibres optiques sont utilisées pour accélérer - le débit d'Internet.
1987-1992 Apparition des premiers fournisseurs - d'accès. Les entreprises se connectent.
1993-2000 Avènement du Web. Démocratisation du haut-débit (vers - 2000 pour la France). -
2000-présent Explosion des services en ligne, arrivée des réseaux - sociaux, internet mobile, Cloud (stockage et calcul - mutualisés accessible depuis internet).
-
- -
-

Internet

- -
-
-

Exemples de services

- - - - - - - - - - - - - - - - -
ServiceProtocolePortDescription
ftp File Transfer Protocol - 20,21 Transfert de fichiers
telnet Network Virtual - Terminal 23 Shell à distance
ssh Secure Shell 22Shell à - distance crypté
mailSimple Mail Transfer - Protocol 25 Envoi de mail
pop Post Office - Protocol 110Récupération de mail
imap Internet Message Access - Protocol 143Synchronisation de mails
nslookup Domain Name - System 42 Serveur de noms
http Hyper Text Transfer Protocole80Web
-
-
-

World Wide Web (1/2)

- -
- -
-

World Wide Web (2/2)

-

Concepts clé:

- - - - -
URL localisation d'une page Web (« adresse de - la page »)
HTTP protocole de communication entre un - client et un serveur Web
HTML langage de description des pages - Web
-

Évolutions récentes (Web 2.0, internet mobile, Cloud, …)

- -
- - -

Fonctionnement du Web

-
-

Fonctionnement du Web

-
- -
- -
- -
-

Côté client

-

Le navigateur :

- -
- -
-

Côté serveur

- -
- -

Adressage des documents Web

-
-

Adressage des documents Web (1/3)

- - -
URL Uniform Resource Locator - identifie un document sur internet
-

Une URL se décompose en 3 partie

- -

Syntaxe (simplifiée) :

- protocole://adresse/document -

Exemple :

- http://www.lri.fr/~kn/teach_fr.html -
- -
-

Adressage des documents Web (2/3)

-

On peut aussi préciser un numéro - de port, des paramètres - et un emplacement : -

- protocole://adresse:port/document?p1=v1&p2=v2#empl -

Exemple :

- http://www.youtube.com:80/results?search_query=tbbt#search-results -

Le serveur utilise les paramètres passés par le client dans - l'URL pour calculer le contenu de la page (changer la - chaîne « tbbt » ci-dessus et essayer)

-
-
-

Adressage des documents Web (3/3)

-

- La racine d'un site Web - (ex: http://www.lri.fr/) correspond - à un répertoire sur le disque du serveur - (ex: /var/www). Le fichier

- http://www.lri.fr/index.html -

se trouve à l'emplacement

- /var/www/index.html -

Le serveur Web peut aussi effectuer des réécritures - d'adresses :

- http://www.lri.fr/~kn/index.html -

devient

- /home/kn/public_html/index.html -
- -

Le protocole HTTP

-
-

Caractéristiques du protocole HTTP

- -
-
-

Format des messages HTTP

-

Les messages ont la forme suivante

- - -
-
-

Démo

-
-

HTML, le format des documents

-
-

HTML

-

- HyperText Markup Language : langage de mise en forme - de documents hypertextes (texte + liens vers d'autres - documents). Développé au CERN en 1989.
- 1991 : premier navigateur en mode texte
- 1993 : premier navigateur graphique (mosaic) - développé au NCSA (National Center for Supercomputing - Applications) -

-
-
-

Document HTML

- -
- - - - - - - - -
Exemple Rendu par défaut
en gras - ]]>Un - texte en gras
Un lien ]]>Un lien
-
  • Premièrement
    • -
  • Deuxièmement
    • - ]]>
      -
    • Premièrement
      • -
    • Deuxièmement
      • -
    -
    -
    -

    On dit que ]]> est une balise - ouvrante et ]]> une - balise fermante. On peut - écrire ]]> comme raccourci pour - ]]>. -

    -
    -
    -

    Historique du langage HTML

    - - - - - - - - -
    1973 GML, Generalised Markup Language développé chez -IBM. Introduction de la notion de balise.
    1980 SGML, Standardised GML, adopté par l'ISO
    1989 HTML, basé sur SGML. Plusieurs entreprises (microsoft, -netscape, ... ) interprètent le standard de manière -différente
    1996 XML, eXtensible Markup Language norme pour les -documents semi-structurés (SGML simplifié)
    2000 XHTML, version de HTML suivant les conventions - XML
    2008 Première proposition pour le nouveau standard, - HTML5
    2014Standardisation de HTML5
    -
    - -
    -

    XHTML vs HTML

    -

    On utilise XHTML dans le cours. Différences avec HTML:

    - -

    Les avantages sont les suivants

    - -
    -
    -

    Rôle d'(X)HTML

    -

    Séparer la structure du document de - son rendu. La structure donne une sémantique au - document :

    - -

    Cela permet au navigateur d'assurer un rendu en fonction de la - sémantique. Il existe différents types de rendus:

    - -
    -
    -

    Exemple de document

    -

    (liste des balises - données sur la feuille de TD 4!)

    -
    - - - - Un titre - - - -

    Titre de section

    -

    premier paragraphe de texte. On met - un lien ici. -

    - - - ]]>     -
    -
    -
    -

    Structure d'un document XHTML

    -

    Pour être valide un document XHTML contient au - moins les balises suivantes :

    - -
    -

    Encodage des caractères (UTF-8) (digression)

    -
    -

    Représentation des textes

    -

    Avant de représenter des documents complexes, on s'intéresse - aux textes (sans structure particulière)

    -

    Problématique: comment représenter du texte - réaliste ?

    -

    Exemple de texte réaliste:
    - " و عليكم السلام,Здравей,¡Hola!, 你好,Góðan daginn,… - " -

    -
    -
    -

    Historiquement…

    -

    Encodage 1 caractère = 1 octet (8 bits) :

    - -
    -
    -

    … et pendant ce temps là, ailleur dans le monde

    -

    Encodage multi-octets:

    - -

    Impossibilité de mettre plusieurs « alphabets » dans un même - texte

    -

    Chaque logiciel « interprétait » les séquences d'octet de - manière prédéfinie

    -
    -
    -

    UTF-8

    -

    Universal (Character Set) Transformation Format 8 bit

    - -

    Encodage

    - - - - - - - - - - - -
    Nombre d'octetsOctet 1Octet - 2Octet 3Octet 4Octet 5Octet 6
    10xxxxxxx
    2110xxxxxx10xxxxxx
    31110xxxxx10xxxxxx10xxxxxx
    411110xxxx10xxxxxx10xxxxxx10xxxxxx
    5111110xxx10xxxxxx10xxxxxx10xxxxxx10xxxxxx
    61111110xx10xxxxxx10xxxxxx10xxxxxx10xxxxxx10xxxxxx
    -
    -
    -

    Exemples

    -

    A  ⟶  6510 -  ⟶  0100 10102 (représenté sur un - seul octet)

    - -

    ễ  ⟶  787710 -  ⟶  0001 1110 1100 01012 (représenté - 3 octets) :
    - 11100001 1011 10 - 11 1000 0101≡ 225 187 133 -

    -

    🐵 -  ⟶  12805310  ⟶  … - ≡ 240 237 220 181

    -

    Avantages

    - -

    Inconvénients

    - -
    - -