1 / 60

Inter netzwerke

Inter netzwerke. Datenverkehr (in Exabytes = 1024 6 Bytes). nach Inhalten. nach Geräten. http:// www.cisco.com /c/en/ us / solutions / collateral /service-provider/ ip - ngn - ip - next -generation-network/white_paper_c11-481360.pdf. Okt 2011. Internet = Netz der Netze.

andren
Download Presentation

Inter netzwerke

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Internetzwerke

  2. Datenverkehr (in Exabytes = 10246 Bytes) nach Inhalten nach Geräten http://www.cisco.com/c/en/us/solutions/collateral/service-provider/ip-ngn-ip-next-generation-network/white_paper_c11-481360.pdf

  3. Okt 2011

  4. Internet = Netz der Netze

  5. Adressen im Internet: IPv4 vs. IPv6 • Wer verwaltet IPs? • Wie viele unterschiedliche IPs gibt es? • Wann werden sie uns ausgehen? • Was tun wir dann? http://www.icann.org/ http://www.icann.org/en/factsheets/factsheet-ipv6-03feb11-en.pdf

  6. Netz der Netze - Teilnetze • LAN: Localareanetwork • WLAN: Wireless LAN • MAN: Metropolitanareanetwork • WAN: Wide areanetwork • GAN: Global areanetwork

  7. Netz der Netze – Backbone (GAN/WAN)

  8. Traffic am DE-CIX in Frankfurt (http://www.de-cix.net/about/statistics/) Durchschnitt von ca. 1795 Gigabit pro Sekunde (~38 DVDs), das entspricht einer Datenmengen von rund 3.3 MioDVDs, die pro Tag am Frankfurter Knoten durchfliessen.

  9. Fachbegriffe Internet • Client • Server • Router • Subnetz • Host • Provider • URL • IP • DNS • Protokoll • WWW • OSI

  10. Rollenverteilung • Clients (z.B. Browser) ... stellen Anfragen • Server ... stellen Dienste oder Dokumente zur Verfügung (sind immer online) • Router ... weisen den Informationspaketen ihren Weg (haben mindestens zwei Netzwerkkarten)

  11. Dienstleistungen im Internet <html> <head> ... </head> <body> ... </body> </html> HTML-Dokument wird per FTP auf den Server übertragen (Web) Host, stellt Speicherplatz auf WWW-Server Provider, stellt Zugang zum Internet (Leitung und Adresse/Router) (Web) Host, stellt evtl. weitere Dienste zur Verfügung, z.B. email, PhP, Datenbanken, etc.

  12. Router • Router ... leiten die Informations-pakete von einem Subnetz ins nächste weiter http://www.dnstools.ch/visual-traceroute.html

  13. World Wide Web (WWW) auch W3oder schlicht Webgenannt • Das WWW ist nur einer von vielen Diensten im Internet! • Das World Wide Web ist eine riesige Sammlung von Dokumenten. Diese sind auf Computern auf der ganzen Welt gespeichert und können Querverweise auf andere Dokumente enthalten (Linksoder Hyperlinks). • Für die eindeutige Adressierung eines Dokuments im WWW benötigt man eine URL • Zum Darstellen des Dokuments braucht man einen Browser

  14. Browser • auch WWW-Browseroder Web-Browsergenannt • Ein Browser ist ein Computerprogramm, mit dem man sich im World Wide Web (WWW) bewegen und WWW-Seiten darstellen kann- Ähnlich wie man zum Betrachten von Textdateien ein Textverarbeitungs-programm benötigt. • Internet Explorer • Mozilla Firefox • Safari (Apple) • Opera • Google Chrome

  15. Protokoll Server Domain TLD Ordner Dateiname (Top Level Domain) URL (Uniform Resource Locator) • Ein System, mit dem man den Pfad zu jedem Dokument im WWW angeben kann: • Der erste Teil bezeichnet einen bestimmten Computer (äquivalent zur IP), alles nach dem ersten Backslash ist ein normaler Pfad auf diesem Computer IP: 80.190.158.9 = www.leo.org • http://www.beispiel.ch/dokumente/reglemente.html

  16. Der restliche Pfad • http://www.beispiel.ch/dokumente/reglemente.html

  17. Protokolle • Kommunikation zwischen Computern ist festgelegt durch Protokolle • Beispiel DNS: • A: Hallo Bob • B: Hallo Alice • A: Wie ist die IP von www.leo.org? • B: 80.190.158.9 • A: Danke, tschüss • B: Tschüss • Protokolle der TCP/IP Familie: • HTTP / HTTPS Webseiten abrufenVerschlüsseltes HTTP • FTP Dateien übertragen • POP3 Mailbox abrufen • SMTP Mail versenden • IMAPMails verwalten • VoIP Voice over IP • http://www.beispiel.ch/dokumente/reglemente.html

  18. Der Reihe nach: • Ein Benutzer gibt in der Adressleiste des Browsers eine URL an – und dann ? IPvS Bei-Spiel

  19. IPvS(imple) Wir spielen Internet

  20. IPvS(imple) Rollen

  21. IPvS(imple) Daten Lookup-liste auf DNS-Server:

  22. ARP-Request

  23. TCP-Header

  24. IP Header

  25. Ethernet Frame

  26. Three-Way Handshake

  27. IPvS(imple) Topologie DNS-Server: 4.5.6.4 Client: 1.2.3.4 3.3.3.2 4.5.6.9 1.2.3.9 3.3.3.1 3.3.3.3 8.8.8.1 8.8.8.2 7.8.9.9 WWW-Server: 7.8.9.4

  28. Ausprobieren: http://www3.rad.com/networks/2005/clieserv/ClieServ.swf WIKI: TCP_IP_Applet.zip entpacken  startApplet.html öffnen Übersicht

  29. Der Reihe nach: • Ein Benutzer gibt in der Adressleiste des Browsers eine URL an – und dann ... • ... stellt der Browser einen http-Request und gibt ihn an das Betriebssystem weiter, dann ...

  30. DNS (Domain Name Service) – auch ein Dienst des Internet • Client(z.B. Browser, via Betriebssystem) ... stellt DNS-Anfrage

  31. Router • Router ... leiten die Informations-pakete von einem Subnetz ins nächste weiter http://www.dnstools.ch/visual-traceroute.html

  32. DNS (Domain Name Service) – auch ein Dienst des Internet • DNS Server ... löst URL in eine IP-Nummer auf (muss dafür evtl. andere DNS-Server konsultieren) • Client(z.B. Browser, via Betriebssystem) ... empfängt Antwort

  33. Http-Request • Client(z.B. Browser via Betriebssystem) ... schickt HTTP-Anfrage los (nach IP)

  34. Router • Router ... leiten die Informations-pakete von einem Subnetz ins nächste weiter http://www.dnstools.ch/visual-traceroute.html

  35. Client und Server kommunizieren über das vereinbarte Protokoll (HTTP), ... • WWW Server ... empfängt die Anfrage, verifiziert den Client, schickt HTML-Reply an Client • Client (Betriebssystem) ... sammelt TCP-Packete (Browser) stellt HTML- Seite dar

  36. http://www3.rad.com/networks/2005/clieserv/ClieServ.swf

  37. Eine Webseite ist also ein HTML-Dokument • Wir haben jetzt gesehen, wie diese HTML-Datei vom Server (=Host) zum Client (=mein Computer) kommt • Erst jetzt fängt die eigentliche Arbeit des Browsers an: • er muss die HTML-Datei lesen und auf dem Bildschirm darstellen • das ist gar nicht so einfach, denn die HTML-Datei enthält meist nur das Grundgerüst der Seite (und den Text) • bevor die Seite angezeigt wird, müssen meist noch weitere Dateien (z.B. Bilder) vom Server geholt werden • und weil der Browser manche Inhalte nicht selbst versteht, muss er ggf. andere Programme (plug-ins) um Hilfe bitten

  38. HTML, die Sprache des Internet “Die Hypertext Markup Language [..] ist eine textbasierte Auszeichnungssprache zur Strukturierung von Inhalten wie Texten, Bildern und Hyperlinks in Dokumenten.” Wikipedia, Hypertext Markup Language, (23.8.2010), http://de.wikipedia.org/wiki/Hypertext_Markup_Language • Die “Auszeichnung” (Markup) geschieht durch Tags, welche die ausgezeichneten Elemente einschliessen z.B.: <i>Hallo</i>  Hallo

  39. Grundgerüst <!DOCTYPE ... > <html> <head> ... </head> <body> ... </body> </html> ReinesTextdokument: z.B. mitdem Windows Notepad erstellt Dateiendungnicht .txt sondern .html Lässtsichmit Browser öffnen. Dieserinterpretiert die HTML-Elemente und stellt die Seitedar.

  40. HTML-Elemente • Werden gekennzeichnet durch Tag: <tagname> • Die meisten HTML-Elemente benötigen schliessende Tags: </tagname> • Verschachtelung möglich: • <tag1>...<tag2>...</tag2>...</tag1> • <tag1>...<tag2>...</tag1>...</tag2> • Aber gemäss definierten Regeln

  41. Übliche Tags im Body-Element Paragraph:<p>...</p> Zeilenumbruch:<br /> Bereich:<span>...</span> Überschriften:<h1>...</h1><h2>...</h2> Tabellen:<table> <tr> <td>...</td> <td>...</td> </tr> <tr> <td>...</td> <td>...</td> </tr></table>

  42. Tags im Body mitAttributen • Bild:<imgsrc="bild.jpg" alt="Bild“ /> • Link:<a href="http://www.sbb.ch">...</a><a href=“kontakt.html">...</a> ... „bild.jpg“ = relativer Pfad absoluter Pfad, startet bei www relativer Pfad, startet „hier“ (wo die Datei liegt, in der dieser Code steht)

  43. HTML-Elemente <!DOCTYPE ... > <html> <head> <title> Tolle Seite </title> ... </head> <body> ... </body> </html>  Der Browser schreibt “Tolle Seite” in die Titelleiste des Fensters, in dem die Seiteangezeigtwird

  44. HTML-Elemente <!DOCTYPE ... > <html> <head> ... </head> <body> <h1>Hallo</h1> Ichgrüsse <b>dich</b> ... </body> </html>  Der Browser schreibt “Hallo” in das Fensters und formatiert dieses WortalsgrosseÜberschrift.  Der Browser schreibt “Ichgrüssedich” unter die Überschrift, in normalerSchriftart und –grösse, “dich” in fetterSchrift

  45. HTML-Elemente <!DOCTYPE ... > <html> <head> ... </head> <body> <imgsrc="bild.jpg" alt="Bild“ /> ... </body> </html>  Der Browser fragtbeim Server nach der Datei “bild.jpg”, die sichimselbenOrdnerwie die HTML-Dateibefindensoll  Falls das Bildgefundenwird, stellt der Browser es auf der Seitedar – andernfallsschreibter, dass “Bild” nichtgefundenwurde

  46. HTML-Elemente <!DOCTYPE ... > <html> <head> ... </head> <body> <embed src="meinFlashFilm.swf” type="application/x-shockwave-flash"> </embed> ... </body> </html>  Der Browser fragtbeim Server nach der Datei “meinFlashFilm.swf”, die sichimselbenOrdnerwie die HTML-Dateibefindensoll  Da Der Browser mit .swf-Dateiennichtsanfangenkann, suchternacheinem Flash-plugin, und überlässtdiesem die Darstellung des Videos

  47. Aufgabe Bild und Link • Erstelle eine kleine HTML-Webseite: • Überschrift • Text • 2-3 Bilder • Eine kleine Tabelle • Einige passende Links  Lokal abspeichern und im Browser betrachten Links: • http://www.w3schools.com/tags/default.asp • http://de.selfhtml.org/html/index.htm <html> <head> ... </head> <body> ... </body> </html>

  48. HTML & CSS HTML = Struktur & Inhalt CSS = Darstellung, Layout • z.B. • Text • Bilder • Links • Überschriften • CSS-Hooks • z.B. • Farben • Ränder • Abstände • Positionierung • (Bilder)

  49. HTML-CSS  Der Browser fragtbeim Server nach der Datei “meinCSS.css”, und bekommtdiese: <!DOCTYPE ... > <html> <head> <link rel="stylesheet" href="meinCSS.css" type="text/css" /> </head> <body> <h1>Hallo</h1> ... </body> </html> h1 { color: orange; font-weight: bold; }  Bevorer die grosseÜberschriftdarstellt, schaut der Browser in “meinCSS.css” nach, obhiereinbestimmtesAussehenfür h1-Elemente definiertist – esist, also wird “Hallo” orange und fettdargestellt

More Related