Add course.
authorKim Nguyễn <kn@lri.fr>
Fri, 11 Oct 2013 14:10:24 +0000 (16:10 +0200)
committerKim Nguyễn <kn@lri.fr>
Fri, 11 Oct 2013 14:10:24 +0000 (16:10 +0200)
prog_internet/cours_4.svg [new file with mode: 0644]
prog_internet/mozilla-pdfjam.pdf [new file with mode: 0644]
prog_internet/mozilla.pdf [new file with mode: 0644]
prog_internet/prog_internet_01.xhtml [new file with mode: 0644]
prog_internet/prog_internet_02.xhtml [new file with mode: 0644]
prog_internet/prog_internet_03.xhtml [new file with mode: 0644]
prog_internet/prog_internet_04.xhtml [new file with mode: 0644]
prog_internet/prog_internet_05.xhtml [new file with mode: 0644]

diff --git a/prog_internet/cours_4.svg b/prog_internet/cours_4.svg
new file mode 100644 (file)
index 0000000..d26b090
--- /dev/null
@@ -0,0 +1,399 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.48.4 r9939"
+   sodipodi:docname="cours_4.svg"
+   preserveAspectRatio="xMinYMin meet"
+   viewBox="0 0 488 227"
+   height="100%"
+   width="100%">
+  <defs
+     id="defs4">
+    <marker
+       inkscape:stockid="Arrow1Mend"
+       orient="auto"
+       refY="0"
+       refX="0"
+       id="Arrow1Mend"
+       style="overflow:visible">
+      <path
+         id="path4048"
+         d="M 0,0 5,-5 -12.5,0 5,5 0,0 z"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt"
+         transform="matrix(-0.4,0,0,-0.4,-4,0)"
+         inkscape:connector-curvature="0" />
+    </marker>
+    <marker
+       inkscape:stockid="Arrow1Mstart"
+       orient="auto"
+       refY="0"
+       refX="0"
+       id="Arrow1Mstart"
+       style="overflow:visible">
+      <path
+         id="path4045"
+         d="M 0,0 5,-5 -12.5,0 5,5 0,0 z"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt"
+         transform="matrix(0.4,0,0,0.4,4,0)"
+         inkscape:connector-curvature="0" />
+    </marker>
+    <marker
+       inkscape:stockid="Arrow1Lstart"
+       orient="auto"
+       refY="0"
+       refX="0"
+       id="Arrow1Lstart"
+       style="overflow:visible">
+      <path
+         id="path4039"
+         d="M 0,0 5,-5 -12.5,0 5,5 0,0 z"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt"
+         transform="matrix(0.8,0,0,0.8,10,0)"
+         inkscape:connector-curvature="0" />
+    </marker>
+    <marker
+       inkscape:stockid="Arrow1Lend"
+       orient="auto"
+       refY="0"
+       refX="0"
+       id="Arrow1Lend"
+       style="overflow:visible">
+      <path
+         id="path4042"
+         d="M 0,0 5,-5 -12.5,0 5,5 0,0 z"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt"
+         transform="matrix(-0.8,0,0,-0.8,-10,0)"
+         inkscape:connector-curvature="0" />
+    </marker>
+    <marker
+       inkscape:stockid="Arrow1Lend"
+       orient="auto"
+       refY="0"
+       refX="0"
+       id="Arrow1Lend-0"
+       style="overflow:visible">
+      <path
+         inkscape:connector-curvature="0"
+         id="path4042-8"
+         d="M 0,0 5,-5 -12.5,0 5,5 0,0 z"
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt"
+         transform="matrix(-0.8,0,0,-0.8,-10,0)" />
+    </marker>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="1"
+     inkscape:cx="35.363832"
+     inkscape:cy="61.224991"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="true"
+     fit-margin-top="0.3"
+     fit-margin-right="0.3"
+     fit-margin-bottom="0.3"
+     fit-margin-left="0.3"
+     units="pt"
+     inkscape:window-width="1317"
+     inkscape:window-height="744"
+     inkscape:window-x="49"
+     inkscape:window-y="24"
+     inkscape:window-maximized="1">
+    <inkscape:grid
+       type="xygrid"
+       id="grid3851"
+       empspacing="5"
+       visible="true"
+       enabled="true"
+       snapvisiblegridlinesonly="true"
+       originx="-48.625px"
+       originy="-714.565px" />
+  </sodipodi:namedview>
+  <metadata
+     id="metadata7">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-48.625,-111)">
+    <path
+       sodipodi:nodetypes="cc"
+       inkscape:connector-curvature="0"
+       id="path6222"
+       d="m 160,192.36218 c 0,0 110,70 255,0"
+       style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-start:none;marker-end:none" />
+    <rect
+       style="fill:none;stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0"
+       id="rect2985"
+       width="100"
+       height="110"
+       x="50"
+       y="122.36218"
+       rx="5"
+       ry="5.25" />
+    <rect
+       style="fill:none;stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0"
+       id="rect2987"
+       width="90"
+       height="39.285721"
+       x="55"
+       y="138.07646"
+       rx="5"
+       ry="5.25" />
+    <path
+       style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-start:none;marker-end:none"
+       d="m 160,192.36218 c 0,0 110,70 255,0"
+       id="path3853"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cc" />
+    <path
+       style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-start:none;marker-end:none"
+       d="m 416.70357,171.56972 c 0,0 -110,-69.99999 -255,0"
+       id="path3853-3"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cc" />
+    <path
+       style="fill:#d8d8d8;fill-opacity:1;stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0"
+       d="m 282.26208,128.4689 c -15.52034,0 -28.93338,7.33912 -35.35367,17.99919 -0.64637,-0.0258 -1.29805,-0.0499 -1.95223,-0.0499 -21.75627,0 -39.38014,14.4159 -39.38014,32.19661 0,9.76218 5.31567,18.50189 13.71136,24.4061 3.8e-4,0.004 -3.8e-4,0.008 0,0.0125 1.54765,16.62328 18.53694,29.71611 39.27338,29.71611 6.98235,0 13.53033,-1.49682 19.21727,-4.10092 6.95058,5.03082 16.08115,8.08966 26.09582,8.08966 13.08998,0 24.68235,-5.22044 31.84576,-13.25009 1.22508,0.0938 2.46634,0.14958 3.72144,0.14958 21.75627,0 39.39539,-14.4159 39.39539,-32.19661 0,-13.70651 -10.48818,-25.40777 -25.25698,-30.05266 -6.2531,-11.0236 -19.90492,-18.67229 -35.75021,-18.67229 -0.93741,0 -1.87005,0.0346 -2.79108,0.0873 -7.06455,-8.6395 -19.10727,-14.33454 -32.77611,-14.33454 z"
+       id="path3034"
+       inkscape:connector-curvature="0" />
+    <text
+       xml:space="preserve"
+       style="font-size:16px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="260"
+       y="182.36218"
+       id="text4503"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan4505"
+         x="260"
+         y="182.36218">Internet</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="100"
+       y="152.36218"
+       id="text4507"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan4509"
+         x="100"
+         y="152.36218">Client</tspan><tspan
+         sodipodi:role="line"
+         x="100"
+         y="164.86218"
+         id="tspan4511">(Navigateur Web)</tspan></text>
+    <rect
+       style="fill:none;stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0"
+       id="rect2985-2"
+       width="108.57141"
+       height="195"
+       x="426.42859"
+       y="112.36218"
+       rx="5"
+       ry="5.25" />
+    <rect
+       style="fill:none;stroke:#000000;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0"
+       id="rect2987-8"
+       width="90"
+       height="39.285721"
+       x="435"
+       y="128.07646"
+       rx="5"
+       ry="5.25" />
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="480"
+       y="142.36218"
+       id="text4507-4"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan4509-5"
+         x="480"
+         y="142.36218">Serveur</tspan><tspan
+         sodipodi:role="line"
+         x="480"
+         y="154.86218"
+         id="tspan4511-5">(programme)</tspan></text>
+    <path
+       id="path4543"
+       style="fill:none;stroke:#000000;stroke-width:2.5;stroke-linecap:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dashoffset:0"
+       d="m 530.88892,222.97799 c 0,6.90356 -21.9929,13.52857 -49.60714,13.52857 -27.61424,0 -50.39286,-6.62501 -50.39286,-13.52857 0,-6.90356 22.77862,-11.47143 50.39286,-11.47143 27.61424,0 49.60714,4.56787 49.60714,11.47143 z m -100,0 0,30 c 0.96873,5.73041 23.81743,11.57532 50.15625,11.57532 26.33882,0 46.37503,-5.8385 49.84375,-11.57532 0,-5 0,-30 0,-30"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="sssssccscc" />
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="100"
+       y="202.36218"
+       id="text4507-8"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan4509-6"
+         x="100"
+         y="202.36218">Client</tspan><tspan
+         sodipodi:role="line"
+         x="100"
+         y="214.86218"
+         id="tspan4511-3">(Machine)</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="456.82117"
+       y="251.13666"
+       id="text4618"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan4620"
+         x="456.82117"
+         y="251.13666">Documents</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="480"
+       y="282.36218"
+       id="text4507-4-3"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan4509-5-2"
+         x="480"
+         y="282.36218">Serveur</tspan><tspan
+         sodipodi:role="line"
+         x="480"
+         y="294.86218"
+         id="tspan4511-5-6">(machine)</tspan></text>
+    <path
+       style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-start:none;marker-end:none"
+       d="m 480,172.36218 c 0,20 0,35 0,35"
+       id="path4646"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cc" />
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#92b938;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Bold"
+       x="470"
+       y="322.36218"
+       id="text5218"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan5220"
+         x="470"
+         y="322.36218">PHP</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="470.14297"
+       y="337.36218"
+       id="text5222"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan5224"
+         x="470.14297"
+         y="337.36218">Java</tspan></text>
+    <g
+       id="g5236"
+       transform="translate(17.421707,1)">
+      <text
+         sodipodi:linespacing="125%"
+         id="text5226"
+         y="251.36218"
+         x="82.578293"
+         style="font-size:10px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#92b938;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Bold"
+         xml:space="preserve"><tspan
+           y="251.36218"
+           x="82.578293"
+           id="tspan5228"
+           sodipodi:role="line">HTML</tspan><tspan
+           id="tspan5230"
+           y="263.86218"
+           x="82.578293"
+           sodipodi:role="line">CSS</tspan></text>
+      <text
+         sodipodi:linespacing="125%"
+         id="text5232"
+         y="272.36218"
+         x="60"
+         style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+         xml:space="preserve"><tspan
+           y="272.36218"
+           x="60"
+           id="tspan5234"
+           sodipodi:role="line">Javascript</tspan></text>
+    </g>
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="260"
+       y="122.36218"
+       id="text5262"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan5264"
+         x="260"
+         y="122.36218">Requêtes</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:10px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"
+       x="290"
+       y="252.36218"
+       id="text6026"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan6028"
+         x="290"
+         y="252.36218">Réponses</tspan><tspan
+         sodipodi:role="line"
+         x="290"
+         y="264.86218"
+         id="tspan6030">(pages, images, vidéos, scripts, …)</tspan></text>
+    <path
+       style="fill:#000000;fill-opacity:1;stroke:none"
+       d="m 153.69106,188.74964 7.20077,7.55969 2.97218,-5.21212 z"
+       id="path6798-3"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccc" />
+    <path
+       style="fill:#000000;fill-opacity:1;stroke:none"
+       d="m 422.59911,174.46563 -7.57857,-7.1809 -2.70129,5.35752 z"
+       id="path6798-2"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccc" />
+    <path
+       style="fill:#000000;fill-opacity:1;stroke:none"
+       d="m 480.06526,168.83859 -3.04557,9.98622 5.99994,0.0274 z"
+       id="path6798-2-2"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccc" />
+    <path
+       style="fill:#000000;fill-opacity:1;stroke:none"
+       d="m 480.06526,209.70337 -3.04557,-9.98622 5.99994,-0.0274 z"
+       id="path6798-2-2-4"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccc" />
+  </g>
+</svg>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
diff --git a/prog_internet/mozilla-pdfjam.pdf b/prog_internet/mozilla-pdfjam.pdf
new file mode 100644 (file)
index 0000000..958ac4a
Binary files /dev/null and b/prog_internet/mozilla-pdfjam.pdf differ
diff --git a/prog_internet/mozilla.pdf b/prog_internet/mozilla.pdf
new file mode 100644 (file)
index 0000000..3d60a35
Binary files /dev/null and b/prog_internet/mozilla.pdf differ
diff --git a/prog_internet/prog_internet_01.xhtml b/prog_internet/prog_internet_01.xhtml
new file mode 100644 (file)
index 0000000..8fba8e1
--- /dev/null
@@ -0,0 +1,643 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
+>
+<html xmlns="http://www.w3.org/1999/xhtml" >
+  <head>
+    <title>Programmation Internet</title>
+
+    <meta http-equiv="Content-Type"
+          content="text/html; charset=utf-8" />
+    <meta name="copyright"
+          content="Copyright &#169; 2013 Kim Nguyễn" />
+
+    <!-- Load jQuery -->
+    <script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
+    <!-- Load the library -->
+    <script src="../simpleWebSlides.js" type="text/javascript" ></script>
+
+    <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"  media="all" />
+    <!-- Load a custom Theme, the class-element marks this style-sheet
+      a "theme" that can be swtiched dynamicaly -->
+    <link class="sws-theme" rel="stylesheet"  title="U-Psud style"  href="../themes/uPsud.css" type="text/css" />
+
+    <!-- Customize some templates and initialize -->
+
+    <script type="text/javascript">
+      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
+      SWS.Config['sws-object-deactivate'] =  SWS.Effects.objectDeactivateFadeOut;
+      SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
+
+      //Ensures that we load SWS at the very end, after MathJax has
+      //been initialized
+
+      $(window).load(SWS.Presentation.init);
+    </script>
+
+  </head>
+  <body>
+
+    <div class="sws-slide sws-cover sws-option-nofooter">
+      <h1>Programmation Internet</h1>
+      <h1>Cours 1</h1>
+      <a href="mailto:kn@lri.fr">kn@lri.fr</a>
+    </div>
+
+    <div class="sws-slide" >
+      <h1>Contenu du cours</h1>
+      <ol >
+        <li > Comprendre les bases du Web
+          <ul>
+            <li>Fonctionnement des ordinateusr Unix (cours 1 et 2) </li>
+            <li>Notions de réseau (cours 3 et 4) </li>
+          </ul>
+        </li>
+        <li class="sws-pause" style="padding:20pt 0;" > Programmer (pour) le Web
+        <ul>
+          <li>Pages statiques (HTML &amp; CSS cours 5)</li>
+          <li>Pages dynamiques avec PHP (cours 6, 7 et 8)</li>
+          <li>Notions de sécurité des sites Web (cours 9)</li>
+          <li>Bonus (cours 10)</li>
+        </ul>
+        </li>
+
+      </ol>
+
+    </div>
+    <div class="sws-slide" >
+      <h1>Modalités de Contrôle des Connaissances (MCC)</h1>
+      <p>2 sessions:</p>
+      <ul >
+        <li > 1<sup>ère</sup> session
+          <ul>
+            <li> Contrôle continu (50%):
+            <ul>
+              <li> Partiel (fin octobre/début novembre) 25% </li>
+              <li> 1 interro de TD (12,5 %) </li>
+              <li> 1 interro de TP (12,5 %) </li>
+            </ul>
+            </li>
+            <li> Examen (50%) </li>
+          </ul>
+        </li>
+        <li class="sws-pause" >
+          2<sup>ème</sup> session (examen 100%)</li>
+      </ul>
+      <p class="sws-pause" ><b>Rappel:</b>
+        <i>La défaillance fait obstacle au calcul de la moyenne
+          et implique l'ajournement.
+          La présence de l'étudiant étant obligatoire en TP [...], plus
+          d'une absence injustiée dans un enseignement peut entraîner
+          la défaillance de l'étudiant dans l'enseignement concerné
+        </i>
+      </p>
+    </div>
+
+    <div class="sws-slide" >
+      <h1>Organisation</h1>
+      <ul>
+        <li> 10 semaines de cours :
+          <ul>
+            <li> 16/9, 23/9, 30/9, 7/10, 14/10, 21/11 (cours
+            uniquement, ni TD, ni TP) </li>
+            <li> partiel entre le 22-25/11 </li>
+            <li> congés du 28-1/11</li>
+            <li> 4/11, 11/11 (TD/TP uniquement, pas de cours) 18/11, 25/11, 2/11, 9/11</li>
+          </ul>
+        </li>
+        <li> examen début Janvier</li>
+        <li> cours tous les lundi (15h30) </li>
+        <li> TD le mardi (3 groupes) </li>
+        <li> TP le mecrecredi/jeudi </li>
+      </ul>
+    </div>
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li> Systèmes d'exploitation
+          <ul class="empty">
+            <li class="hl">1.1 Principes des systèmes
+            d'exploitation</li>
+            <li>1.2 Système de gestion de fichiers</li>
+            <li>1.3 Système de gestion de processus</li>
+            </ul>
+        </li>
+      </ol>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Système d'exploitation </h1>
+      <p>Quelques systèmes:</p>
+      <ul>
+        <li>Windows XP/NT/2003/7/8, …</li>
+        <li>Linux, FreeBSD, NetBSD, OpenBSD, …</li>
+        <li>MacOS X (basé sur une variante de FreeBSD), …</li>
+        <li>Unix, AIX, Solaris, HP-UX, …</li>
+        <li>Symbian OS (Nokia), iOS, Android, …</li>
+      </ul>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Système d'exploitation </h1>
+      <p>Qu'est-ce qu'un système d'exploitation ?</p>
+      <ul>
+        <li class="sws-pause" >c'est un <em>programme</em></li>
+        <li class="sws-pause" > qui <em>organise</em> l'accès aux <em>ressources</em> de la machine</li>
+      </ul>
+      <p class="sws-pause"> Quelles sont les ressources d'une machine?</p>
+      <ul>
+        <li>Processeur (temps d'exécution)</li>
+        <li>Mémoire</li>
+        <li>Accès aux périphériques de stockage</li>
+        <li>Accès aux périphériques d'entrées/sorties</li>
+        <li>…</li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1> Système d'exploitation </h1>
+      <br/>
+      <div style="display:inline-block;vertical-align:middle;width:19%;text-align:center;">
+        Haut niveau<br/>
+      <span style="font-size:6cm;">↓</span><br/>
+      Bas niveau
+      </div>
+      <div style="display:inline-block; width:80%;vertical-align:middle;">
+        <ul class="empty">
+          <li><em>Applications</em>: navigateur Web, éditeur de
+          texte, anti-virus, jeu, compilateur, …</li>
+          <li style="margin-top:2em;" ><em><b>Système d'exploitation</b></em>:
+            <ul>
+              <li>Gestion des ressources</li>
+              <li>Interface avec le matériel (pilotes)</li>
+            </ul>
+          </li>
+          <li style="margin-top:2em;"><em>Matériel</em>: CPU, mémoire, périphériques, …</li>
+        </ul>
+      </div>
+    </div>
+    <div class="sws-slide centerbox">
+      <h1>Le système Unix</h1>
+      <table class="desc">
+        <tr><td>1965</td> <td>MultICS: <i>Multiplexed Information and Computing Service</i> (Bell &amp; MIT) </td>
+        </tr>
+        <tr><td>1969</td> <td>Unix: 1<sup>ère</sup> version en
+        assembleur (AT&amp;T)</td>
+        </tr>
+        <tr><td style="width:4em;">1972-73</td><td> Unix réécrit en C</td></tr>
+        <tr><td>1976</td><td> Invention de TCP/IP</td></tr>
+        <tr><td>1977</td><td> <i>Berkeley Software Distribution</i>
+        (BSD)</td></tr>
+        <tr><td>1985</td><td>Unix System V</td></tr>
+        <tr><td>1988</td><td>Minix</td></tr>
+        <tr><td>1992</td><td>Linux</td></tr>
+      </table>
+    </div>
+    <div class="sws-slide">
+      <div class="centerbox">
+      <h1>Unix : architecture</h1>
+      <table style="position:relative;left:5%;width:90%;" class="rounded">
+        <tr><td colspan="2" style="background:#ddf;width:100%;">
+            Applications
+            </td>
+        </tr>
+        <tr><td style="width:50%;background:#bbf;">
+            Interface utilisateur
+          </td>
+          <td style="width:50%;background:#bbf;">
+            Services
+          </td>
+        </tr>
+        <tr><td colspan="2" style="width:100%;background:#99f;color:white;">
+            Noyau (<i>kernel</i>)
+            </td>
+        </tr>
+        <tr><td style="border-style:none;"/> <td style="background:#88f;color:white;">
+            Micro-code
+          </td>
+        </tr>
+        <tr><td colspan="2" style="width:100%;background:#77f;color:white;">
+            Matériel
+            </td>
+        </tr>
+      </table>
+      </div>
+    </div>
+    <div class="sws-slide">
+      <h1>Zoom sur le noyau</h1>
+      <table style="position:relative;left:5%;width:90%;" class="rounded">
+        <tr> <td style="background:#ddf;width:20%;">
+            Applications
+            </td>
+        </tr>
+        <tr><td style="width:20%; border-style:none;" />
+          <td style="width:80%;background:#ddf;">
+            Bibliothèques
+            (<code>libc</code>, <code>DirectX</code>, <code>OpenGL</code>, …)
+          </td>
+        </tr>
+      </table>
+      <hr style="border-bottom: dashed 1pt #696968; width: 90%;border-top:none;" />
+      <table  style="position:relative;left:5%;width:90%;"
+              class="rounded sws-pause">
+        <tr><td  style="width:100%;background:#f99;color:white;">
+            Appels systèmes
+            </td>
+        </tr>
+        <tr> <td style="background:#f66;color:white;">
+            Noyau <br/>
+            <div style="font-size:smaller">
+            pilotes de périphériques <span style="display:inline-block;width:4em"> </span>
+            ordonnanceur (gestion du temps CPU)<br/>
+            gestionnaire de mémoire <span style="display:inline-block;width:4em"> </span>
+            système de fichier<br/>
+            </div>
+          </td>
+        </tr>
+        <tr><td  style="width:100%;background:#f33;color:white;">
+            Matériel
+            </td>
+        </tr>
+      </table>
+    </div>
+    <div class="sws-slide">
+      <h1>Le <i>Shell</i> Unix</h1>
+      <ul>
+        <li>Interface utilisateur <em>en mode texte</em><br/>
+        L'utilisateur écrit des commandes dont le résultat est
+          affiché à l'écran</li>
+        <li>Interface « historique » sous Unix</li>
+        <li>Expose à l'utilisateur certains concepts Unix
+        (pesmissions, propriétaires, processus, …)</li>
+        <li>(Utilisé dans la première partie du cours)</li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Le <i>Shell</i> Unix</h1>
+      <p>Exemple de session <i>shell</i>:</p>
+      <div>
+        <code>
+          $ ls
+          <span style="color:blue">Documents   Downloads   Public    Person</span>
+          $ cd Documents
+          $ ls
+          <span style="color:blue">compte_rendu.txt</span>
+          $ mv compte_rendu.txt cr.txt
+          $ ls
+          <span style="color:blue">cr.txt</span>
+        </code>
+      </div>
+    </div>
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li> Systèmes d'exploitation
+          <ul class="empty">
+            <li >1.1 Principes des systèmes
+            d'exploitation</li>
+            <li class="hl">1.2 Système de gestion de fichiers</li>
+            <li>1.3 Système de gestion de processus</li>
+            </ul>
+        </li>
+      </ol>
+    </div>
+    <div class="sws-slide">
+      <h1>Système de gestion de fichiers (<i>filesystem</i>)</h1>
+      <ul>
+        <li> <em>Organise</em> les données sur le support
+        physique </li>
+        <li>Protège contre les <em>corruptions de données</em> </li>
+        <li>Gestion optimale de l'espace disponible</li>
+        <li><em>Accès efficace</em> aux données</li>
+        <li><em>Abstraction</em> du support physique (DVD, mémoire
+        flash, disque réseau, …)</li>
+        <li>Enregistrement des <em>méta-données</em> (date de
+        création, propriétaire, taille, …)</li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Le concept de <em>fichier</em></h1>
+      <p>
+        Un fichier est une <em>collection d'infromations
+        numériques</em> réunies sous un même <em>nom</em> et
+        enregistrée sur un support de stockage
+      </p>
+      <ul>
+        <li>Manipulable comme une unité</li>
+        <li>Selon les systèmes, le <em>nom</em> a plus ou moins
+        d'importance</li>
+        <li>possède un type</li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Le concept de <em>fichier</em></h1>
+      <p>Ne pas confondre:</p>
+      <ul>
+        <li>type du fichier: il influe sur le comportement du système
+        (fichier « normal », répertoire, lien (raccourcis), fichier
+        système, …). C'est une méta-donnée conservée par le système
+        de fichier</li>
+        <li>type du contenu: le type des <em>données</em> contenues
+        dans le fichier:
+          <ul>
+            <li>DOS puis Windows: l'extension (les 3 derniers
+            caractères après le « . ») détermine le type de contenu
+            </li>
+            <li>MacOS puis OS X/iOS: les premiers octets du fichier
+            déterminent son type
+            </li>
+            <li>Premiers octets ou extension, selon les interfaces
+            utilisées</li>
+          </ul>
+        </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Les attributs d'un fichier</h1>
+      <table class="desc">
+        <tr>
+          <td><em>Nom</em></td> <td/>
+        </tr>
+        <tr>
+          <td><em>Propriétaire</em></td>
+          <td>utilisateur qui possède ce fichier</td>
+        </tr>
+        <tr>
+          <td><em>Groupe</em></td>
+          <td>groupe d'utilisateurs qui possède ce fichier</td>
+        </tr>
+        <tr>
+          <td><em>Emplacement</em></td>
+          <td>localisation du fichier sur le support physique</td>
+        </tr>
+        <tr>
+          <td><em>Taille</em></td>
+          <td>en octet (peut être la taille réelle ou la taille
+        occupée sur le support)</td>
+        </tr>
+        <tr>
+          <td><em>Permissions</em></td>
+          <td> « qui a quel droit » sur le fichier (lecture, écriture,
+          exécution, …)
+          </td>
+        </tr>
+        <tr>
+          <td><em>Type</em></td>
+          <td/>
+        </tr>
+        <tr>
+          <td><em>Dates</em></td>
+          <td>dernier accès, dernière modification, création, …</td>
+        </tr>
+      </table>
+    </div>
+<div class="sws-slide">
+<h1>Organisation logique des fichiers</h1>
+<p> Usuellement, les fichiers sont regroupés en <em>répertoires</em>. Les
+répertoires sont imbriqués les uns dans les autres de manière a former
+une <em>arborescence</em>.
+</p>
+<p>
+  <em>Sous Unix</em> il y a un répertoire racine, « <em>/</em> »
+(<i>slash</i>) qui contient toute l'arborescence du système.<br/>
+Chaque utilisateur possède aussi un répertoire personnel
+</p>
+</div>
+
+<div class="sws-slide">
+<h1>Noms de fichiers et chemins</h1>
+<p>
+Un chemin est une <em>liste de répertoire</em> à traverser pour
+atteindre un fichier ou répertoire donné.
+Sous Unix, le séparateur de chemin est le « <em>/</em> » <br/>
+<em>Les chemins absolus </em> commencent par un <code>/</code> et
+           dénotent des fichiers à partir de la racine. Exemple:
+           <code>
+             /home/kim/Documents/ProgInternet/cours01.pdf
+           </code>
+<br/>
+<em>Les chemins relatifs</em> dénotent des fichiers à partir du
+  répertoire courant. Exemple:<br/>
+<code>
+           Documents/ProgInternet/cours01.pdf
+</code>
+si on se trouve dans le répertoire <code>/home/kim</code>
+<br/>
+<em>Les noms spéciaux</em>: « . » dénote le répertoire
+    courant,
+  « .. » le répertoire parent, « ~ » le répertoire de
+  l'utilisateur et « ~<code>toto</code> » le répertoire de l'utilisateur
+    <code>toto</code>
+</p>
+</div>
+
+<div class="sws-slide">
+  <h1>Utilisation du <i>Shell</i></h1>
+  <p>
+    Le <em>shell</em> affiche un <em>invite de commande</em>
+    (<i>prompt</i>). Exemple:<br/>
+    <code>kim@machine $ <span class="sws-pause" /></code><br/><br/>
+    <span>On peut alors saisir une commande:</span><br/><br/>
+    <code>   kim@machine $ ls *.txt<span class="sws-pause"/></code><br/><br/>
+    <span>Le shell affiche la <em>sortie</em> de la commande:</span><br/><br/>
+    <code>   fichier1.txt   fichier2.txt</code><br/><br/>
+    <span>Certains caractères doivent être précédés d'un « \ » (échappés):</span><br/><br/>
+    <code>   kim@machine $ ls mon\ fichier\#1.txt</code>
+  </p>
+</div>
+<div class="sws-slide">
+<h1>La ligne de commande</h1>
+<p>
+  Une ligne de commande a la forme:<br/>
+  <code>prog item1 item2 item3 item4 … </code>
+</p>
+  <ol>
+  <li class="sws-pause"> Si <tt>prog</tt> est un chemin il doit
+    dénoter <em>un fichier exécutable </em>
+  </li>
+  <li class="sws-pause"> Si <tt>prog</tt> est un simple nom, il doit dénoter un fichier
+    exécutable se trouvant dans un des <em>répertoires prédéfinis</em>
+    (<tt>/bin</tt>, <tt>/usr/bin</tt>, …)
+  </li>
+  <li class="sws-pause"> Pour chaque <tt>item<sub>i</sub></tt> (séparés par un ou plusieurs espaces
+    non échappés) le <i>shell</i> fait une <em>expansion de nom</em>
+  </li>
+  <li class="sws-pause"> La liste de toutes les chaînes de caractères expansées est
+    passée comme argument au programme <tt>prog</tt>
+  </li>
+  </ol>
+</div>
+<div class="sws-slide">
+<h1>Expansion des noms<br/>Expressions régulières glob</h1>
+<p>
+  Certains caractères sont <em>interprétés</em> de manière spéciale par le
+  <i>shell</i>. Ces caractères sont « expansés » selon des
+  règles. Si la forme <em>expansée</em> correspond a un ou plusieurs fichiers
+  existants, alors leurs noms sont placés sur la ligne de commande. Sinon
+  la chaîne de caractère de départ garde sa valeur textuelle.
+</p>
+</div>
+<div class="sws-slide">
+  <h1>Expressions régulières glob</h1>
+  <p>Règles d'expansion:
+  <tt><em>*</em></tt> n'importe quelle chaîne<br/>
+   <tt><em>?</em></tt> n'importe quel caractère
+   <tt><em>[ab12…]</em></tt> un caractère dans la liste <br/>
+   <tt><em>[^ab12…]</em></tt> un caractère absent de liste<br/>
+   <tt><em>[a-z]</em></tt> un caractère dans l'intervalle<br/>
+   <tt><em>[^a-z]</em></tt> un caractère absent de l'intervalle<br/>
+   <tt><em>{m<sub>1</sub>, m<sub>2</sub>}</em></tt>
+  motif <tt>m<sub>1</sub></tt> ou <tt>m<sub>2</sub></tt> <br/>
+  <tt><em>?(m<sub>1</sub>|…|m<sub>n</sub>)</em></tt>
+  <span style="display:inline-block;width:2em" />
+  <tt><em>@(m<sub>1</sub>|…|m<sub>n</sub>)</em></tt>
+  <span style="display:inline-block;width:2em" />
+  <tt><em>*(m<sub>1</sub>|…|m<sub>n</sub>)</em></tt>
+  <span style="display:inline-block;width:2em" />
+  <tt><em>+(m<sub>1</sub>|…|m<sub>n</sub>)</em></tt><br/>
+  <i>k</i> motifs parmi <tt>m<sub>i</sub></tt> <br/>
+  <tt><em>?</em></tt>: <tt>0 ≤ <i>k</i> ≤ 1</tt>
+  <span style="display:inline-block;width:2em" />
+  <tt><em>@</em></tt>: <tt><i>k</i> = 1</tt>
+  <span style="display:inline-block;width:2em" />
+  <tt><em>*</em></tt>: <tt><i>k</i> ≥ 0</tt>
+  <span style="display:inline-block;width:2em" />
+  <tt><em>+</em></tt>: <tt><i>k</i> ≥ 1</tt>
+  <br/>
+  <tt><em>!(m<sub>1</sub>|…|m<sub>n</sub>)</em></tt>:
+  ni <tt>m<sub>1</sub></tt>, …, ni <tt>m<sub>n</sub></tt>
+</p>
+</div>
+<div class="sws-slide">
+<h1>Expressions régulières glob<br/>Exemples</h1>
+<p><tt><em>ls  !(*[aeiouy]?)</em></tt> <span class="sws-pause">
+  La chaine « <tt>!(*[aeiouy]?)</tt> » est remplacée par la liste de tous
+  les fichiers dont l'avant dernière lettre du nom n'est pas une
+  voyelle. S'il n'y a pas de tel fichier, la chaîne
+  « <tt>!(*[aeiouy]?)</tt> » est passée à la commande <tt>ls</tt>.</span><br/><br/>
+  <span>
+  <tt><em>ls [0-9]*</em></tt> affiche la liste des fichiers commençant par un
+  chiffre<br/><br/>
+  <tt><em>ls +(abc)</em></tt> affiche la liste des fichiers dont le nom est une
+  répétition de «&nbsp;abc&nbsp;».
+</span>
+</p>
+</div>
+<div class="sws-slide">
+<h1>Commandes shell de base</h1>
+<ul class="empty">
+<li><em>cd </em><i>chemin</i>: <i>chemin</i> devient le
+  répertoire courant. Si absent, utilise le répertoire personnel
+</li>
+<li><em>ls</em> <i>chemin<sub>1</sub></i> … <i>chemin<sub>n</sub></i>:
+  affiche le nom des <i>n</i> fichiers. Si <i>n=0</i> affiche le contenu du
+  répertoire courant. Avec l'option <tt><em>-l</em></tt> affiche la liste
+  détaillée.
+</li>
+<li><em>cp</em> <i>chemin<sub>1</sub></i>  <i>chemin<sub>2</sub></i>:
+copie de fichier
+</li>
+<li><em>mv</em> <i>chemin<sub>1</sub></i>  <i>chemin<sub>2</sub></i>:
+  déplacement
+  de fichier (et renommage)
+</li>
+<li><em>rm</em> <i>chemin<sub>1</sub></i> … <i>chemin<sub>n</sub></i>:
+  supprime les fichiers (définitif)
+</li>
+</ul>
+</div>
+<div class="sws-slide">
+<h1>Droits et propriétés des fichiers</h1>
+<p>
+Sous Unix un utilisateur est identifié par son <em>login</em> (ou nom
+d'utilisateur). Chaque utilisateur est dans  un <em>groupe
+  principal</em>.<br/>
+Chaque fichier appartient à un utilisateur et à un groupe.<br/>
+Chaque fichier possède 3 permissions pour son propriétaire, son groupe
+et tous les autres. Les permissions sont lecture, écriture, exécution
+(plus d'autres non abordées dans ce cours).<br/>
+<table >
+  <tr><th style="width:20%">Permission</th> <th  style="width:40%">fichier</th> <th style="width:40%">répertoire</th> </tr>
+  <tr><td><em>lecture</em> (r)</td> <td>lire le contenu du
+  fichier</td>
+    <td >lister le contenu du répertoire</td></tr>
+  
+  <tr><td style="vertical-align:top;"><em>écriture</em> (w)</td> <td style="vertical-align:top;">écrire dans le fichier</td>
+    <td style="vertical-align:top;">supprimer/renommer/créer des
+    fichiers dans le répertoire</td></tr>
+  <tr><td style="vertical-align:top;"><em>exécution</em>
+  (x)</td> <td style="vertical-align:top;">exécuter le fichier
+  (si<br/>
+
+  c'est un programme)</td>
+    <td style="vertical-align:top;">rentrer dans le répertoire
+  </td></tr>
+</table>
+<code>$ ls -l
+drwxr-x---  9 kim prof 4096 Sep  7 21:31 Documents</code>
+</p>
+</div>
+<div class="sws-slide">
+<h1>La commande <em>chmod</em></h1>
+<code>
+   chmod <i>permissions</i> <i>chemin<sub>1</sub></i> … <i>chemin<sub>n</sub></i>
+</code>
+<p> modifie les permissions des fichiers <i>1</i> à <i>n</i>. La chaîne
+<i><tt>permissions</tt></i> est soit une suite de modifications de
+permissions <em>symbolique</em> soit l'ensemble des permissions données
+de manière <em>numérique</em>: <br/>
+<code>
+    chmod 755 fichier.txt
+    chmod u-w,a+x,g=w fichier.txt
+</code>
+</p>
+</div>
+<div class="sws-slide">
+<h1>Permissions numériques</h1>
+<p>
+On groupe les <em>bits</em> de permissions par trois puis on convertit
+en décimal:<br/>
+<table style="width:100%;text-align:center;" class="btable">
+<tr> <th colspan="3" style="width:33%"> Utilisateur </th>
+  <th colspan="3" style="width:33%">
+    Groupe</th>
+  <th colspan="3" style="width:33%">Autres</th>
+</tr>
+<tr>
+  <td>r</td>   <td>w</td>    <td>x</td>   <td>r</td>   <td>w</td>    <td>x</td>   <td>r</td>   <td>w</td>    <td>x</td> 
+</tr>
+<tr>
+  <td>1</td>   <td>1</td>    <td>0</td>   <td>1</td>   <td>0</td>    <td>0</td>   <td>0</td>   <td>0</td>    <td>0</td> 
+</tr>
+<tr>
+<td colspan="3"> 6 </td> <td colspan="3">
+    4</td><td colspan="3">0</td>
+</tr>
+</table>
+Le fichier est lisible et modifiable mais pas exécutable par son
+propriétaire, lisible pour le groupe. Les autres ne peuvent ni le lire
+ni le modifier.</p>
+</div>
+<div class="sws-slide">
+<h1>Permissions symboliques</h1>
+<code>
+       cible modifieur permission
+</code>
+<ul class="empty">
+  <li> <em>cible</em> : u (utilisateur), g (groupe), o (others), a
+  (all)
+  </li>
+
+  <li> <em>modifieur</em> : + (autorise), - (interdit), = (laisse
+  inchangé)
+  </li>
+
+  <li><em>permission</em> : r (lecture), w (écriture), x (exécution)</li>
+</ul>
+<p>
+Exemple:<br/>
+<code>   chmod u+rw,u-x,g+r,g-wx,o-rwx fichier.txt </code>
+</p>
+</div>
+  </body>
+</html>
diff --git a/prog_internet/prog_internet_02.xhtml b/prog_internet/prog_internet_02.xhtml
new file mode 100644 (file)
index 0000000..3300219
--- /dev/null
@@ -0,0 +1,1119 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
+          >
+<html xmlns="http://www.w3.org/1999/xhtml" >
+  <head>
+    <title>Programmation Internet</title>
+
+    <meta http-equiv="Content-Type"
+          content="text/html; charset=utf-8" />
+    <meta name="copyright"
+          content="Copyright &#169; 2013 Kim Nguyễn" />
+
+    <!-- Load jQuery -->
+    <script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
+    <!-- Load the library -->
+    <script src="../simpleWebSlides.js" type="text/javascript" ></script>
+
+    <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"  media="all" />
+    <!-- Load a custom Theme, the class-element marks this style-sheet
+         a "theme" that can be swtiched dynamicaly -->
+    <link class="sws-theme" rel="stylesheet"  title="U-Psud style"  href="../themes/uPsud.css" type="text/css" />
+
+    <!-- Customize some templates and initialize -->
+
+    <script type="text/javascript">
+      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
+      SWS.Config['sws-object-deactivate'] =  SWS.Effects.objectDeactivateFadeOut;
+      SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
+
+      //Ensures that we load SWS at the very end, after MathJax has
+      //been initialized
+
+      $(window).load(SWS.Presentation.init);
+    </script>
+    <style>
+      #svg2,#svg3 {
+      -webkit-transform: scale(1.8) translateX(40%);
+      transform: scale(1.8) translateX(40%);
+      }
+    </style>
+  </head>
+  <body>
+
+    <div class="sws-slide sws-cover sws-option-nofooter">
+      <h1>Programmation Internet</h1>
+      <h1>Cours 2</h1>
+      <a href="mailto:kn@lri.fr">kn@lri.fr</a><br/>
+      <a href="http://www.lri.fr/~kn/">http://www.lri.fr/~kn</a>
+    </div>
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li> Systèmes d'exploitation
+          <ul class="empty">
+            <li>1.1 Principes des systèmes
+              d'exploitation &#10004;</li>
+            <li>1.2 Système de gestion de fichiers &#10004;</li>
+            <li  class="hl">1.3 Système de gestion de processus</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Définitions </h1>
+      <table class="desc">
+        <tr>
+          <td style="width:6.5em;">Programme</td> <td>séquences d'instructions effectuant
+            une tâche sur un ordinateur</td>
+        </tr>
+        <tr>
+          <td>Exécutable</td> <td>fichier binaire contenant des
+            instructions machines interprétables par le
+            microprocesseur</td>
+        </tr>
+        <tr>
+          <td><i>Thread</i> </td>
+          <td>plus petite unité de traitement (≡
+            séquence d'instructions) pouvant être ordonnancée par
+            l'OS
+          </td>
+        </tr>
+        <tr>
+          <td>Processus</td>
+          <td> instance d'un programme (≡ « un
+            programme en cours d'exécution »). Un processus est constitué
+            de un ou plusieurs <i>threads</i>.</td>
+        </tr>
+      </table>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Exemple: programme </h1>
+      <p>Dans un fichier « <code> counter.c </code> »
+        (<span style="color:red;">attention c'est du pseudo
+          C</span>)</p>
+      <div style="float:left;clear:both;vertical-align:top;width:45%;display:inline-block;border-right: 1pt solid #494948;">
+<code > int count = 0;
+ int exit = 0;
+ void <span style="color:green;">display()</span> {
+    while (exit == 0) {
+      sleep (3);
+      printf("%i\n", count);
+    }
+ }
+ void <span style="color:red;">listen()</span> {
+    while (exit == 0) {
+      wait_connect(80);
+      count++;
+  }
+ }</code>
+      </div> <div style="vertical-align:top;display:inline-block;width:45%;">
+<code> void <span style="color:blue;">main ()</span> {
+    run_function(display);
+    run_function(listen);
+    while (getc () != '\n') { };
+    exit = 1;
+    return;
+ }</code>
+      </div>
+    </div>
+    <div class="sws-slide">
+      <h1> Exemple: programme </h1>
+      <p>Compilation <br/>
+        <code>
+          gcc -o counter.exe counter.c
+        </code><br/>
+        Le <em>fichier</em> « <code>counter.exe</code> » est un
+        exécutable (fichier binaire contenant du code machine)<br/>
+        <code>
+          ./counter.exe <span style="margin-left:2em;font-size:smaller;color:red;"> ← il faut la permission +x sur le fichier</span>
+        </code>
+        <br/>
+        Le contenu de l'exécutable est copié en mémoire et le processeur
+        commence à exécuter la première instruction du programme.
+      </p>
+    </div>
+    <div class="sws-slide">
+      <h1> Exemple: <i>threads</i> </h1>
+      <ol>
+        <li class="sws-pause" ><span style="color:white;background:blue">main</span> </li>
+        <li class="sws-pause" ><span style="color:blue;">attente d'un évènement clavier
+            →</span><span style="color:red;">←changement de <i>thread</i></span>
+        </li>
+        <li class="sws-pause" ><span style="color:white;background:red">listen</span> </li>
+        <li class="sws-pause" ><span style="color:red;">attente de connexion →</span><span style="color:green;">←changement de <i>thread</i></span>
+        </li>
+        <li class="sws-pause" ><span style="color:white;background:green">display</span> (<span style="color:green;">affiche
+            0 à l'écran)</span> </li>
+        <li class="sws-pause" ><span style="color:green;">attente pendant 3s →</span> (les
+          3 <i>threads</i> attendent un évènement externe)<br/>
+          <span class="sws-pause" >nouvelle connexion sur le port 80</span> <span style="color:red;">←
+            réveil du <i>thread</i> <code style="color:red;">listen</code></span>
+        </li>
+        <li class="sws-pause" ><span style="color:white;background:red">listen</span>
+          (<span style="color:red;">incrémente <code style="color:red">count</code></span>)<br/>
+          <span style="color:red;">attente de connexion →</span><br/>
+          <span>… fin des 3s</span><br/>
+          <span style="color:green;">←
+            réveil du <i>thread</i> <code style="color:green;">display</code></span>
+        </li>
+        <li class="sws-pause" ><span style="color:white;background:green">display</span> (<span style="color:green;">affiche
+            1 à l'écran)</span> </li>
+      </ol>
+      <p class="sws-pause" >Les <i>threads</i> partagent leur mémoire (variables communes)</p>
+    </div>
+    <div class="sws-slide">
+      <h1>Exemple: processus</h1>
+      <p>(différence: les processus
+        <em>ne partagent pas leur espace mémoire</em>)</p>
+      <ol>
+        <li>Exécution de <code><span style="color:blue;">coun</span><span style="color:red;">ter</span><span style="color:green;">.exe</span></code> pendant 50㎲
+        </li>
+        <li > Exécution
+          de <code><span style="color:orange;">firefox.exe</span></code>
+          pendant 50㎲ </li>
+        <li > Exécution du processus qui dessine le bureau pendant 50
+          ㎲<br/> … </li>
+        
+      </ol>
+      <p>C'est le <em>gestionnaire de processus</em> qui décide quel
+        programme a la main et pour combien de temps (priorité aux
+        tâches critiques par exemple)<br/>
+        Le système d'exploitation stocke pour chaque processus un
+        ensemble d'informations, le PCB (<i>Process Control Block</i>).
+      </p>
+    </div>
+    <div class="sws-slide">
+      <h1>Proccess Control Block</h1>
+      <p>Le PCB contient:</p>
+      <ul>
+        <li>l'<em>identificateur du processus</em> (pid)</li>
+        <li>l'<em>l'état</em> du processus (en attente, en exécution,
+          bloqué, …)</li>
+        <li>le compteur d'instructions (<i>i.e.</i> où on en est dans
+          le programme)</li>
+        <li>le <em>contexte courant</em>(état des registres, …)</li>
+        <li>position dans <em>la file d'attente de priorité
+            globale</em></li>
+        <li>informations mémoire (zones allouées, zones accessibles,
+          zones partagées)</li>
+        <li>listes des fichiers ouverts (en lecture, en écriture),
+          liste des connexions ouvertes, … <br/> … </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Opérations sur les processus</h1>
+      <ul>
+        <li><em>création</em> et <em>destruction</em> de
+          processus</li>
+        <li><em>suspension</em> et <em>reprise</em></li>
+        <li><em>duplication</em> (<i>fork</i>)</li>
+        <li>modification de la <em>priorité</em></li>
+        <li>modification des <em>permissions </em></li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>États d'un processus</h1>
+      <p>Un processus change d'état au cours de son exécution</p>
+      <table class="desc">
+        <tr><td style="width:6em;">Nouveau</td> <td>le processus est en cours de création</td></tr>
+        <tr><td>Exécution</td> <td>le processus s'exécute</td></tr>
+        <tr><td>En attente</td> <td>le processus attend un évènement
+            particulier (saisie au clavier, écriture sur le disque,
+            …)</td></tr>
+        <tr><td>Prêt</td> <td>le processus est prêt à reprendre son
+            exécution et attend que l'OS lui rende la main</td></tr>
+        <tr><td>terminé</td> <td>le processus a fini son exécution</td></tr>
+      </table>
+    </div>
+    <div class="sws-slide">
+      <h1>États d'un processus</h1>
+      <p>L'OS détermine et modifie l'état d'un processus:</p>
+      <ul>
+        <li>En fonction d'évènements internes au processus:
+          <ul><li>lecture d'un fichier (si le contenu n'est pas
+              disponible, le processus passe de « prêt » à « en attente
+              »)</li>
+            <li>le processus attends volontairement pendant x
+              secondes<br/>…</li>
+          </ul>
+        </li>
+        <li>
+          En fonction d'évènements externes au processus:
+          <ul><li>un fichier devient disponible</li>
+            <li>un <i>timer</i> arrive à 0</li>
+            <li>le matériel déclenche une <em>interruption</em></li>
+          </ul>
+        </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>États d'un processus</h1>
+      <svg
+         xmlns:svg="http://www.w3.org/2000/svg"
+         xmlns="http://www.w3.org/2000/svg"
+         version="1.1"
+         width="340.10629"
+         height="207.70399"
+         viewBox="0 0 350 208"
+         id="svg2"
+         >
+        <defs
+           id="defs4">
+          <marker
+             refX="0"
+             refY="0"
+             orient="auto"
+             id="Arrow2Mend"
+             style="overflow:visible">
+            <path
+               d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+               transform="scale(-0.6,-0.6)"
+               id="path3842"
+               style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+          </marker>
+        </defs>
+        <g
+           transform="translate(-43.8,-16.162183)"
+           id="layer1">
+          <g
+             transform="translate(2.8953552e-6,-2.2416992e-6)"
+             id="g4956">
+            <text
+               x="50"
+               y="32.362183"
+               id="text2985"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="50"
+                                                                                                                                                                                                                                                                             y="32.362183"
+                                                                                                                                                                                                                                                                             id="tspan2987">Nouveau</tspan></text>
+            <text
+               x="140"
+               y="102.36218"
+               id="text2989"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="140"
+                                                                                                                                                                                                                                                                             y="102.36218"
+                                                                                                                                                                                                                                                                             id="tspan2991">Prêt</tspan></text>
+            <text
+               x="255"
+               y="102.36218"
+               id="text2993"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="255"
+                                                                                                                                                                                                                                                                             y="102.36218"
+                                                                                                                                                                                                                                                                             id="tspan2995">En exécution</tspan></text>
+            <text
+               x="195"
+               y="187.36218"
+               id="text2997"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="195"
+                                                                                                                                                                                                                                                                             y="187.36218"
+                                                                                                                                                                                                                                                                             id="tspan2999">En attente</tspan></text>
+            <rect
+               width="65"
+               height="20"
+               rx="5"
+               ry="5.25"
+               x="45"
+               y="17.362183"
+               id="rect3007"
+               style="fill:none;stroke:#ffff05;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <rect
+               width="45"
+               height="20"
+               rx="5"
+               ry="5.25"
+               x="130"
+               y="87.362183"
+               id="rect3007-2"
+               style="fill:none;stroke:#009eff;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <rect
+               width="90"
+               height="20"
+               rx="5"
+               ry="5.25"
+               x="250"
+               y="87.362183"
+               id="rect3007-8"
+               style="fill:none;stroke:#5aff0b;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <rect
+               width="68"
+               height="19"
+               rx="5"
+               ry="5.25"
+               x="192"
+               y="173.36218"
+               id="rect3007-7"
+               style="fill:none;stroke:#ff7b00;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <path
+               d="m 70,42.362183 c 0,35 20,55 55,55"
+               id="path3809"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 150,82.362183 c 30,-30 120,-30 145,0"
+               id="path3809-2"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 295,112.36218 c -30,30 -121.15954,29.51126 -146.15954,-0.48874"
+               id="path3809-2-8"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 305,112.36218 c 0,35 -10,70 -45,70"
+               id="path3809-9"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 185,182.36218 c -35.00001,0 -45,-35 -45,-70"
+               id="path3809-9-6"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <text
+               x="325"
+               y="217.36218"
+               id="text2997-5"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="325"
+                                                                                                                                                                                                                                                                             y="217.36218"
+                                                                                                                                                                                                                                                                             id="tspan2999-3">Terminé</tspan></text>
+            <rect
+               width="58"
+               height="19"
+               rx="5"
+               ry="5.25"
+               x="322"
+               y="203.36218"
+               id="rect3007-7-6"
+               style="fill:none;stroke:#ff0000;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <path
+               d="m 315,112.36218 c 13.42024,11.32439 24.04764,43.74151 35,85"
+               id="path3809-9-6-7"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 225,197.36218 c 15,15 60,15 95,15"
+               id="path3809-9-6-2"
+               style="fill:none;stroke:#000000;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2, 1;stroke-dashoffset:0;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 135,112.36218 c 5,85 20,100 185,105"
+               id="path3809-8"
+               style="fill:none;stroke:#000000;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2, 1;stroke-dashoffset:0;marker-end:url(#Arrow2Mend)" />
+            <text
+               x="225"
+               y="37.362183"
+               id="text4821"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="225"
+                                                                                                                                                                                                                                                                                                               y="37.362183"
+                                                                                                                                                                                                                                                                                                               id="tspan4823">mise en route</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                      x="225"
+                                                                                                                                                                                                                                                                                                                                                      y="48.612183"
+                                                                                                                                                                                                                                                                                                                                                      id="tspan4825">par l'ordonnanceur</tspan></text>
+            <text
+               x="220"
+               y="117.36218"
+               id="text4821-3"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="220"
+                                                                                                                                                                                                                                                                                                               y="112.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4823-1">interruption</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                       x="220"
+                                                                                                                                                                                                                                                                                                                                                       y="123.61218"
+                                                                                                                                                                                                                                                                                                                                                       id="tspan4825-7">par l'ordonnanceur</tspan></text>
+            <text
+               x="300"
+               y="187.36218"
+               id="text4821-0"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="300"
+                                                                                                                                                                                                                                                                                                               y="187.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4825-74">attente E/S</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                       x="300"
+                                                                                                                                                                                                                                                                                                                                                       y="198.61218"
+                                                                                                                                                                                                                                                                                                                                                       id="tspan4864">interruption</tspan></text>
+            <text
+               x="180"
+               y="152.36218"
+               id="text4821-0-2"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="180"
+                                                                                                                                                                                                                                                                                                               y="152.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4864-7">fin E/S</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                  x="180"
+                                                                                                                                                                                                                                                                                                                                                  y="163.61218"
+                                                                                                                                                                                                                                                                                                                                                  id="tspan4892">int. traitée</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                                                        x="180"
+                                                                                                                                                                                                                                                                                                                                                                                        y="174.86218"
+                                                                                                                                                                                                                                                                                                                                                                                        id="tspan4894">…</tspan></text>
+            <text
+               x="360"
+               y="147.36218"
+               id="text4821-0-29"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="365"
+                                                                                                                                                                                                                                                                                                               y="147.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4864-1">terminaison</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                      x="365"
+                                                                                                                                                                                                                                                                                                                                                      y="158.61218"
+                                                                                                                                                                                                                                                                                                                                                      id="tspan4909">normale</tspan></text>
+            <text
+               x="170"
+               y="212.36218"
+               id="text4821-0-7"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="170"
+                                                                                                                                                                                                                                                                                                               y="212.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4864-75">terminaison</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                       x="170"
+                                                                                                                                                                                                                                                                                                                                                       y="223.61218"
+                                                                                                                                                                                                                                                                                                                                                       id="tspan4935">anormale</tspan></text>
+          </g>
+        </g>
+      </svg>
+    </div>
+    <div class="sws-slide">
+      <h1>La commande <code><em>ps</em></code></h1>
+      <p>Permet d'avoir des informations sur les processus en cours
+        d'exécution (voir « <code>man ps</code> » pour les
+        options):<br/>
+        <code>$ ps -o user,pid,state,cmd x
+          USER     PID   S CMD
+          …
+          kim      27030 Z [chrome] &lt;defunct&gt;
+          kim      27072 S /opt/google/chrome/chrome --type=renderer
+          kim      29146 S bash
+          kim      29834 S evince
+          kim      29858 S emacs cours.xhtml
+          kim      29869 R ps -o user,pid,state,cmd x
+        </code><br/>
+      </p>
+      
+    </div>
+    <div class="sws-slide">
+      <h1>États des processus (sous Linux)</h1>
+      <table class="desc">
+        <tr> <td>R</td> <td> <i>Running</i> (en cours d'exécution)</td> </tr>
+        <tr> <td>S</td> <td> <i>Interruptible sleep</i> (en attente,
+            interruptible) </td> </tr>
+        <tr> <td>D</td> <td> <i>Uninterruptible sleep</i> (en attente,
+            non-interruptible) </td> </tr>
+        <tr> <td>T</td> <td> <i>Stopped</i> (interrompu)</td></tr>
+        <tr> <td>Z</td> <td> <i>Zombie</i> (terminé mais toujours
+            listé par le système)</td> </tr>
+      </table>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Signaux</h1>
+      <p>L'OS peut envoyer des <em>signaux</em> à un processus. Sur réception
+        d'un signal, un processus peut interrompre son comportement normal
+        et exécuter son <em>gestionnaire de signal</em>. Quelques signaux:
+      </p>
+      <table class="simple">
+        <tr><th>Nom</th> <th>Code</th> <th>Description</th> </tr>
+        <tr><td>HUP</td> <td>1</td> <td>demande au processus de
+            s'interrompre</td></tr>
+        <tr><td>INT</td> <td>2</td> <td>demande au processus de se
+            terminer</td></tr>
+        <tr><td>ABRT</td> <td>2</td> <td>interrompt le processus et produit
+            un <i>dump</i></td></tr>
+        <tr><td>KILL</td> <td>9</td> <td>interrompt le processus immédiatement
+        </td></tr>
+        <tr><td>SEGV</td> <td>11</td> <td>signale au processus une erreur mémoire
+        </td></tr>
+        <tr><td>STOP</td> <td>24</td> <td>suspend l'exécution du processus
+        </td></tr>
+        <tr><td>CONT</td> <td>28</td> <td>reprend l'exécution d'un processus suspendu
+        </td></tr>
+      </table>
+    </div>
+    <div class="sws-slide">
+      <h1>Processus et terminal</h1>
+      <p >Un processus est lié au <em>terminal</em> dans lequel il est
+        lancé. Si on exécute un programme dans un terminal et que le
+        processus ne rend pas la main, le terminal est bloqué
+<code >
+
+ $ gedit
+
+</code>
+        On peut envoyer au processus le signal <em>STOP</em> en
+        tapant <code>ctrl-Z</code> dans le terminal:
+<code>
+
+ $ gedit
+ ^Z
+ [1]+  Stopped            gedit
+
+</code>
+        Le processus est suspendu, la fenêtre est gelée (ne répond plus).
+      </p>
+    </div>
+    <div class="sws-slide">
+      <h1>Processus et terminal</h1>
+      <p> <span>On peut reprendre l'exécution du programme de deux
+          manières:<br/>
+          <code> $ fg </code><br/>
+          Reprend l'exécution du processus et le remet en avant plan (terminal
+          bloqué)</span><br/>
+        <span class="sws-pause"><code> $ bg </code><br/>
+          Reprend l'exécution du processus et le remet en arrière plan (terminal
+libre)</span><br/>
+        <span class="sws-pause">On peut lancer un programme
+          directement en arrière plan en faisant:<br/>
+<code> $ gedit &amp; </code><br/></span>
+        <span class="sws-pause">On peut envoyer un signal à un
+          processus avec la commande «&nbsp;<code>kill [-signal] pid</code>&nbsp;»<br/>
+<code> $ kill -9 2345  </code></span>
+        </p>
+        </div>
+    <div class="sws-slide">
+      <h1>Processus et entrées/sorties</h1>
+      <p>Le terminal et le processus sont liés par trois fichiers
+      spéciaux:</p>
+      <ol>
+        <li> L'entrée standard (<code><em>stdin</em></code>), reliée
+          au clavier</li>
+        <li> La sortie standard (<code><em>stdout</em></code>), reliée
+          à l'affichage</li>
+        <li> La sortie d'erreur (<code><em>stderr</em></code>), reliée
+          à l'affichage</li>
+      </ol>
+      <p>Dans le <i>shell</i>, on peut utiliser les
+      opérateurs <code><em>&lt;</em></code>, <code><em>&gt;</em></code>
+      et <code><em>2&gt;</em></code> pour récupérer le contenu
+      de <code><em>stdin</em></code>, <code><em>stdout</em></code>
+      et <code><em>stderr</em></code>:<br/>
+<code>
+$ sort &lt; toto.txt
+$ ls -l  &gt; liste_fichiers.txt
+$ ls -l * 2&gt; erreurs.txt
+</code>
+</p>
+</div>
+    <div class="sws-slide">
+      <h1>Processus et entrées/sorties</h1>
+      <p>Dans le <i>shell</i>, l'opérateur <em>|</em> permet
+      d'enchaîner la sortie d'un programme avec l'entrée d'un
+      autre:<br/>
+<code> $ <span style="color:green;">ls -l *.txt</span> | <span style="color:blue">sort -n -r -k 5</span> | <span style="color:orange">head -n 1</span></code>
+      </p>
+      <ol>
+        <li style="color:green;">affiche la liste détaillée des
+        fichiers textes</li>
+        <li style="color:blue;">trie (et affiche) l'entrée standard par ordre
+        numérique décroissant selon le 5ème champ</li>
+        <li style="color:orange;">affiche la première ligne de
+        l'entrée standard</li>
+      </ol>
+      <div style="height:5em;position:relative;margin:0 0;padding:0 0;">
+<code class="sws-onframe-1" style="position:absolute;color:green;"> -rw-rw-r    1 kim kim 471 Sep 14 16:25 bd.txt
+ -rw-rw-r    1 kim kim 234 Sep 15 17:46 foo.txt
+ -rw-rw-r    1 kim kim 1048576 Sep 24 09:20 large.txt</code>
+<code class="sws-onframe-2" style="position:absolute;color:blue;"> -rw-rw-r    1 kim kim 1048576 Sep 24 09:20 large.txt
+ -rw-rw-r    1 kim kim 471 Sep 14 16:25 bd.txt
+ -rw-rw-r    1 kim kim 234 Sep 15 17:46 foo.txt
+</code>
+<code class="sws-onframe-3" style="position:absolute;color:orange;"> -rw-rw-r    1 kim kim 1048576 Sep 24 09:20 large.txt
+</code>
+      </div>
+
+    </div>
+<div class="sws-slide">
+  <h1>Processus de type <i>daemon</i></h1>
+<p>
+  Un <i>daemon</i> (prononcé démon) est un processus
+  qui <em>non-interactif</em> qui tourne en tâche de fond (pas
+  d'entrée/sortie sur le terminal, pas d'interface graphique, …). On
+  communique avec ce processus via des <em>signaux</em> ou en lisant
+  ou écrivant dans des fichiers ou connexions réseau. Le plus souvent,
+  leur but est de fournir un <em>service</em>
+</p>
+<p>Exemple de scénario: « <i> Les utilisateurs doivent interagir avec
+    le matériel. L'accès au matériel demande des droits
+    administrateur.</i> »
+</p>
+<ul class="empty">
+  <li>Solution 1 : tout le monde est administrateur (DOS, Win XP,
+  …)</li>
+  <li>Solution 2 : on crée un programme particulier qui a les
+  privilèges suffisants pour la tâche en question. Les utilisateurs
+  communiquent avec ce programme</li>
+</ul>
+</div>
+<div class="sws-slide">
+  <h1>Quelques <i>daemons</i> sous Linux</h1>
+<table class="simple">
+<tr><th>Nom</th> <th>Description</th> </tr>
+<tr><td>sshd</td> <td><i>shell</i> distant sécurisé</td> </tr>
+<tr><td>crond</td> <td>exécution périodique de programmes</td> </tr>
+<tr><td>cupsd</td> <td>serveur d'impressions</td> </tr>
+<tr><td>pulseaudio</td> <td>serveur de son (mixe les sons des
+    différentes applications)</td> </tr>
+<tr><td>udevd</td> <td>détection de matériel <i>hotplug</i></td></tr>
+<tr><td>nfsd</td> <td>serveur de fichier réseau</td></tr>
+<tr><td>smtpd</td> <td>livraison des e-mail</td></tr>
+<tr class="sws-pause"><td><em>httpd</em></td> <td>serveur de pages Web</td></tr>
+</table>
+</div>
+<div class="sws-slide">
+<h1>Architecture client-serveur</h1>
+<svg
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   version="1.1"
+   width="256"
+   height="163.70399"
+   id="svg3">
+  <defs
+     id="defs3115">
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-9"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-7"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-2"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-3"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-1"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-71"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4143"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4145"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-11"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-39"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4143-8"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4145-9"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-6"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-1"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4245"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4247"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-7"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-8"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4353"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4355"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-8"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-4"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4353-5"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4355-9"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+  </defs>
+  <g
+     transform="translate(-158.9,-91.262203)"
+     id="layer1">
+    <g
+       id="g3947">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="translate(-1.2000122,1.5039978)"
+       id="g3942">
+      <text
+         x="266.20001"
+         y="175.85818"
+         id="text2985-1"
+         xml:space="preserve"
+         style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+           x="266.20001"
+           y="175.85818"
+           id="tspan3164">Serveur</tspan></text>
+      <rect
+         width="53.799988"
+         height="21.503998"
+         rx="5"
+         ry="5.25"
+         x="261.20001"
+         y="160.85818"
+         id="rect3007-8"
+         style="fill:none;stroke:#0000ff;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+    </g>
+    <g
+       id="g4097">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="translate(210,0)"
+       id="g3947-5">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-3">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-0"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-3">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-5"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="translate(109.96827,1.0864348)"
+       id="g4097-7">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-3"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-7"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="matrix(0.56532555,0.82486788,-0.82486788,0.56532555,266.51188,-153.17986)"
+       id="g4097-0">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-2"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-5"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="translate(40,-70)"
+       id="g3947-3">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-36">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-2"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-4">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-7"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="translate(165,-70)"
+       id="g3947-1">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-1">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-9"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-6">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-6"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="matrix(-0.56532555,0.82486788,0.82486788,0.56532555,302.25486,-153.17986)"
+       id="g4097-0-8">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-2-9"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-5-7"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="translate(40,70)"
+       id="g3947-3-1">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-36-8">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-2-8"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-4-1">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-7-3"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="translate(160,70)"
+       id="g3947-1-7">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-1-2">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-9-4"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-6-0">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-6-4"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="matrix(0.56532555,0.82486788,-0.82486788,0.56532555,327.54691,-80.416181)"
+       id="g4097-0-2">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-2-3"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-5-5"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="matrix(-0.56532555,0.82486788,0.82486788,0.56532555,242.10224,-81.191343)"
+       id="g4097-0-3">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-2-7"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-5-9"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+  </g>
+</svg>
+<p>
+  <br/><br/>
+  Des processus <span style="color:blue;">clients</span> communiquent
+  avec le <span style="color:orange;">serveur</span> à travers le
+  réseau. Les clients sont indépendant et ne communiquent pas entre
+  eux. <em>Attention</em> plusieurs clients peuvent se trouver su la
+  même machine physique!
+</p>
+</div>
+<div class="sws-slide">
+  <h1>Architecture client-serveur</h1>
+<ul>
+  <li>Le serveur attend des connexions entrantes</li>
+  <li>Les clients peuvent se connecter à tout moment</li>
+  <li>L'application client est généralement légère, envoie une
+  requête au serveur et attend un résultat</li>
+  <li>Le serveur est une application plus lourde qui:
+    <ul><li>effectue des calculs trop coûteux pour le client</li>
+      <li>gère l'accès à une ressource distante partagée<br/>…</li>
+    </ul>
+  </li>
+</ul>
+<p>Exemples: serveur de bases de données, serveur mail, serveur Web,
+  terminal de carte bancaire, …</p>
+</div>
+  </body>
+</html>
diff --git a/prog_internet/prog_internet_03.xhtml b/prog_internet/prog_internet_03.xhtml
new file mode 100644 (file)
index 0000000..fa93d63
--- /dev/null
@@ -0,0 +1,1119 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
+          >
+<html xmlns="http://www.w3.org/1999/xhtml" >
+  <head>
+    <title>Programmation Internet</title>
+
+    <meta http-equiv="Content-Type"
+          content="text/html; charset=utf-8" />
+    <meta name="copyright"
+          content="Copyright &#169; 2013 Kim Nguyễn" />
+
+    <!-- Load jQuery -->
+    <script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
+    <!-- Load the library -->
+    <script src="../simpleWebSlides.js" type="text/javascript" ></script>
+
+    <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"  media="all" />
+    <!-- Load a custom Theme, the class-element marks this style-sheet
+         a "theme" that can be swtiched dynamicaly -->
+    <link class="sws-theme" rel="stylesheet"  title="U-Psud style"  href="../themes/uPsud.css" type="text/css" />
+
+    <!-- Customize some templates and initialize -->
+
+    <script type="text/javascript">
+      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
+      SWS.Config['sws-object-deactivate'] =  SWS.Effects.objectDeactivateFadeOut;
+      SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
+
+      //Ensures that we load SWS at the very end, after MathJax has
+      //been initialized
+
+      $(window).load(SWS.Presentation.init);
+    </script>
+    <style>
+      #svg2,#svg3 {
+      -webkit-transform: scale(1.8) translateX(40%);
+      transform: scale(1.8) translateX(40%);
+      }
+    </style>
+  </head>
+  <body>
+
+    <div class="sws-slide sws-cover sws-option-nofooter">
+      <h1>Programmation Internet</h1>
+      <h1>Cours 2</h1>
+      <a href="mailto:kn@lri.fr">kn@lri.fr</a><br/>
+      <a href="http://www.lri.fr/~kn/">http://www.lri.fr/~kn</a>
+    </div>
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li> Systèmes d'exploitation &#10004;
+          <li class="hi"> Réseau et Internet 
+            <ul class="empty">
+              <li class="hi"> 2.1 Principes des réseaux</li>
+              <li> 2.2 TCP/IP</li>
+              <li> 3
+            </ul>
+        </li>
+      </ol>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Définitions </h1>
+      <table class="desc">
+        <tr>
+          <td style="width:6.5em;">Programme</td> <td>séquences d'instructions effectuant
+            une tâche sur un ordinateur</td>
+        </tr>
+        <tr>
+          <td>Exécutable</td> <td>fichier binaire contenant des
+            instructions machines interprétables par le
+            microprocesseur</td>
+        </tr>
+        <tr>
+          <td><i>Thread</i> </td>
+          <td>plus petite unité de traitement (≡
+            séquence d'instructions) pouvant être ordonnancée par
+            l'OS
+          </td>
+        </tr>
+        <tr>
+          <td>Processus</td>
+          <td> instance d'un programme (≡ « un
+            programme en cours d'exécution »). Un processus est constitué
+            de un ou plusieurs <i>threads</i>.</td>
+        </tr>
+      </table>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Exemple: programme </h1>
+      <p>Dans un fichier « <code> counter.c </code> »
+        (<span style="color:red;">attention c'est du pseudo
+          C</span>)</p>
+      <div style="float:left;clear:both;vertical-align:top;width:45%;display:inline-block;border-right: 1pt solid #494948;">
+<code > int count = 0;
+ int exit = 0;
+ void <span style="color:green;">display()</span> {
+    while (exit == 0) {
+      sleep (3);
+      printf("%i\n", count);
+    }
+ }
+ void <span style="color:red;">listen()</span> {
+    while (exit == 0) {
+      wait_connect(80);
+      count++;
+  }
+ }</code>
+      </div> <div style="vertical-align:top;display:inline-block;width:45%;">
+<code> void <span style="color:blue;">main ()</span> {
+    run_function(display);
+    run_function(listen);
+    while (getc () != '\n') { };
+    exit = 1;
+    return;
+ }</code>
+      </div>
+    </div>
+    <div class="sws-slide">
+      <h1> Exemple: programme </h1>
+      <p>Compilation <br/>
+        <code>
+          gcc -o counter.exe counter.c
+        </code><br/>
+        Le <em>fichier</em> « <code>counter.exe</code> » est un
+        exécutable (fichier binaire contenant du code machine)<br/>
+        <code>
+          ./counter.exe <span style="margin-left:2em;font-size:smaller;color:red;"> ← il faut la permission +x sur le fichier</span>
+        </code>
+        <br/>
+        Le contenu de l'exécutable est copié en mémoire et le processeur
+        commence à exécuter la première instruction du programme.
+      </p>
+    </div>
+    <div class="sws-slide">
+      <h1> Exemple: <i>threads</i> </h1>
+      <ol>
+        <li class="sws-pause" ><span style="color:white;background:blue">main</span> </li>
+        <li class="sws-pause" ><span style="color:blue;">attente d'un évènement clavier
+            →</span><span style="color:red;">←changement de <i>thread</i></span>
+        </li>
+        <li class="sws-pause" ><span style="color:white;background:red">listen</span> </li>
+        <li class="sws-pause" ><span style="color:red;">attente de connexion →</span><span style="color:green;">←changement de <i>thread</i></span>
+        </li>
+        <li class="sws-pause" ><span style="color:white;background:green">display</span> (<span style="color:green;">affiche
+            0 à l'écran)</span> </li>
+        <li class="sws-pause" ><span style="color:green;">attente pendant 3s →</span> (les
+          3 <i>threads</i> attendent un évènement externe)<br/>
+          <span class="sws-pause" >nouvelle connexion sur le port 80</span> <span style="color:red;">←
+            réveil du <i>thread</i> <code style="color:red;">listen</code></span>
+        </li>
+        <li class="sws-pause" ><span style="color:white;background:red">listen</span>
+          (<span style="color:red;">incrémente <code style="color:red">count</code></span>)<br/>
+          <span style="color:red;">attente de connexion →</span><br/>
+          <span>… fin des 3s</span><br/>
+          <span style="color:green;">←
+            réveil du <i>thread</i> <code style="color:green;">display</code></span>
+        </li>
+        <li class="sws-pause" ><span style="color:white;background:green">display</span> (<span style="color:green;">affiche
+            1 à l'écran)</span> </li>
+      </ol>
+      <p class="sws-pause" >Les <i>threads</i> partagent leur mémoire (variables communes)</p>
+    </div>
+    <div class="sws-slide">
+      <h1>Exemple: processus</h1>
+      <p>(différence: les processus
+        <em>ne partagent pas leur espace mémoire</em>)</p>
+      <ol>
+        <li>Exécution de <code><span style="color:blue;">coun</span><span style="color:red;">ter</span><span style="color:green;">.exe</span></code> pendant 50㎲
+        </li>
+        <li > Exécution
+          de <code><span style="color:orange;">firefox.exe</span></code>
+          pendant 50㎲ </li>
+        <li > Exécution du processus qui dessine le bureau pendant 50
+          ㎲<br/> … </li>
+        
+      </ol>
+      <p>C'est le <em>gestionnaire de processus</em> qui décide quel
+        programme a la main et pour combien de temps (priorité aux
+        tâches critiques par exemple)<br/>
+        Le système d'exploitation stocke pour chaque processus un
+        ensemble d'informations, le PCB (<i>Process Control Block</i>).
+      </p>
+    </div>
+    <div class="sws-slide">
+      <h1>Proccess Control Block</h1>
+      <p>Le PCB contient:</p>
+      <ul>
+        <li>l'<em>identificateur du processus</em> (pid)</li>
+        <li>l'<em>l'état</em> du processus (en attente, en exécution,
+          bloqué, …)</li>
+        <li>le compteur d'instructions (<i>i.e.</i> où on en est dans
+          le programme)</li>
+        <li>le <em>contexte courant</em>(état des registres, …)</li>
+        <li>position dans <em>la file d'attente de priorité
+            globale</em></li>
+        <li>informations mémoire (zones allouées, zones accessibles,
+          zones partagées)</li>
+        <li>listes des fichiers ouverts (en lecture, en écriture),
+          liste des connexions ouvertes, … <br/> … </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Opérations sur les processus</h1>
+      <ul>
+        <li><em>création</em> et <em>destruction</em> de
+          processus</li>
+        <li><em>suspension</em> et <em>reprise</em></li>
+        <li><em>duplication</em> (<i>fork</i>)</li>
+        <li>modification de la <em>priorité</em></li>
+        <li>modification des <em>permissions </em></li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>États d'un processus</h1>
+      <p>Un processus change d'état au cours de son exécution</p>
+      <table class="desc">
+        <tr><td style="width:6em;">Nouveau</td> <td>le processus est en cours de création</td></tr>
+        <tr><td>Exécution</td> <td>le processus s'exécute</td></tr>
+        <tr><td>En attente</td> <td>le processus attend un évènement
+            particulier (saisie au clavier, écriture sur le disque,
+            …)</td></tr>
+        <tr><td>Prêt</td> <td>le processus est prêt à reprendre son
+            exécution et attend que l'OS lui rende la main</td></tr>
+        <tr><td>terminé</td> <td>le processus a fini son exécution</td></tr>
+      </table>
+    </div>
+    <div class="sws-slide">
+      <h1>États d'un processus</h1>
+      <p>L'OS détermine et modifie l'état d'un processus:</p>
+      <ul>
+        <li>En fonction d'évènements internes au processus:
+          <ul><li>lecture d'un fichier (si le contenu n'est pas
+              disponible, le processus passe de « prêt » à « en attente
+              »)</li>
+            <li>le processus attends volontairement pendant x
+              secondes<br/>…</li>
+          </ul>
+        </li>
+        <li>
+          En fonction d'évènements externes au processus:
+          <ul><li>un fichier devient disponible</li>
+            <li>un <i>timer</i> arrive à 0</li>
+            <li>le matériel déclenche une <em>interruption</em></li>
+          </ul>
+        </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>États d'un processus</h1>
+      <svg
+         xmlns:svg="http://www.w3.org/2000/svg"
+         xmlns="http://www.w3.org/2000/svg"
+         version="1.1"
+         width="340.10629"
+         height="207.70399"
+         viewBox="0 0 350 208"
+         id="svg2"
+         >
+        <defs
+           id="defs4">
+          <marker
+             refX="0"
+             refY="0"
+             orient="auto"
+             id="Arrow2Mend"
+             style="overflow:visible">
+            <path
+               d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+               transform="scale(-0.6,-0.6)"
+               id="path3842"
+               style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+          </marker>
+        </defs>
+        <g
+           transform="translate(-43.8,-16.162183)"
+           id="layer1">
+          <g
+             transform="translate(2.8953552e-6,-2.2416992e-6)"
+             id="g4956">
+            <text
+               x="50"
+               y="32.362183"
+               id="text2985"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="50"
+                                                                                                                                                                                                                                                                             y="32.362183"
+                                                                                                                                                                                                                                                                             id="tspan2987">Nouveau</tspan></text>
+            <text
+               x="140"
+               y="102.36218"
+               id="text2989"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="140"
+                                                                                                                                                                                                                                                                             y="102.36218"
+                                                                                                                                                                                                                                                                             id="tspan2991">Prêt</tspan></text>
+            <text
+               x="255"
+               y="102.36218"
+               id="text2993"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="255"
+                                                                                                                                                                                                                                                                             y="102.36218"
+                                                                                                                                                                                                                                                                             id="tspan2995">En exécution</tspan></text>
+            <text
+               x="195"
+               y="187.36218"
+               id="text2997"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="195"
+                                                                                                                                                                                                                                                                             y="187.36218"
+                                                                                                                                                                                                                                                                             id="tspan2999">En attente</tspan></text>
+            <rect
+               width="65"
+               height="20"
+               rx="5"
+               ry="5.25"
+               x="45"
+               y="17.362183"
+               id="rect3007"
+               style="fill:none;stroke:#ffff05;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <rect
+               width="45"
+               height="20"
+               rx="5"
+               ry="5.25"
+               x="130"
+               y="87.362183"
+               id="rect3007-2"
+               style="fill:none;stroke:#009eff;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <rect
+               width="90"
+               height="20"
+               rx="5"
+               ry="5.25"
+               x="250"
+               y="87.362183"
+               id="rect3007-8"
+               style="fill:none;stroke:#5aff0b;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <rect
+               width="68"
+               height="19"
+               rx="5"
+               ry="5.25"
+               x="192"
+               y="173.36218"
+               id="rect3007-7"
+               style="fill:none;stroke:#ff7b00;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <path
+               d="m 70,42.362183 c 0,35 20,55 55,55"
+               id="path3809"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 150,82.362183 c 30,-30 120,-30 145,0"
+               id="path3809-2"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 295,112.36218 c -30,30 -121.15954,29.51126 -146.15954,-0.48874"
+               id="path3809-2-8"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 305,112.36218 c 0,35 -10,70 -45,70"
+               id="path3809-9"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 185,182.36218 c -35.00001,0 -45,-35 -45,-70"
+               id="path3809-9-6"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <text
+               x="325"
+               y="217.36218"
+               id="text2997-5"
+               xml:space="preserve"
+               style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                             x="325"
+                                                                                                                                                                                                                                                                             y="217.36218"
+                                                                                                                                                                                                                                                                             id="tspan2999-3">Terminé</tspan></text>
+            <rect
+               width="58"
+               height="19"
+               rx="5"
+               ry="5.25"
+               x="322"
+               y="203.36218"
+               id="rect3007-7-6"
+               style="fill:none;stroke:#ff0000;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+            <path
+               d="m 315,112.36218 c 13.42024,11.32439 24.04764,43.74151 35,85"
+               id="path3809-9-6-7"
+               style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 225,197.36218 c 15,15 60,15 95,15"
+               id="path3809-9-6-2"
+               style="fill:none;stroke:#000000;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2, 1;stroke-dashoffset:0;marker-end:url(#Arrow2Mend)" />
+            <path
+               d="m 135,112.36218 c 5,85 20,100 185,105"
+               id="path3809-8"
+               style="fill:none;stroke:#000000;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2, 1;stroke-dashoffset:0;marker-end:url(#Arrow2Mend)" />
+            <text
+               x="225"
+               y="37.362183"
+               id="text4821"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="225"
+                                                                                                                                                                                                                                                                                                               y="37.362183"
+                                                                                                                                                                                                                                                                                                               id="tspan4823">mise en route</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                      x="225"
+                                                                                                                                                                                                                                                                                                                                                      y="48.612183"
+                                                                                                                                                                                                                                                                                                                                                      id="tspan4825">par l'ordonnanceur</tspan></text>
+            <text
+               x="220"
+               y="117.36218"
+               id="text4821-3"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="220"
+                                                                                                                                                                                                                                                                                                               y="112.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4823-1">interruption</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                       x="220"
+                                                                                                                                                                                                                                                                                                                                                       y="123.61218"
+                                                                                                                                                                                                                                                                                                                                                       id="tspan4825-7">par l'ordonnanceur</tspan></text>
+            <text
+               x="300"
+               y="187.36218"
+               id="text4821-0"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="300"
+                                                                                                                                                                                                                                                                                                               y="187.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4825-74">attente E/S</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                       x="300"
+                                                                                                                                                                                                                                                                                                                                                       y="198.61218"
+                                                                                                                                                                                                                                                                                                                                                       id="tspan4864">interruption</tspan></text>
+            <text
+               x="180"
+               y="152.36218"
+               id="text4821-0-2"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="180"
+                                                                                                                                                                                                                                                                                                               y="152.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4864-7">fin E/S</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                  x="180"
+                                                                                                                                                                                                                                                                                                                                                  y="163.61218"
+                                                                                                                                                                                                                                                                                                                                                  id="tspan4892">int. traitée</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                                                        x="180"
+                                                                                                                                                                                                                                                                                                                                                                                        y="174.86218"
+                                                                                                                                                                                                                                                                                                                                                                                        id="tspan4894">…</tspan></text>
+            <text
+               x="360"
+               y="147.36218"
+               id="text4821-0-29"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="365"
+                                                                                                                                                                                                                                                                                                               y="147.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4864-1">terminaison</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                      x="365"
+                                                                                                                                                                                                                                                                                                                                                      y="158.61218"
+                                                                                                                                                                                                                                                                                                                                                      id="tspan4909">normale</tspan></text>
+            <text
+               x="170"
+               y="212.36218"
+               id="text4821-0-7"
+               xml:space="preserve"
+               style="font-size:9px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;text-align:center;line-height:125%;letter-spacing:0px;word-spacing:0px;text-anchor:middle;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+                                                                                                                                                                                                                                                                                                               x="170"
+                                                                                                                                                                                                                                                                                                               y="212.36218"
+                                                                                                                                                                                                                                                                                                               id="tspan4864-75">terminaison</tspan><tspan
+                                                                                                                                                                                                                                                                                                                                                       x="170"
+                                                                                                                                                                                                                                                                                                                                                       y="223.61218"
+                                                                                                                                                                                                                                                                                                                                                       id="tspan4935">anormale</tspan></text>
+          </g>
+        </g>
+      </svg>
+    </div>
+    <div class="sws-slide">
+      <h1>La commande <code><em>ps</em></code></h1>
+      <p>Permet d'avoir des informations sur les processus en cours
+        d'exécution (voir « <code>man ps</code> » pour les
+        options):<br/>
+        <code>$ ps -o user,pid,state,cmd x
+          USER     PID   S CMD
+          …
+          kim      27030 Z [chrome] &lt;defunct&gt;
+          kim      27072 S /opt/google/chrome/chrome --type=renderer
+          kim      29146 S bash
+          kim      29834 S evince
+          kim      29858 S emacs cours.xhtml
+          kim      29869 R ps -o user,pid,state,cmd x
+        </code><br/>
+      </p>
+      
+    </div>
+    <div class="sws-slide">
+      <h1>États des processus (sous Linux)</h1>
+      <table class="desc">
+        <tr> <td>R</td> <td> <i>Running</i> (en cours d'exécution)</td> </tr>
+        <tr> <td>S</td> <td> <i>Interruptible sleep</i> (en attente,
+            interruptible) </td> </tr>
+        <tr> <td>D</td> <td> <i>Uninterruptible sleep</i> (en attente,
+            non-interruptible) </td> </tr>
+        <tr> <td>T</td> <td> <i>Stopped</i> (interrompu)</td></tr>
+        <tr> <td>Z</td> <td> <i>Zombie</i> (terminé mais toujours
+            listé par le système)</td> </tr>
+      </table>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Signaux</h1>
+      <p>L'OS peut envoyer des <em>signaux</em> à un processus. Sur réception
+        d'un signal, un processus peut interrompre son comportement normal
+        et exécuter son <em>gestionnaire de signal</em>. Quelques signaux:
+      </p>
+      <table class="simple">
+        <tr><th>Nom</th> <th>Code</th> <th>Description</th> </tr>
+        <tr><td>HUP</td> <td>1</td> <td>demande au processus de
+            s'interrompre</td></tr>
+        <tr><td>INT</td> <td>2</td> <td>demande au processus de se
+            terminer</td></tr>
+        <tr><td>ABRT</td> <td>2</td> <td>interrompt le processus et produit
+            un <i>dump</i></td></tr>
+        <tr><td>KILL</td> <td>9</td> <td>interrompt le processus immédiatement
+        </td></tr>
+        <tr><td>SEGV</td> <td>11</td> <td>signale au processus une erreur mémoire
+        </td></tr>
+        <tr><td>STOP</td> <td>24</td> <td>suspend l'exécution du processus
+        </td></tr>
+        <tr><td>CONT</td> <td>28</td> <td>reprend l'exécution d'un processus suspendu
+        </td></tr>
+      </table>
+    </div>
+    <div class="sws-slide">
+      <h1>Processus et terminal</h1>
+      <p >Un processus est lié au <em>terminal</em> dans lequel il est
+        lancé. Si on exécute un programme dans un terminal et que le
+        processus ne rend pas la main, le terminal est bloqué
+<code >
+
+ $ gedit
+
+</code>
+        On peut envoyer au processus le signal <em>STOP</em> en
+        tapant <code>ctrl-Z</code> dans le terminal:
+<code>
+
+ $ gedit
+ ^Z
+ [1]+  Stopped            gedit
+
+</code>
+        Le processus est suspendu, la fenêtre est gelée (ne répond plus).
+      </p>
+    </div>
+    <div class="sws-slide">
+      <h1>Processus et terminal</h1>
+      <p> <span>On peut reprendre l'exécution du programme de deux
+          manières:<br/>
+          <code> $ fg </code><br/>
+          Reprend l'exécution du processus et le remet en avant plan (terminal
+          bloqué)</span><br/>
+        <span class="sws-pause"><code> $ bg </code><br/>
+          Reprend l'exécution du processus et le remet en arrière plan (terminal
+libre)</span><br/>
+        <span class="sws-pause">On peut lancer un programme
+          directement en arrière plan en faisant:<br/>
+<code> $ gedit &amp; </code><br/></span>
+        <span class="sws-pause">On peut envoyer un signal à un
+          processus avec la commande «&nbsp;<code>kill [-signal] pid</code>&nbsp;»<br/>
+<code> $ kill -9 2345  </code></span>
+        </p>
+        </div>
+    <div class="sws-slide">
+      <h1>Processus et entrées/sorties</h1>
+      <p>Le terminal et le processus sont liés par trois fichiers
+      spéciaux:</p>
+      <ol>
+        <li> L'entrée standard (<code><em>stdin</em></code>), reliée
+          au clavier</li>
+        <li> La sortie standard (<code><em>stdout</em></code>), reliée
+          à l'affichage</li>
+        <li> La sortie d'erreur (<code><em>stderr</em></code>), reliée
+          à l'affichage</li>
+      </ol>
+      <p>Dans le <i>shell</i>, on peut utiliser les
+      opérateurs <code><em>&lt;</em></code>, <code><em>&gt;</em></code>
+      et <code><em>2&gt;</em></code> pour récupérer le contenu
+      de <code><em>stdin</em></code>, <code><em>stdout</em></code>
+      et <code><em>stderr</em></code>:<br/>
+<code>
+$ sort &lt; toto.txt
+$ ls -l  &gt; liste_fichiers.txt
+$ ls -l * 2&gt; erreurs.txt
+</code>
+</p>
+</div>
+    <div class="sws-slide">
+      <h1>Processus et entrées/sorties</h1>
+      <p>Dans le <i>shell</i>, l'opérateur <em>|</em> permet
+      d'enchaîner la sortie d'un programme avec l'entrée d'un
+      autre:<br/>
+<code> $ <span style="color:green;">ls -l *.txt</span> | <span style="color:blue">sort -n -r -k 5</span> | <span style="color:orange">head -n 1</span></code>
+      </p>
+      <ol>
+        <li style="color:green;">affiche la liste détaillée des
+        fichiers textes</li>
+        <li style="color:blue;">trie (et affiche) l'entrée standard par ordre
+        numérique décroissant selon le 5ème champ</li>
+        <li style="color:orange;">affiche la première ligne de
+        l'entrée standard</li>
+      </ol>
+      <div style="height:5em;position:relative;margin:0 0;padding:0 0;">
+<code class="sws-onframe-1" style="position:absolute;color:green;"> -rw-rw-r    1 kim kim 471 Sep 14 16:25 bd.txt
+ -rw-rw-r    1 kim kim 234 Sep 15 17:46 foo.txt
+ -rw-rw-r    1 kim kim 1048576 Sep 24 09:20 large.txt</code>
+<code class="sws-onframe-2" style="position:absolute;color:blue;"> -rw-rw-r    1 kim kim 1048576 Sep 24 09:20 large.txt
+ -rw-rw-r    1 kim kim 471 Sep 14 16:25 bd.txt
+ -rw-rw-r    1 kim kim 234 Sep 15 17:46 foo.txt
+</code>
+<code class="sws-onframe-3" style="position:absolute;color:orange;"> -rw-rw-r    1 kim kim 1048576 Sep 24 09:20 large.txt
+</code>
+      </div>
+
+    </div>
+<div class="sws-slide">
+  <h1>Processus de type <i>daemon</i></h1>
+<p>
+  Un <i>daemon</i> (prononcé démon) est un processus
+  qui <em>non-interactif</em> qui tourne en tâche de fond (pas
+  d'entrée/sortie sur le terminal, pas d'interface graphique, …). On
+  communique avec ce processus via des <em>signaux</em> ou en lisant
+  ou écrivant dans des fichiers ou connexions réseau. Le plus souvent,
+  leur but est de fournir un <em>service</em>
+</p>
+<p>Exemple de scénario: « <i> Les utilisateurs doivent interagir avec
+    le matériel. L'accès au matériel demande des droits
+    administrateur.</i> »
+</p>
+<ul class="empty">
+  <li>Solution 1 : tout le monde est administrateur (DOS, Win XP,
+  …)</li>
+  <li>Solution 2 : on crée un programme particulier qui a les
+  privilèges suffisants pour la tâche en question. Les utilisateurs
+  communiquent avec ce programme</li>
+</ul>
+</div>
+<div class="sws-slide">
+  <h1>Quelques <i>daemons</i> sous Linux</h1>
+<table class="simple">
+<tr><th>Nom</th> <th>Description</th> </tr>
+<tr><td>sshd</td> <td><i>shell</i> distant sécurisé</td> </tr>
+<tr><td>crond</td> <td>exécution périodique de programmes</td> </tr>
+<tr><td>cupsd</td> <td>serveur d'impressions</td> </tr>
+<tr><td>pulseaudio</td> <td>serveur de son (mixe les sons des
+    différentes applications)</td> </tr>
+<tr><td>udevd</td> <td>détection de matériel <i>hotplug</i></td></tr>
+<tr><td>nfsd</td> <td>serveur de fichier réseau</td></tr>
+<tr><td>smtpd</td> <td>livraison des e-mail</td></tr>
+<tr class="sws-pause"><td><em>httpd</em></td> <td>serveur de pages Web</td></tr>
+</table>
+</div>
+<div class="sws-slide">
+<h1>Architecture client-serveur</h1>
+<svg
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   version="1.1"
+   width="256"
+   height="163.70399"
+   id="svg3">
+  <defs
+     id="defs3115">
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-9"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-7"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-2"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-3"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-1"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-71"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4143"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4145"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-11"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-39"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4143-8"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4145-9"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-6"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-1"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4245"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4247"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-7"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-8"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4353"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4355"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="Arrow2Mend-8"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path3842-4"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+    <marker
+       refX="0"
+       refY="0"
+       orient="auto"
+       id="marker4353-5"
+       style="overflow:visible">
+      <path
+         d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+         transform="scale(-0.6,-0.6)"
+         id="path4355-9"
+         style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
+    </marker>
+  </defs>
+  <g
+     transform="translate(-158.9,-91.262203)"
+     id="layer1">
+    <g
+       id="g3947">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="translate(-1.2000122,1.5039978)"
+       id="g3942">
+      <text
+         x="266.20001"
+         y="175.85818"
+         id="text2985-1"
+         xml:space="preserve"
+         style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+           x="266.20001"
+           y="175.85818"
+           id="tspan3164">Serveur</tspan></text>
+      <rect
+         width="53.799988"
+         height="21.503998"
+         rx="5"
+         ry="5.25"
+         x="261.20001"
+         y="160.85818"
+         id="rect3007-8"
+         style="fill:none;stroke:#0000ff;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+    </g>
+    <g
+       id="g4097">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="translate(210,0)"
+       id="g3947-5">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-3">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-0"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-3">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-5"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="translate(109.96827,1.0864348)"
+       id="g4097-7">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-3"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-7"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="matrix(0.56532555,0.82486788,-0.82486788,0.56532555,266.51188,-153.17986)"
+       id="g4097-0">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-2"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-5"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="translate(40,-70)"
+       id="g3947-3">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-36">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-2"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-4">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-7"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="translate(165,-70)"
+       id="g3947-1">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-1">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-9"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-6">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-6"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="matrix(-0.56532555,0.82486788,0.82486788,0.56532555,302.25486,-153.17986)"
+       id="g4097-0-8">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-2-9"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-5-7"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="translate(40,70)"
+       id="g3947-3-1">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-36-8">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-2-8"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-4-1">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-7-3"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="translate(160,70)"
+       id="g3947-1-7">
+      <g
+         transform="translate(-1.1999969,-3.4960022)"
+         id="g4068-1-2">
+        <text
+           x="166.2"
+           y="180.85818"
+           id="text2985-9-4"
+           xml:space="preserve"
+           style="font-size:12.5px;font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:DIN;-inkscape-font-specification:DIN Semi-Bold"><tspan
+             x="166.2"
+             y="180.85818"
+             id="tspan2987-6-0">Client</tspan></text>
+        <rect
+           width="43.800003"
+           height="21.503998"
+           rx="5"
+           ry="5.25"
+           x="161.2"
+           y="165.85818"
+           id="rect3007-6-4"
+           style="fill:none;stroke:#ff8305;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" />
+      </g>
+    </g>
+    <g
+       transform="matrix(0.56532555,0.82486788,-0.82486788,0.56532555,327.54691,-80.416181)"
+       id="g4097-0-2">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-2-3"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-5-5"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+    <g
+       transform="matrix(-0.56532555,0.82486788,0.82486788,0.56532555,242.10224,-81.191343)"
+       id="g4097-0-3">
+      <path
+         d="m 210,177.36218 c 15,10 30,10 45,0"
+         id="path3809-2-7"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+      <path
+         d="m 255.84443,171.31278 c -15,-10 -30,-10 -45,0"
+         id="path3809-5-5-9"
+         style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;marker-end:url(#Arrow2Mend)" />
+    </g>
+  </g>
+</svg>
+<p>
+  <br/><br/>
+  Des processus <span style="color:blue;">clients</span> communiquent
+  avec le <span style="color:orange;">serveur</span> à travers le
+  réseau. Les clients sont indépendant et ne communiquent pas entre
+  eux. <em>Attention</em> plusieurs clients peuvent se trouver su la
+  même machine physique!
+</p>
+</div>
+<div class="sws-slide">
+  <h1>Architecture client-serveur</h1>
+<ul>
+  <li>Le serveur attend des connexions entrantes</li>
+  <li>Les clients peuvent se connecter à tout moment</li>
+  <li>L'application client est généralement légère, envoie une
+  requête au serveur et attend un résultat</li>
+  <li>Le serveur est une application plus lourde qui:
+    <ul><li>effectue des calculs trop coûteux pour le client</li>
+      <li>gère l'accès à une ressource distante partagée<br/>…</li>
+    </ul>
+  </li>
+</ul>
+<p>Exemples: serveur de bases de données, serveur mail, serveur Web,
+  terminal de carte bancaire, …</p>
+</div>
+  </body>
+</html>
diff --git a/prog_internet/prog_internet_04.xhtml b/prog_internet/prog_internet_04.xhtml
new file mode 100644 (file)
index 0000000..beb1272
--- /dev/null
@@ -0,0 +1,544 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
+          >
+<html xmlns="http://www.w3.org/1999/xhtml" >
+  <head>
+    <title>Programmation Internet</title>
+
+    <meta http-equiv="Content-Type"
+          content="text/html; charset=utf-8" />
+    <meta name="copyright"
+          content="Copyright &#169; 2013 Kim Nguyễn" />
+
+    <!-- Load jQuery -->
+    <script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
+    <!-- Load the library -->
+    <script src="../simpleWebSlides.js" type="text/javascript" ></script>
+
+    <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"  media="all" />
+    <!-- Load a custom Theme, the class-element marks this style-sheet
+         a "theme" that can be swtiched dynamicaly -->
+    <link class="sws-theme" rel="stylesheet"  title="U-Psud style"  href="../themes/uPsud.css" type="text/css" />
+
+    <!-- Customize some templates and initialize -->
+
+    <script type="text/javascript">
+      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
+      SWS.Config['sws-object-deactivate'] =  SWS.Effects.objectDeactivateFadeOut;
+      SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
+
+      //Ensures that we load SWS at the very end, after MathJax has
+      //been initialized
+
+      $(window).load(SWS.Presentation.init);
+    </script>
+  </head>
+  <body>
+
+    <div class="sws-slide sws-cover sws-option-nofooter">
+      <h1>Programmation Internet</h1>
+      <h1>Cours 4</h1>
+      <a href="mailto:kn@lri.fr">kn@lri.fr</a><br/>
+      <a href="http://www.lri.fr/~kn/">http://www.lri.fr/~kn</a>
+    </div>
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li> Systèmes d'exploitation &#10004;</li>
+        <li> Réseaux et Internet &#10004; </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="hl">3.1 Internet et ses services</li>
+            <li>3.2 Fonctionnement du Web</li>
+            <li>3.3 Adressage des documents Web</li>
+            <li>3.4 Le protocole HTTP</li>
+            <li>3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Bref historique d'Internet (1/2)</h1>
+      <table class="desc">
+        <tr>
+          <td style="width:6.5em;">1959-1968</td> <td>ARPA
+            (<i>Advanced Research Project Agency</i>) crée un réseau
+            de quelques machines capable de résister à une attaque.</td>
+        </tr>
+        <tr>
+          <td>1969</td> <td>ARPANET. Interconnexion des ordinateurs
+            centraux des grandes universités et institutions
+            américaines. Première utilisation du concept de paquet d'information.</td>
+        </tr>
+        <tr>
+          <td>1970-1982 </td>
+          <td>Interconnexion avec la Norvège et le Royaume-Uni.
+          </td>
+        </tr>
+        <tr>
+          <td>1982</td>
+          <td> Passage au protocole TCP/IP. Naissance de l'Internet actuel.</td>
+        </tr>
+      </table>
+    </div>
+    <div class="sws-slide">
+      <h1> Bref historique d'Internet (2/2)</h1>
+      <table class="desc">
+        <tr>
+          <td style="width:6.7em;">1986</td> <td>« 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.</td>
+        </tr>
+        <tr>
+          <td>1987-1992</td> <td>Apparition des premiers fournisseurs
+            d'accès. Les entreprises se connectent.</td>
+        </tr>
+        <tr>
+          <td>1993-2000 </td>
+          <td>Avènement du Web. Démocratisation du haut-débit (vers
+          2000 pour la France).
+          </td>
+        </tr>
+        <tr>
+          <td>2000-présent</td>
+          <td> Explosion des services en ligne, arrivée des réseaux
+          sociaux, internet mobile, <i>Cloud</i> (stockage et calcul
+          mutualisés accessible depuis internet).</td>
+        </tr>
+      </table>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Internet </h1>
+      <ul>
+        <li> Ensemble de logiciels et protocoles basés sur <em>TCP/IP</em>
+          </li>
+        <li> Modèle Client/Serveur</li>
+        <li> Un serveur fournit un service:
+          <ul>
+            <li>courriel</li>
+            <li>transfert de fichier (ftp)</li>
+            <li>connexion à distance (ssh)</li>
+            <li>Web (http)</li>
+          </ul>
+          </li>
+        <li> Plusieurs services peuvent être actifs sur la même
+        machine (serveur). Un <em>port (identifiant numérique)</em>
+        est associé à chaque service. Sur Internet, un service est
+        identifié par:
+          <ul>
+            <li>L'adresse IP de la machine sur lequel il fonctionne</li>
+            <li>Le numéro de port sur lequel le programme attend les
+            connexions</li>
+          </ul>
+        </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1> Exemples de services </h1>
+      <table class="simple" style="width:100%">
+        <tr><th  style="width:10%">Service</th>
+          <th style="width:40%">Protocole</th>
+          <th  style="width:5%">Port</th>
+          <th style="width:45%;">Description</th>
+        </tr>
+        <tr>
+          <td>ftp</td> <td >File Transfer Protocol</td> <td>
+          20,21 </td> <td>Transfert de fichiers</td> </tr>
+        <tr> <td>telnet</td> <td>Network Virtual
+        Terminal</td> <td>23</td> <td>Shell à distance</td></tr>
+        <tr> <td>ssh</td> <td>Secure Shell</td> <td>22</td><td>Shell à
+        distance crypté</td></tr>
+        <tr> <td>mail</td><td>Simple Mail Transfer
+        Protocol</td> <td>25</td> <td>Envoi de mail</td></tr>
+        <tr><td>pop</td> <td>Post Office
+        Protocol</td> <td>110</td><td>Récupération de mail</td></tr>
+        <tr><td>imap</td> <td>Internet Message Access
+        Protocol</td> <td>143</td><td>Synchronisation de mails</td></tr>
+        <tr><td>nslookup</td> <td>Domain Name
+        System</td> <td>42</td> <td>Serveur de noms</td></tr>
+        <tr ><td><em>http</em></td> <td>Hyper Text Transfer Protocole</td><td>80</td><td>Web</td></tr>
+
+      </table>
+    </div>
+    <div class="sws-slide">
+      <h1> World Wide Web (1/2)</h1>
+      <ul>
+        <li>Service de distribution de page <em>hypertexte</em></li>
+        <li>Une page <em>hypertexte</em> contient des références
+          immédiatement accessibles à d'autres pages (pointeurs
+          ou <em>liens hypertextes</em>)</li>
+        <li>Les pages sont décrites dans le
+          langage <em>HTML</em> (HyperText Markup Language) </li>
+        <li>Architecture client/serveur:
+          <ul>
+            <li>Les pages sont stockées sur le serveur</li>
+            <li>Les pages sont envoyées au client (navigateur Web) qui
+              en assure le rendu</li>
+          </ul>
+        </li>
+        <li>Utilise le protocole <em>HTTP</em> pour les échanges entre
+          le client et le serveur</li>
+      </ul>
+    </div>
+
+    <div class="sws-slide">
+      <h1> World Wide Web (2/2)</h1>
+      <p>Concepts clé:</p>
+      <table class="desc">
+        <tr><td>URL</td> <td>localisation d'une page Web (« adresse de
+        la page »)</td> </tr>
+        <tr><td>HTTP</td> <td>protocole de communication entre un
+        client et un serveur Web</td> </tr>
+        <tr><td>HTML</td> <td>langage de description des pages
+        Web</td> </tr>
+      </table>
+      <p>Évolutions récentes (Web 2.0, internet mobile, <i>Cloud</i>, …)</p>
+      <ul>
+        <li>Standardisation du contenu multimédia (images, vidéos et
+        sons en <i>streaming</i>)</li>
+        <li>Contenu interactif avancé (stockage de fichier coté
+        client, rendu 3D, …)</li>
+        <li>Uniformisation de nombreuses extensions <i>ad-hoc</i>: HTML5</li>
+      </ul>
+    </div>
+
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li class="done" > Systèmes d'exploitation</li>
+        <li class="done" > Réseaux et Internet </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="done">3.1 Internet et ses services</li>
+            <li class="hl" >3.2 Fonctionnement du Web</li>
+            <li class="">3.3 Adressage des documents Web </li>
+            <li>3.4 Le protocole HTTP</li>
+            <li>3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Fonctionnement du Web</h1>
+      <div style="text-align:center;">
+        <img style="width:90%;height:50%;" src="cours_4.svg"
+        type="image/svg+xml" />
+      </div>
+
+    </div>
+
+    <div class="sws-slide">
+      <h1>Côté client</h1>
+      <p>Le navigateur :</p>
+      <ul>
+        <li>Analyse l'URL demandée</li>
+        <li>Obtient l'adresse IP auprès du serveur DNS</li>
+        <li>Établit une connexion (potentiellement sécurisée) avec le serveur</li>
+        <li>Envoie une <em>requête HTTP</em> au serveur</li>
+        <li>Récupère la page envoyée par le serveur dans
+        sa <em>réponse</em></li>
+        <li>Analyse la page et récupère les éléments référencés :
+        images, sons, …</li>
+        <li>Effectue le traitement du code client</li>
+        <li>Met en forme le contenu et l'affiche dans la fenêtre</li>
+      </ul>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Côté serveur</h1>
+      <ul>
+        <li>Un <i>listener</i> (<i>thread</i> particulier) attend les
+        connexions sur un port par défaut (80 dans le cas de HTTP)</li>
+        <li>À chaque nouvelle connexion, le <i>listener</i> crée
+        un <i>thread</i> de traitement et se remet en attente
+        </li>
+        <li>Le <i>thread</i> de traitement vérifie la validité de la
+        requête :
+          <ul>
+            <li>le document demandé existe ?
+              </li>
+            <li>le client est autorisé à accéder au document ?
+              </li>
+            <li>…</li>
+          </ul>
+        </li>
+        <li>Le <i>thread</i> de traitement répond à la requête :
+          <ul>
+            <li>Exécution de code côté serveur, récupération de
+            données dans une BD, …
+              </li>
+            <li>Envoi de la page au client
+              </li>
+          </ul>
+        </li>
+      </ul>
+    </div>
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li class="done" > Systèmes d'exploitation</li>
+        <li class="done" > Réseaux et Internet </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="done">3.1 Internet et ses services</li>
+            <li class="done" >3.2 Fonctionnement du Web</li>
+            <li class="hl">3.3 Adressage des documents Web </li>
+            <li>3.4 Le protocole HTTP</li>
+            <li>3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+    <div class="sws-slide">
+      <h1>Adressage des documents Web (1/3)</h1>
+      <table class="desc">
+        <tr><td>URL</td><td> <i>Uniform Resource Locator</i>
+        identifie un document sur internet</td></tr>
+      </table>
+      <p>Une URL se décompose en 3 partie</p>
+      <ul><li><em>protocole</em> (comment ?)</li>
+        <li><span style="color:orange;">adresse</span> (où ?)</li>
+        <li><span style="color:blue;">document</span> (quoi ?)</li>
+      </ul>
+      <p>Syntaxe (simplifiée) :</p>
+      <code>            <em>protocole</em>://<span style="color:orange">adresse</span>/<span style="color:blue;">document</span></code>
+      <p>Exemple :</p>
+      <code>            <em>http</em>://<span style="color:orange">www.lri.fr</span>/<span style="color:blue;">~kn/teach_fr.html</span></code>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Adressage des documents Web (2/3)</h1>
+      <p>On peut aussi préciser <span style="color:purple;">un numéro
+      de port</span>, des <span style="color:black;">paramètres</span>
+      et un <span style="color:red;">emplacement</span> :
+      </p>
+      <code>            <em>protocole</em>://<span style="color:orange">adresse</span>:<span style="color:purple">port</span>/<span style="color:blue;">document</span>?<span style="color:black;">p1=v1</span>&amp;<span style="color:black;">p2=v2</span>#<span style="color:red">empl</span></code>
+      <p class="sws-pause" >Exemple :</p>
+      <code>    <a style="color:gray" href="http://www.youtube.com:80/results?search_query=tbbt#search-results"><em>http</em>://<span style="color:orange">www.youtube.com</span>:<span style="color:purple">80</span>/<span style="color:blue;">results</span>?<span style="color:black;">search_query=tbbt</span>#<span style="color:red">search-results</span></a></code>
+      <p>Le serveur utilise les paramètres passés par le client dans
+      l'URL pour <i>calculer</i> le contenu de la page (changer la
+      chaîne « <code>tbbt</code> » ci-dessus et essayer)</p>
+    </div>
+    <div class="sws-slide">
+      <h1>Adressage des documents Web (3/3)</h1>
+      <p>
+        La <em>racine</em> d'un site Web
+        (ex: <em><code>http://www.lri.fr/</code></em>) correspond
+        à un répertoire sur le disque du serveur
+        (ex: <em><code>/var/www</code></em>). Le fichier</p>
+      <code>      http://www.lri.fr/index.html</code>
+      <p>se trouve à l'emplacement</p>
+      <code>      /var/www/index.html</code>
+      <p>Le serveur Web peut aussi effectuer des <em>réécritures
+      d'adresses</em> :</p>
+      <code>      http://www.lri.fr/~kn/index.html</code>
+      <p>devient</p>
+      <code>      /home/kn/public_html/index.html</code>
+    </div>
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li class="done" > Systèmes d'exploitation</li>
+        <li class="done" > Réseaux et Internet </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="done">3.1 Internet et ses services</li>
+            <li class="done" >3.2 Fonctionnement du Web</li>
+            <li class="done">3.3 Adressage des documents Web </li>
+            <li class="hl">3.4 Le protocole HTTP</li>
+            <li>3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+    <div class="sws-slide">
+      <h1>Caractéristiques du protocole HTTP</h1>
+      <ul>
+        <li>Sans connexion permanente:
+          <ul>
+            <li>Le client se connecte au serveur, envoie sa requête,
+            se déconnecte</li>
+            <li>Le serveur se connecte au client, envoie sa réponse,
+              se déconnecte</li>
+          </ul>
+        </li>
+        <li>Indépendant du contenu : permet d'envoyer des documents
+        (hyper) texte, du son, des images, …</li>
+        <li>Sans <em>état</em>: chaque paire requête/réponse est
+        indépendante (le serveur ne maintient pas d'information sur le
+          client entre les requêtes)</li>
+        <li>Protocole en mode <em>texte</em></li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Format des messages HTTP</h1>
+      <p>Les messages ont la forme suivante</p>
+      <ul><li>Ligne initiale CR LF</li>
+        <li>zéro ou plusieurs lignes d'option CR LF</li>
+        <li>CR LF</li>
+        <li>Corp du message (document envoyé, paramètres de la
+        requête, …)</li>
+      </ul>
+      <ul><li><em>Requête</em> la première ligne contient un nom
+      de <em>méthode</em> (GET, POST, HEAD, …), le paramètre de la
+      méthode et la version du protocole</li>
+        <li><em>Réponse</em> la version du protocole, le code de la
+        réponse (200, 404, 403, …) et un message informatif
+        </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Démo</h1>
+    </div>
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li class="done" > Systèmes d'exploitation</li>
+        <li class="done" > Réseaux et Internet </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="done">3.1 Internet et ses services</li>
+            <li class="done" >3.2 Fonctionnement du Web</li>
+            <li class="done">3.3 Adressage des documents Web </li>
+            <li class="done">3.4 Le protocole HTTP</li>
+            <li class="hl">3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+    <div class="sws-slide">
+      <h1>HTML</h1>
+      <p>
+        <em>HyperText Markup Language</em> : langage de mise en forme
+        de documents hypertextes (texte + liens vers d'autres
+        documents). Développé au CERN en 1989.<br/>
+        <em>1991</em> : premier navigateur en mode texte<br/>
+        <em>1993</em> : premier navigateur graphique (mosaic)
+        développé au NCSA (National Center for Supercomputing
+        Applications)
+      </p>
+    </div>
+    <div class="sws-slide">
+      <h1>Document HTML</h1>
+      <ul><li> est un document <em>semi-structuré</em></li>
+        <li> dont la structure est donnée par
+        des <em>balises</em></li>
+      </ul>
+      <div>
+      <table class="btable simple" style="width:90%;margin-left:5%">
+        <thead>
+          <tr><th style="width:65%;">Exemple</th> <th>Rendu par défaut</th></tr>
+        </thead>
+        <tr><td ><tt><![CDATA[Un texte <b>en gras</b> ]]></tt></td><td>Un
+        texte <b>en gras</b></td></tr>
+        <tr><td ><code><![CDATA[<a href="http://www.u-psud.fr">Un lien</a> ]]></code></td> 
+          <td><a style="color:blue;text-decoration:underline;"
+        href="http://www.u-psud.fr">Un lien</a></td></tr>
+        <tr><td><code><![CDATA[<ul>
+  <li>Premièrement</li>
+  <li>Deuxièmement</li>
+</ul> ]]></code></td> <td><ul>
+<li>Premièrement</li>
+<li>Deuxièmement</li>
+</ul>
+</td></tr>
+      </table>
+      </div>
+<p>On dit que <em><tt><![CDATA[<toto>]]></tt></em> est une balise <em>
+    ouvrante</em> et <em><tt><![CDATA[</toto>]]></tt></em> une
+    balise <em>fermante</em>. On peut
+    écrire <em><tt><![CDATA[<toto/>]]></tt></em> comme raccourci pour
+    <tt><![CDATA[<toto></toto>]]></tt>.
+</p>
+    </div>
+    <div class="sws-slide">
+      <h1>Historique du langage HTML</h1>
+<table class="desc">
+  <tr><td style="width:3em;">1973</td> <td>GML, Generalised Markup Language développé chez
+IBM. Introduction de la notion de balise.</td></tr>
+<tr><td>1980</td><td> SGML, Standardised GML, adopté par l'ISO</td></tr>
+<tr><td>1989</td><td> HTML, basé sur SGML. Plusieurs entreprises (microsoft,
+netscape, ... ) interprètent le standard de manière
+différente</td></tr>
+<tr><td>1996</td> <td>XML, eXtensible Markup Language norme pour les
+documents semi-structurés (SGML simplifié)</td></tr>
+<tr><td>2000</td><td> XHTML, version de HTML suivant les conventions
+    XML</td></tr>
+<tr><td>2008</td><td> Première proposition pour le nouveau standard,
+    HTML5</td></tr>
+<tr><td>2014</td><td>Standardisation de HTML5</td></tr>
+</table>
+    </div>
+
+    <div class="sws-slide">
+      <h1>XHTML <i>vs</i> HTML</h1>
+      <p>On utilise XHTML dans le cours. Différences avec HTML:</p>
+      <ul>
+        <li>
+          Les balises sont <em>bien parenthésées</em>
+          (<tt><![CDATA[<a> <c> </c> ]]> <span style="color:red">&lt;/b&gt;</span></tt> est interdit)
+        </li>
+        <li>Les balises sont en minuscules</li>
+      </ul>
+      <p>Les avantages sont les suivants</p>
+      <ul><li>HTML autorise les mélanges majuscule/minuscule, de ne
+      pas fermer certaines balise … Les navigateurs corrigent ces
+      erreurs de manières <em>différentes</em></li>
+        <li>Le document est <em>structuré</em> comme un programme
+        informatique (les balises ouvrantes/fermantes correspondent à
+        { et }). Plus simple à débugger.</li>
+      </ul>
+    </div>
+<div class="sws-slide">
+  <h1>Rôle d'(X)HTML</h1>
+  <p>Séparer la <em>structure</em> du document de
+  son <em>rendu</em>. La structure donne une <em>sémantique</em> au
+  document :</p>
+  <ul>
+    <li>ceci est un titre</li>
+    <li>ceci est un paragraphe</li>
+    <li>ceci est un ensemble de caractères importants</li>
+  </ul>
+  <p>Cela permet au navigateur d'assurer un rendu en fonction de la
+  sémantique. Il existe différents types de rendus:</p>
+  <ul>
+    <li>graphique interactif (Chrome, Firefox, Internet Explorer,
+    …)</li>
+    <li>texte interactif (Lynx, navigateur en mode texte)</li>
+    <li>graphique statique (par ex: sur livre électronique)</li>
+    <li>rendu sur papier</li>
+    <li>graphique pour petit écran (terminal mobile)</li>
+  </ul>
+</div>
+<div class="sws-slide">
+  <h1>Exemple de document</h1>
+  <p style="text-align:center;font-size:smaller;">(liste des balises
+  données sur la feuille de TD 4!)</p>
+<div style="margin-left:10%;">
+<code style="font-size:smaller;"><![CDATA[  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
+    <head>
+      <title>Un titre</title>
+      <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+    </head>
+    <body>
+      <h1>Titre de section</h1>
+      <p> premier paragraphe de texte. On met
+      un <a href="http://www.lri.fr">lien</a> ici.
+      </p>
+      <!-- on peut aussi mettre des commentaires -->
+    </body>
+  </html>]]></code>
+</div>
+</div>
+  </body>
+</html>
diff --git a/prog_internet/prog_internet_05.xhtml b/prog_internet/prog_internet_05.xhtml
new file mode 100644 (file)
index 0000000..91d1ff4
--- /dev/null
@@ -0,0 +1,531 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
+          >
+<html xmlns="http://www.w3.org/1999/xhtml" >
+  <head>
+    <title>Programmation Internet</title>
+
+    <meta http-equiv="Content-Type"
+          content="text/html; charset=utf-8" />
+    <meta name="copyright"
+          content="Copyright &#169; 2013 Kim Nguyễn" />
+
+    <!-- Load jQuery -->
+    <script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
+    <!-- Load the library -->
+    <script src="../simpleWebSlides.js" type="text/javascript" ></script>
+
+    <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"  media="all" />
+    <!-- Load a custom Theme, the class-element marks this style-sheet
+         a "theme" that can be swtiched dynamicaly -->
+    <link class="sws-theme" rel="stylesheet"  title="U-Psud style"  href="../themes/uPsud.css" type="text/css" />
+
+    <!-- Customize some templates and initialize -->
+
+    <script type="text/javascript">
+      SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
+      SWS.Config['sws-object-deactivate'] =  SWS.Effects.objectDeactivateFadeOut;
+      SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
+
+      //Ensures that we load SWS at the very end, after MathJax has
+      //been initialized
+
+      $(window).load(SWS.Presentation.init);
+    </script>
+  </head>
+  <body>
+
+    <div class="sws-slide sws-cover sws-option-nofooter">
+      <h1>Programmation Internet</h1>
+      <h1>Cours 5</h1>
+      <a href="mailto:kn@lri.fr">kn@lri.fr</a><br/>
+      <a href="http://www.lri.fr/~kn/">http://www.lri.fr/~kn</a>
+    </div>
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <div>
+      <ol >
+        <li class="done"> Systèmes d'exploitation</li>
+        <li class="done"> Réseaux et Internet</li>
+        <li class="done"> Le Web </li>
+        <li > CSS
+          <ul class="empty">
+            <li class="hl">4.1 Introduction</li>
+            <li>4.2 Boîtes</li>
+            <li>4.3 Selecteurs</li>
+          </ul>
+        </li>
+      </ol>
+      </div>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Cascading Style Sheets (CSS)</h1>
+      <table class="desc">
+        <tr>
+          <td >CSS</td> <td>
+            Langage permettant de décrire le <em>style graphique</em>
+            d'une page HTML
+          </td>
+        </tr>
+      </table>
+      <p>On peut appliquer un style CSS</p>
+      <ul>
+        <li> À un élément en
+        utilisant <em>l'attribut <code>style</code></em></li>
+        <li> À une page en utilisant
+        l'élément <em><code><![CDATA[ <style>...</style> ]]></code></em>
+                                                          dans l'en-tête
+        du document (dans la
+        balise <code><![CDATA[<head>...</head>]]></code>).
+                                                 </li>
+        <li>À un ensemble de pages en référençant un fichier de style
+        dans chacune des pages
+        </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1> L'attribut <tt>style</tt></h1>
+      <code> <![CDATA[ <a href="http://www.u-psud.fr" style="color:red">Un lien</a>]]>
+      </code>
+      <p>Apperçu:      </p>
+      <p style="width:80%; margin-left:5%; border-style:solid;border-width:1pt;border-color:gray;">
+       <a href="http://www.u-psud.fr" style="color:red;text-decoration:underline;">Un lien</a>
+      </p>
+      <p class="sws-pause">Inconvénient: il faut copier l'attribut
+      style pour tous les liens de la page.
+      </p>
+    </div>
+
+    <div class="sws-slide">
+      <h1> Internet </h1>
+      <ul>
+        <li> Ensemble de logiciels et protocoles basés sur <em>TCP/IP</em>
+          </li>
+        <li> Modèle Client/Serveur</li>
+        <li> Un serveur fournit un service:
+          <ul>
+            <li>courriel</li>
+            <li>transfert de fichier (ftp)</li>
+            <li>connexion à distance (ssh)</li>
+            <li>Web (http)</li>
+          </ul>
+          </li>
+        <li> Plusieurs services peuvent être actifs sur la même
+        machine (serveur). Un <em>port (identifiant numérique)</em>
+        est associé à chaque service. Sur Internet, un service est
+        identifié par:
+          <ul>
+            <li>L'adresse IP de la machine sur lequel il fonctionne</li>
+            <li>Le numéro de port sur lequel le programme attend les
+            connexions</li>
+          </ul>
+        </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1> Exemples de services </h1>
+      <table class="simple" style="width:100%">
+        <tr><th  style="width:10%">Service</th>
+          <th style="width:40%">Protocole</th>
+          <th  style="width:5%">Port</th>
+          <th style="width:45%;">Description</th>
+        </tr>
+        <tr>
+          <td>ftp</td> <td >File Transfer Protocol</td> <td>
+          20,21 </td> <td>Transfert de fichiers</td> </tr>
+        <tr> <td>telnet</td> <td>Network Virtual
+        Terminal</td> <td>23</td> <td>Shell à distance</td></tr>
+        <tr> <td>ssh</td> <td>Secure Shell</td> <td>22</td><td>Shell à
+        distance crypté</td></tr>
+        <tr> <td>mail</td><td>Simple Mail Transfer
+        Protocol</td> <td>25</td> <td>Envoi de mail</td></tr>
+        <tr><td>pop</td> <td>Post Office
+        Protocol</td> <td>110</td><td>Récupération de mail</td></tr>
+        <tr><td>imap</td> <td>Internet Message Access
+        Protocol</td> <td>143</td><td>Synchronisation de mails</td></tr>
+        <tr><td>nslookup</td> <td>Domain Name
+        System</td> <td>42</td> <td>Serveur de noms</td></tr>
+        <tr ><td><em>http</em></td> <td>Hyper Text Transfer Protocole</td><td>80</td><td>Web</td></tr>
+
+      </table>
+    </div>
+    <div class="sws-slide">
+      <h1> World Wide Web (1/2)</h1>
+      <ul>
+        <li>Service de distribution de page <em>hypertexte</em></li>
+        <li>Une page <em>hypertexte</em> contient des références
+          immédiatement accessibles à d'autres pages (pointeurs
+          ou <em>liens hypertextes</em>)</li>
+        <li>Les pages sont décrites dans le
+          langage <em>HTML</em> (HyperText Markup Language) </li>
+        <li>Architecture client/serveur:
+          <ul>
+            <li>Les pages sont stockées sur le serveur</li>
+            <li>Les pages sont envoyées au client (navigateur Web) qui
+              en assure le rendu</li>
+          </ul>
+        </li>
+        <li>Utilise le protocole <em>HTTP</em> pour les échanges entre
+          le client et le serveur</li>
+      </ul>
+    </div>
+
+    <div class="sws-slide">
+      <h1> World Wide Web (2/2)</h1>
+      <p>Concepts clé:</p>
+      <table class="desc">
+        <tr><td>URL</td> <td>localisation d'une page Web (« adresse de
+        la page »)</td> </tr>
+        <tr><td>HTTP</td> <td>protocole de communication entre un
+        client et un serveur Web</td> </tr>
+        <tr><td>HTML</td> <td>langage de description des pages
+        Web</td> </tr>
+      </table>
+      <p>Évolutions récentes (Web 2.0, internet mobile, <i>Cloud</i>, …)</p>
+      <ul>
+        <li>Standardisation du contenu multimédia (images, vidéos et
+        sons en <i>streaming</i>)</li>
+        <li>Contenu interactif avancé (stockage de fichier coté
+        client, rendu 3D, …)</li>
+        <li>Uniformisation de nombreuses extensions <i>ad-hoc</i>: HTML5</li>
+      </ul>
+    </div>
+
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li class="done" > Systèmes d'exploitation</li>
+        <li class="done" > Réseaux et Internet </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="done">3.1 Internet et ses services</li>
+            <li class="hl" >3.2 Fonctionnement du Web</li>
+            <li class="">3.3 Adressage des documents Web </li>
+            <li>3.4 Le protocole HTTP</li>
+            <li>3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Fonctionnement du Web</h1>
+      <div style="text-align:center;">
+        <img style="width:90%;height:50%;" src="cours_4.svg"
+        type="image/svg+xml" />
+      </div>
+
+    </div>
+
+    <div class="sws-slide">
+      <h1>Côté client</h1>
+      <p>Le navigateur :</p>
+      <ul>
+        <li>Analyse l'URL demandée</li>
+        <li>Obtient l'adresse IP auprès du serveur DNS</li>
+        <li>Établit une connexion (potentiellement sécurisée) avec le serveur</li>
+        <li>Envoie une <em>requête HTTP</em> au serveur</li>
+        <li>Récupère la page envoyée par le serveur dans
+        sa <em>réponse</em></li>
+        <li>Analyse la page et récupère les éléments référencés :
+        images, sons, …</li>
+        <li>Effectue le traitement du code client</li>
+        <li>Met en forme le contenu et l'affiche dans la fenêtre</li>
+      </ul>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Côté serveur</h1>
+      <ul>
+        <li>Un <i>listener</i> (<i>thread</i> particulier) attend les
+        connexions sur un port par défaut (80 dans le cas de HTTP)</li>
+        <li>À chaque nouvelle connexion, le <i>listener</i> crée
+        un <i>thread</i> de traitement et se remet en attente
+        </li>
+        <li>Le <i>thread</i> de traitement vérifie la validité de la
+        requête :
+          <ul>
+            <li>le document demandé existe ?
+              </li>
+            <li>le client est autorisé à accéder au document ?
+              </li>
+            <li>…</li>
+          </ul>
+        </li>
+        <li>Le <i>thread</i> de traitement répond à la requête :
+          <ul>
+            <li>Exécution de code côté serveur, récupération de
+            données dans une BD, …
+              </li>
+            <li>Envoi de la page au client
+              </li>
+          </ul>
+        </li>
+      </ul>
+    </div>
+
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li class="done" > Systèmes d'exploitation</li>
+        <li class="done" > Réseaux et Internet </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="done">3.1 Internet et ses services</li>
+            <li class="done" >3.2 Fonctionnement du Web</li>
+            <li class="hl">3.3 Adressage des documents Web </li>
+            <li>3.4 Le protocole HTTP</li>
+            <li>3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+    <div class="sws-slide">
+      <h1>Adressage des documents Web (1/3)</h1>
+      <table class="desc">
+        <tr><td>URL</td><td> <i>Uniform Resource Locator</i>
+        identifie un document sur internet</td></tr>
+      </table>
+      <p>Une URL se décompose en 3 partie</p>
+      <ul><li><em>protocole</em> (comment ?)</li>
+        <li><span style="color:orange;">adresse</span> (où ?)</li>
+        <li><span style="color:blue;">document</span> (quoi ?)</li>
+      </ul>
+      <p>Syntaxe (simplifiée) :</p>
+      <code>            <em>protocole</em>://<span style="color:orange">adresse</span>/<span style="color:blue;">document</span></code>
+      <p>Exemple :</p>
+      <code>            <em>http</em>://<span style="color:orange">www.lri.fr</span>/<span style="color:blue;">~kn/teach_fr.html</span></code>
+    </div>
+
+    <div class="sws-slide">
+      <h1>Adressage des documents Web (2/3)</h1>
+      <p>On peut aussi préciser <span style="color:purple;">un numéro
+      de port</span>, des <span style="color:black;">paramètres</span>
+      et un <span style="color:red;">emplacement</span> :
+      </p>
+      <code>            <em>protocole</em>://<span style="color:orange">adresse</span>:<span style="color:purple">port</span>/<span style="color:blue;">document</span>?<span style="color:black;">p1=v1</span>&amp;<span style="color:black;">p2=v2</span>#<span style="color:red">empl</span></code>
+      <p class="sws-pause" >Exemple :</p>
+      <code>    <a style="color:gray" href="http://www.youtube.com:80/results?search_query=tbbt#search-results"><em>http</em>://<span style="color:orange">www.youtube.com</span>:<span style="color:purple">80</span>/<span style="color:blue;">results</span>?<span style="color:black;">search_query=tbbt</span>#<span style="color:red">search-results</span></a></code>
+      <p>Le serveur utilise les paramètres passés par le client dans
+      l'URL pour <i>calculer</i> le contenu de la page (changer la
+      chaîne « <code>tbbt</code> » ci-dessus et essayer)</p>
+    </div>
+    <div class="sws-slide">
+      <h1>Adressage des documents Web (3/3)</h1>
+      <p>
+        La <em>racine</em> d'un site Web
+        (ex: <em><code>http://www.lri.fr/</code></em>) correspond
+        à un répertoire sur le disque du serveur
+        (ex: <em><code>/var/www</code></em>). Le fichier</p>
+      <code>      http://www.lri.fr/index.html</code>
+      <p>se trouve à l'emplacement</p>
+      <code>      /var/www/index.html</code>
+      <p>Le serveur Web peut aussi effectuer des <em>réécritures
+      d'adresses</em> :</p>
+      <code>      http://www.lri.fr/~kn/index.html</code>
+      <p>devient</p>
+      <code>      /home/kn/public_html/index.html</code>
+    </div>
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li class="done" > Systèmes d'exploitation</li>
+        <li class="done" > Réseaux et Internet </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="done">3.1 Internet et ses services</li>
+            <li class="done" >3.2 Fonctionnement du Web</li>
+            <li class="done">3.3 Adressage des documents Web </li>
+            <li class="hl">3.4 Le protocole HTTP</li>
+            <li>3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+    <div class="sws-slide">
+      <h1>Caractéristiques du protocole HTTP</h1>
+      <ul>
+        <li>Sans connexion permanente:
+          <ul>
+            <li>Le client se connecte au serveur, envoie sa requête,
+            se déconnecte</li>
+            <li>Le serveur se connecte au client, envoie sa réponse,
+              se déconnecte</li>
+          </ul>
+        </li>
+        <li>Indépendant du contenu : permet d'envoyer des documents
+        (hyper) texte, du son, des images, …</li>
+        <li>Sans <em>état</em>: chaque paire requête/réponse est
+        indépendante (le serveur ne maintient pas d'information sur le
+          client entre les requêtes)</li>
+        <li>Protocole en mode <em>texte</em></li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Format des messages HTTP</h1>
+      <p>Les messages ont la forme suivante</p>
+      <ul><li>Ligne initiale CR LF</li>
+        <li>zéro ou plusieurs lignes d'option CR LF</li>
+        <li>CR LF</li>
+        <li>Corp du message (document envoyé, paramètres de la
+        requête, …)</li>
+      </ul>
+      <ul><li><em>Requête</em> la première ligne contient un nom
+      de <em>méthode</em> (GET, POST, HEAD, …), le paramètre de la
+      méthode et la version du protocole</li>
+        <li><em>Réponse</em> la version du protocole, le code de la
+        réponse (200, 404, 403, …) et un message informatif
+        </li>
+      </ul>
+    </div>
+    <div class="sws-slide">
+      <h1>Démo</h1>
+    </div>
+    <div class="sws-slide" >
+      <h1> Plan </h1>
+      <ol >
+        <li class="done" > Systèmes d'exploitation</li>
+        <li class="done" > Réseaux et Internet </li>
+        <li> Le Web
+          <ul class="empty">
+            <li class="done">3.1 Internet et ses services</li>
+            <li class="done" >3.2 Fonctionnement du Web</li>
+            <li class="done">3.3 Adressage des documents Web </li>
+            <li class="done">3.4 Le protocole HTTP</li>
+            <li class="hl">3.5 HTML, le format des documents</li>
+          </ul>
+        </li>
+      </ol>
+    </div>
+    <div class="sws-slide">
+      <h1>HTML</h1>
+      <p>
+        <em>HyperText Markup Language</em> : langage de mise en forme
+        de documents hypertextes (texte + liens vers d'autres
+        documents). Développé au CERN en 1989.<br/>
+        <em>1991</em> : premier navigateur en mode texte<br/>
+        <em>1993</em> : premier navigateur graphique (mosaic)
+        développé au NCSA (National Center for Supercomputing
+        Applications)
+      </p>
+    </div>
+    <div class="sws-slide">
+      <h1>Document HTML</h1>
+      <ul><li> est un document <em>semi-structuré</em></li>
+        <li> dont la structure est donnée par
+        des <em>balises</em></li>
+      </ul>
+      <div>
+      <table class="btable simple" style="width:90%;margin-left:5%">
+        <thead>
+          <tr><th style="width:65%;">Exemple</th> <th>Rendu par défaut</th></tr>
+        </thead>
+        <tr><td ><tt><![CDATA[Un texte <b>en gras</b> ]]></tt></td><td>Un
+        texte <b>en gras</b></td></tr>
+        <tr><td ><code><![CDATA[<a href="http://www.u-psud.fr">Un lien</a> ]]></code></td> 
+          <td><a style="color:blue;text-decoration:underline;"
+        href="http://www.u-psud.fr">Un lien</a></td></tr>
+        <tr><td><code><![CDATA[<ul>
+  <li>Premièrement</li>
+  <li>Deuxièmement</li>
+</ul> ]]></code></td> <td><ul>
+<li>Premièrement</li>
+<li>Deuxièmement</li>
+</ul>
+</td></tr>
+      </table>
+      </div>
+<p>On dit que <em><tt><![CDATA[<toto>]]></tt></em> est une balise <em>
+    ouvrante</em> et <em><tt><![CDATA[</toto>]]></tt></em> une
+    balise <em>fermante</em>. On peut
+    écrire <em><tt><![CDATA[<toto/>]]></tt></em> comme raccourci pour
+    <tt><![CDATA[<toto></toto>]]></tt>.
+</p>
+    </div>
+    <div class="sws-slide">
+      <h1>Historique du langage HTML</h1>
+<table class="desc">
+  <tr><td style="width:3em;">1973</td> <td>GML, Generalised Markup Language développé chez
+IBM. Introduction de la notion de balise.</td></tr>
+<tr><td>1980</td><td> SGML, Standardised GML, adopté par l'ISO</td></tr>
+<tr><td>1989</td><td> HTML, basé sur SGML. Plusieurs entreprises (microsoft,
+netscape, ... ) interprètent le standard de manière
+différente</td></tr>
+<tr><td>1996</td> <td>XML, eXtensible Markup Language norme pour les
+documents semi-structurés (SGML simplifié)</td></tr>
+<tr><td>2000</td><td> XHTML, version de HTML suivant les conventions
+    XML</td></tr>
+<tr><td>2008</td><td> Première proposition pour le nouveau standard,
+    HTML5</td></tr>
+<tr><td>2014</td><td>Standardisation de HTML5</td></tr>
+</table>
+    </div>
+
+    <div class="sws-slide">
+      <h1>XHTML <i>vs</i> HTML</h1>
+      <p>On utilise XHTML dans le cours. Différences avec HTML:</p>
+      <ul>
+        <li>
+          Les balises sont <em>bien parenthésées</em>
+          (<tt><![CDATA[<a> <c> </c> ]]> <span style="color:red">&lt;/b&gt;</span></tt> est interdit)
+        </li>
+        <li>Les balises sont en minuscules</li>
+      </ul>
+      <p>Les avantages sont les suivants</p>
+      <ul><li>HTML autorise les mélanges majuscule/minuscule, de ne
+      pas fermer certaines balise … Les navigateurs corrigent ces
+      erreurs de manières <em>différentes</em></li>
+        <li>Le document est <em>structuré</em> comme un programme
+        informatique (les balises ouvrantes/fermantes correspondent à
+        { et }). Plus simple à débugger.</li>
+      </ul>
+    </div>
+<div class="sws-slide">
+  <h1>Rôle d'(X)HTML</h1>
+  <p>Séparer la <em>structure</em> du document de
+  son <em>rendu</em>. La structure donne une <em>sémantique</em> au
+  document :</p>
+  <ul>
+    <li>ceci est un titre</li>
+    <li>ceci est un paragraphe</li>
+    <li>ceci est un ensemble de caractères importants</li>
+  </ul>
+  <p>Cela permet au navigateur d'assurer un rendu en fonction de la
+  sémantique. Il existe différents types de rendus:</p>
+  <ul>
+    <li>graphique interactif (Chrome, Firefox, Internet Explorer,
+    …)</li>
+    <li>texte interactif (Lynx, navigateur en mode texte)</li>
+    <li>graphique statique (par ex: sur livre électronique)</li>
+    <li>rendu sur papier</li>
+    <li>graphique pour petit écran (terminal mobile)</li>
+  </ul>
+</div>
+<div class="sws-slide">
+  <h1>Exemple de document</h1>
+  <p style="text-align:center;font-size:smaller;">(liste des balises
+  données sur la feuille de TD 4!)</p>
+<div style="margin-left:10%;">
+<code style="font-size:smaller;"><![CDATA[  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
+    <head>
+      <title>Un titre</title>
+      <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+    </head>
+    <body>
+      <h1>Titre de section</h1>
+      <p> premier paragraphe de texte. On met
+      un <a href="http://www.lri.fr">lien</a> ici.
+      </p>
+      <!-- on peut aussi mettre des commentaires -->
+    </body>
+  </html>]]></code>
+</div>
+</div>
+  </body>
+</html>