add chapter about http with tcp and http server

Sascha Schulz

2024-10-14 7767b80e60c11051fdb858c0004b5a7ae5c8e58f

 index.html

@@ -4310,6 +4310,114 @@
                     </code>
                  </pre>
               </section>
               <section>
                  <h3>TCP-Verbindungen</h3>
               </section>
               <section>
                  <ul>
                     <li>Bidirektionale Verbindung</li>
                     <li>Duplexfähig</li>
                     <li>Besteht immer aus Server- und Client-Socket</li>
                  </ul>
               </section>
               <section>
                  Mit dem nativen Modul <code>net</code> ist es möglich, eine TCP-Verbindung aufzubauen
                  <pre>
                     <code class="js" data-trim data-line-numbers>
                        /* Server */
                        const net = require("net");

                        const server = net.createServer((socket) => {
								
                           // new incoming connection
                           socket.on("data", (data) => {
                              // data is a buffer
                           });
								
                           socket.write("Hello World!");
                        });
								
                        server.listen(3000);
                     </code>
                  </pre>
               </section>
               <section>
                  <pre>
                     <code class="js" data-trim data-line-numbers>
                        /* Client */
                        const net = require("net");

                        const socket = net.connect(3000, () => {
                           // 'connect' listener
                        });
								
                        socket.on("data", (data) => {
                           // data is a buffer
                        });
                     </code>
                  </pre>
               </section>
               <section>
                  <p>Aufgabe</p>
                  <p>Implementiere die Clientlogik in der <code>tcp-client.js</code>, um dem Server ein <code>"Hello Server!"</code> zurück zu senden</p>
               </section>
               <section>
                  <p>Aufgabe</p>
                  <p>Sende eine festgelegte Datei vom Server zum Client. Der Server liest die Datei ein und sendet die Inhalte zum Client, welcher diese wiederum in eine Zieldatei schreibt. Eventuell darf auch noch eine Kompression mittels Zip / Deflate implementiert werden.</p>
               </section>
               <section>
                  <p>Kurze Wiederholung des HTTP-Protokolls</p>
                  <p>Request</p>
                  <pre>
                     <code class="http" data-trim data-line-numbers>
                        GET / HTTP/1.1
                        Host: localhost:3456
                     </code>
                  </pre>
                  <p>Response</p>
                  <pre>
                     <code class="http" data-trim data-line-numbers>
                        HTTP/1.1 200
                        Content-Type: text/plain
                        Content-Length: 12
								
                        Hello World!
                     </code>
                  </pre>
               </section>
               <section>
                  <p>Aufgabe</p>
                  <p>Implementiere mithilfe des TCP-Sockets einen minimalen HTTP-Server, welcher <code>Hello &lt;name></code> als Text zurück gibt, wobei <code>&lt;name></code> aus dem Query-Parameter gelesen werden soll</p>
               </section>
               <section>
                  <h3>HTTP-Server</h3>
               </section>
               <section>
                  <pre>
                     <code class="js" data-trim data-line-numbers>
                        const http = require("http");
						
                        const server = http.createServer((req, res) => {
                           res.writeHeader(200, {
                              "Content-Type": "text/plain", /* Put Content-Type here */
                           });
									
                           console.log(req.rawHeaders);
                           console.log(req.method);
                           console.log(req.url);
									
                           res.write(/* response content */);
                           res.end(); /* important if no Content-Length is specified */
                        });
								
                        server.listen(3456);
                     </code>
                  </pre>
               </section>
               <section>
                  <p>Aufgabe</p>
                  <p>Experimentiert mit verschiedenen Möglichkeiten von <code>Content-Length</code> und dem Vorhandensein von <code>res.end()</code>, mit längerer oder kürzerer <code>Content-Length</code> als der tatsächliche Body oder teilt den Body in zwei <code>res.write()</code> und verzögert künstlich mit einem setTimeout() den zweiten Teil und schaut euch im Browser bei den Entwickler-Tools die Timings der Response an.</p>
               </section>
            </section>
         </div>
      </div>