[Powered by Google Translate] [Woche 7, Fortsetzung] [David J. Malan, Harvard University] [Dies ist CS50.] [CS50.TV] Gut. Welcome Back. Dies ist CS50, und das ist das Ende der Woche 7. So eine dieser dummen kleinen Dinge, die rund um das Internet geht und wir schlürften up, und es sollte nun ein wenig geeky Sinn für Sie. Nun, es war lustiger zu diesem Kerl, als es an euch war. Apropos, gut, Jungs, heute ist Nate Geburtstag. Um Ihnen ein Gefühl dafür, wie gute Nate und ich sind bei Web-Entwicklung am Montag der Klasse und auf Basis nun an diesem Ich dachte, ich hätte ziehen Nate Homepage, wenn Sie es noch nicht gesehen. Das hier ia Nates HTML. So sehen sein Sourcecode, wenn Sie möchten, um zu sehen, wie dies zu tun, und Nate, wenn wir Sie nur kurz in Verlegenheit bringen, bekam das Personal Ihnen eine Kleinigkeit wenn Sie möchten, um einen Nachtisch mit einigen der Kinder in der Klasse zu teilen. Wenn Sie möchten, kommen nach unten. Sie alle applaudieren und sind sehr nett, aber niemand irgendwo sitzen in der Nähe Nate, aus irgendeinem Grund in dieser Zone zurück. Also vielleicht finden Sie einige Leute, diese mit zu genießen. Happy Birthday, Nate. 

Zusätzliche hellos: Wir zeigten ein paar Clips aus unserem CS50x Studenten. Wenn Sie sehen möchten, wer sonst ist es in der Welt das ist gefolgt sind, können Sie zu dieser URL Kopf, wo Joseph, einer unserer TFs, hat zusammen eine Montage von Arten gesetzt eines jeden, der worden Einreichung hat diese Videos, darunter Rick Astley. Und wenn Sie durch diese scrollen, es ist wirklich sehr inspirierend die Vielfalt der Länder und Städte, aus denen Menschen hagelt sehen. Also, wenn Sie möchten, einen Blick auf, dass zu nehmen, das wird sich bis zum Ende des Semesters. Heute setzen wir unsere Blick auf die Web, Web-Programmierung, HTML und dergleichen, und wir haben auch Mittag kommen an diesem Freitag wenn Sie möchten, und vor allem haben nicht getan. An diesem Freitag das Thema wird Nate Geburtstag sein, so, wenn Sie möchten, Geburtstag Mittagessen mit Nate haben und andere, einige unserer Freunde aus Industrie, Sie Kopf zu dieser URL gibt. Space, wie immer, ist begrenzt. Auch, wenn Sie vergessen haben, erkennen, dass nächste Woche ist die Frist für die Problem-Set 4 der Schnitzeljagd, wobei nach der Wiederherstellung all diese JPEGS von card.raw, Sie und Ihre Abschnitt mates, wenn Sie möchten, können Sie versuchen zu fotografieren so viele der Informatikern aus dieser Speicherkarte möglichst und du und deine Abschnitt wird dann gewinnen Sie einen tollen Preis. Beziehen Sie sich auf pset 4-Spezifikation, was zu unterwerfen und bis wann. Auch, wenn Sie möchten, dass Ihr Werk verewigt Auf dem Kurs der Website und ihrer Geschichte von Bekleidung, wissen, dass Sie sind jetzt willkommen zu starten Einreichung Designs für den diesjährigen T-Shirts und Sweatshirts und dergleichen. Wir werden unser Bestes tun, um so viele wie möglich sind, aber wir haben einige Mitglieder des Personals bewerten alle Entwürfe um sicherzustellen, dass sie im Einklang mit den Vorgaben, und wir dann in der Regel holen eine Handvoll von ihnen ausgestellt werden. Also, wenn Sie die Bauart sind, weiß nur, dass die Anforderungen für Grafiken sind PNG, mindestens 200 DPI, sie sollten nicht mehr als 4000 x 4000 Pixel aufweisen, und nicht mehr als 10 MB, aber du bist willkommen, um Dinge wie verwenden Photoshop oder GIMP oder verschiedene Grafik-Programme, was haben Sie zu Ihrer Verfügung. 

Auch am Horizont ist das letzte Projekt. Das endgültige Projekt ist wirklich der Höhepunkt von 50, wobei von allen Aufgaben im Kurs, es ist Ihre Chance, wirklich Ihr eigenes Ding machen. Und das kann ganz einfach sein, etwas zum Spaß tun, es sein kann, etwas drängendes Problem Ihren Studentenausweis Gruppe zu lösen, für einige neue Website, einige neue Kollektion für Daten. Es kann eine mobile Anwendung für Android sein, für iOS. Wirklich, ist der Himmel die Grenze, und im Laufe der nächsten Wochen wie wir Übergang von C zu diesen höheren Sprachen wie PHP und JavaScript, Sie finden sich zunehmend vertraut mit einigen realen Techniken, einige der realen Welt Werkzeuge, um und zu ergänzen, dass wissen, dass das natürlich eine Geschichte von Seminaren hat, wobei im Laufe der nächsten Wochen wird ein Teil des Lehrpersonals und Freunde von uns aus auf dem Campus bieten optional Seminaren welche darüber hinaus, was üblicherweise in Abschnitt vorgenommen gehen Sie Dinge wie Android Programmierung einzuführen, Sie Dinge wie iOS-Programmierung einführen oder erweiterte Web-Entwicklung Techniken. Es gibt eine ganze Geschichte dieser bereits online. Wenn Sie cs50.net/seminars gehen, haben wir dies seit einigen Jahren, und du wirst sehen, dass hier mit PDFs und Videos archiviert und dergleichen sind mehrere Dutzend Videos von Seminaren. Im vergangenen Jahr, zum Beispiel, hatten wir ein Seminar zum Thema acing Ihre technischen Interviews, wenn du eigentlich auf der Suche zu gehen und ein Praktikum machen oder Vollzeit-Gig. Windows-Mobile-Entwicklung, Android Entwicklung, Google Maps, API, CSS, entwickelt für den BlackBerry, Emacs. Wirklich, Sie begrüßen zu dürfen, um einen Blick auf jeder dieser Seminare an Ihrer Bequemlichkeit zu nehmen. Und wir werden halten einige neue dieses Semester, wie gut. 

Also, was ist vor dem endgültigen Projekt? Nun, zunächst einmal, obwohl dieses Datum ist etwas bevorsteht, das ist wirklich nur eine Gelegenheit, sich Gedanken über das endgültige Projekt ganz realistisch starten. Wir wissen nur die Anfänge der einiges von dem was wir noch im Laufe werden abdeckt, HTML, PHP und dergleichen, aber ihr seid alle mit dem Web vertraut, und ich Bias dieses Gespräch auf der Web nur, weil die meisten Menschen am Ende dabei Web-basierte letzten Projekte, aber das ist keineswegs Voraussetzung. Mit C ist in Ordnung, Objective C, Java, jede andere Sprache, die Sie kennen oder vielleicht wissen wollen, ist ganz gut. Aber die Säfte fließen zunächst erhalten, werden wir erwarten, dass die Vorlage eines preproposal die, gemäß dem PDF auf der Website, die jetzt bei cs50.net, und in der oberen linken sehen Sie endgültige Projekt ist die Spezifikation für das endgültige Projekt, und es gibt Einzelheiten zur preproposal und dergleichen. Es ist ziemlich viel darauf an, eine E-Mail an deine Lehre Kollegen nur um ein Gespräch mit ihm oder ihr über das, was du denkst. Auf projects.cs50.net ist ein Repository von Ideen von Leuten auf dem Campus Wenn Sie kämpfen, um mit einer Idee, und manual.cs50.net/APIs ist eine Sammlung von Links zu APIs. 

Was aber ist ein API? Was ist ein API? Ich habe es mindestens zweimal, nach den Niederschriften der vergangenen Wochen. Was ist das? [Student, unverständlich] >> Okay, gut. So etwas Programmierschnittstelle. Anwendungsprogrammierungsschnittstelle, und dies kann mehrere Formen annehmen, Aber was das wirklich darauf an, ist der Code dass jemand anderes hs geschrieben oder Daten, dass jemand anderes gesammelt hat Das ist Ihnen zur Verfügung gestellt in einigen programmatischen Weg. Sie können Code in C, PHP, Python, Ruby zu schreiben, was der Sprache Ihrer Wahl in der Regel ist, und man kann irgendwie auf jemand anderes die Funktionalität aufbauen oder jemand anderes Daten-Set. Zum Beispiel, wenn ich gehe, um diesen Link hier, und du wirst ein Paar von Links auf der nachfolgenden Seite sehen wobei wir CS50 eigenen APIs, die sehr Harvard-centric sind, und dann Dritter APIs. Unter den Drittanbieter-APIs sind wirklich nützliche Dinge wie die Möglichkeit, SMS an Personen zu senden, in der Lage, SMS-Nachrichten von Leuten erhalten. Und solche Dinge, die Sie keine Ahnung, wie man selbst implementieren haben könnte, aber dank Dienste, einige freie und einige kommerzielle, Sie können oben die bauen und etwas tun für Sie von Interesse. Unter CS50-APIs sind diese Campus-centric Dinge wie Harvard Kurse, Energie, Veranstaltungen, Essen, Karten, Nachrichten, Tweets und Shuttleboy eigenen, und diese sind APIs, die ein wenig so aussehen. 

Lassen Sie mich hochziehen HarvardFood API. Wenn Sie jemals in HUD Website gewesen sind, haben Sie wahrscheinlich dort gewesen nur um zu sehen, was es zum Abendessen oder zu sehen, was die Stunde für einige d-Halle sind. Nun, es ist nicht besonders leicht zu navigieren, und so was hatten wir vor einiger Zeit wurde schrieben wir Software, es geschieht in PHP, die tatsächlich Bildschirm kratzt die Gesamtheit der HUD-Website sein. Um Kratzen etwas Bildschirm bedeutet, ein Programm in einer Sprache wie PHP zu schreiben das vorgibt, ein Browser zu sein, obwohl Sie es vielleicht an einer Eingabeaufforderung ausführen, das vorgibt, ein Browser sein, eine Verbindung zu einer Website, lädt die HTML, die Sprache, in der es geschrieben ist, und dann liest, oder genauer gesagt, analysiert er oben nach unten, von links nach rechts. Und was wir taten, war, schrieben wir unseren Code in einer solchen Weise, dass jedes Mal sahen wir etwas in dieser HTML-Code, wie etwas auf der Speisekarte sah, wie Hamburger, würden wir dann, dass in unsere eigene Datenbank zu importieren. Und jedes Mal sahen wir Nährstoffgehalt, würden wir das in unsere eigene Datenbank zu importieren. Und was wir taten, war nutzen die Tatsache, dass HUD-Website, auch wenn es vielleicht ein bisschen eine Herausforderung für uns Menschen zu navigieren sein unter der Haube, wird die gesamte Datei durch ihre eigene Computerprogramme erzeugt. So alle ihre HTML, obwohl es aussehen könnte, chaotisch, wie die meisten Websites unter der Haube folgt ein Muster. So wir haben gerade ein paar Stunden herauszufinden, dieses Muster so dass am Ende, werfen wir weg alle chaotisch HTML, alle die Ästhetik der mutige Verkleidung und kursiv und dergleichen, und was wir sind dann in der Lage zu tun ist, aussetzen, dass dieselben Daten. Zum Beispiel werden auf diese Weise. Also haben wir, nach der Dokumentation hier informiert die Welt, dass, wenn Sie eine URL anfordern so aussieht, food.cs50.net / etwas, und Sie stellen bestimmte Parameter, über die wir heute sprechen werden, wie End-Datum, Uhrzeit, Start-Datum, Uhrzeit, Essen und so weiter, was unsere Server werden zu euch zurückkehren, zum Beispiel, wird eine CSV-Datei, Komma separted Werte wie eine Excel-Datei, enthält alles, was für das Frühstück an diesem Tag im März letzten Jahres wenn ich zu schreiben, diese Dokumentation passiert. 

Für diejenigen, die ist CSV nicht das einzige Dateiformat. Es gibt ein anderes Format, das umso vielseitiger ist als JSON, JavaScript Object Notation. Die Daten können kommen zurück in diesem Format. Also das Essen zum Mitnehmen ist hier, dass, ob Sie tauchen ein in dieser API oder jede andere von CS50 oder irgend etwas da draußen auf dem Internet, oder überhaupt nicht erkennen, dass die Welt zunehmend begann zu standardisieren wie Maschinen miteinander kommunizieren. Wir verwenden Standard-Datenformate wie CSV oder JSON. Und was bedeutet das für Sie ist, können Sie die interessante Teil eines Programms schreiben das lässt Ihre Benutzer suchen einen Speisesaal Menü das lässt sie erstellen Listen der Favoriten, die sie bekommen Textbenachrichtigungen können wenn ihr Lieblingsgericht ist etwa in irgendeiner d-Saal serviert werden indem jemand anderes Datensätze und Gebäude auf ihre APIs. So mehr dazu in Form von Seminaren und der Dokumentation, dass Sie hier sind online. Also diejenigen, dann sind APIs. 

Das bringt uns zurück zu HTML. Kurze Wiederholung. Was ist HTML? [Student, unverständlich] >> Gut. HyperText Markup Language. Jemand anderes, was ist Hypertext Markup Language? HyperText Markup Language. Okay. So HTML, Hypertext. HyperText lediglich verweist im Web, zum größten Teil. Markup bedeutet, dass es nicht wirklich eine Programmiersprache HTML. Es ist nicht eine Sprache, die man logisch in. ausdrücken Es muss nicht Schleifen. Es muss nicht Bedingungen. Es muss nicht Funktionen per se. Vielmehr hat er diese Dinge genannt Tags, oder genauer, Elemente. Und diese Elemente haben Start-Tags und End-Tags, oder offenen Tags und geschlossene Tags, und was diese Tags in der Regel für einen Browser ist meine, beginnen, etwas zu tun und dann aufhören, etwas zu tun, obwohl es Ausnahmen, dass sind. Manchmal ist es nur 'setzen einen Zeilenumbruch hier ", zum Beispiel. Und wir sahen Beispiele, dass die anderen Tage, zwischen bold orientiert, Zeilenumbrüche und dann ein paar anderen Tags. So HTML ist die Sprache, in der Webseiten geschrieben werden. Also, wenn ich gehen, um so etwas wie Google.com und ziehen Sie nur ihre Homepage daran erinnern, dass, wenn Sie einen Rechtsklick oder steuern Sie und Ansicht-Seite Quelle zu suchen, in der Regel es ist ein komplettes Chaos in diesen Tagen unter der Haube, aber das ist, weil Computer nicht über Leerzeichen kümmern, so dass diese nicht auch hübsch aussehen. Aber wenn wir uns auf Teile davon zu vergrößern, feststellen, dass Chrome, nur nett zu sein, hat die Farbe Dinge codiert. Tatsächlich ist dies der allererste tag dass wir in einer Web-Seite gesehen. Und wieder, HTML 5, die neueste Version dieser Sprache, ist dieses Ding am Anfang haben, <! Doctype html, ob Klein-oder Großbuchstaben, aber das ist nur eine Art Standard, der sagt, hey Welt, hier kommt eine HTML-Datei in der Version 5. 

Der interessante Teil beginnt hier. So <html, und dann gab es zwei Kinder der HTML-Elemente letzten Zeit. Was waren das für zwei Kinder? Kopf und Körper, wie der Mann mit der Tätowierung vor einem Augenblick. Es gibt zwei Teile der Web-Seite, Kopf und Körper, und Recall, dann, dass vielleicht die einfachste Web-Seite könnten wir wie folgt aussieht. Und ich habe es eingerückt nur um Art sauber und ordentlich mit meinem Code ist, aber was ist hier wirklich wichtig ist, dass es einige Hierarchie dazu. Und jeder Tag, dass ich öffnete ich geschlossen haben und dass es daher diese Symmetrie alle Markup, dass ich erstellt habe. So wir das letzte Mal zu schreiben begann Webseiten auf meinen eigenen Laptop. Ich öffnete Text bearbeiten, sparte ich die Datei als hello.html, Ich habe dann zog die Datei auf meinem Browser und voila, hatte ich eine Seite im Internet. Nun, es ist nicht ganz der Fall, ich hatte eine Seite auf meiner Festplatte, und ich war buchstäblich die einzige Person auf der Welt, dass Web-Seite in einem Browser sehen würde. 

Also heute stellen wir eine tatsächliche Web-Server und der Begriff der Wirklichkeit dient Inhalte im Internet und wie das alles zusammen passen beginnt. So stellt sich heraus, dass die ganze Zeit in der CS50 Appliance Sie haben eine Web-Server auf Ihrem Computer. Wir haben, in Fairness, es nur für gedit verwendet, Clang für GDB und dergleichen, sondern auch von uns für Sie installiert im Gerät ist ein Web-Server, und dass Web-Server passiert, frei zu sein, ein Open Source, einer der beliebtesten in der Welt, genannt Apache. Seine mehr technische Name ist HTTPd, wobei das d für daemon hier was ein technisches Wort für einen Server. So in der CS50 Gerät installiert ist ein Web-Server, und was bedeutet das? Nun, das ist ein Web-Server, konzeptionell, einige Server im Internet, die bis dient Web-Inhalten. Wenn für eine Datei gefragt, spuckt es aus dem HTML-Code, diese Datei komponiert, und voila. Sie sehen einige Homepage der Website. Aber ein Server ist, genauer gesagt, eine Software. Es muss nicht auf einer physischen Maschine sein, es muss nur ein Stück Software läuft. So dass die CS50 Gerät selbstverständlich ist ein Stück Software obwohl es ist eine Art der vorgibt, eine Maschine sein. Es vorgibt, ein Computer innerhalb eines Computers sein, aber das bedeutet nur, dass das Gerät kann sicherlich laufen die Dinge wie Web-Server. Es kann tatsächlich ausführen E-Mail-Servern. Wir könnten eine Instant Messaging-Server in das Gerät, wenn wir wollten, und in der Tat haben wir eine andere Art von Server als Datenbank-Server bekannt, mySQL laufen. Aber mehr dazu nächste Woche. Dies bedeutet, dass ich tatsächlich Webseiten besuchen Innere mein Gerät mithilfe eines Browsers im Inneren des Gerätes oder sogar auf meinen eigenen Laptop, mein Mac oder mein PC. Also, was bedeutet das? Es stellt sich heraus, dass jede Zeit, die Sie mit einem Linux-Computer seinen Spitznamen "local host." Es muss nicht einen Domain-Namen, weil wir nicht einen Domain-Namen gekauft haben für so etwas wie das Gerät, so dass ihr Standardname lautet lokalen Host. 

Aber um sich das Gerät zu starten serviert Web-Seiten, wir müssen sie zuerst erstellen. Also lasst uns das tun. Lassen Sie mich in einem Terminal-Fenster hier gehen und merke, dass ich an meinem typischen John Harvard prompt bin. Lassen Sie mich gehen Sie vor und geben Sie ls, und wir werden einige bekannte Dinge aus diesem Semester zu sehen, Desktop, Downloads, Dropbox und so weiter, aber jetzt beginnen wir unsere Aufmerksamkeit auf ein paar. Auf vielen Linux-Web-Server gibt es diese Ordner namens öffentlichen html, aber wir werden, dass ein einmal überspringen und sich auf diesem, vhosts. Wer weiß, was für ein vhost ist? Einfach nur dumm Jargon für virtuellen Host, und was dies bedeutet, dass auf einem typischen Server Sie können tatsächlich als Host für mehrere Websites. Sie können einen Domain-Namen wie foo.com, und Sie können es auf einem Server hosten. Aber man kann auch kaufen bar.com und hosten sie auf dem gleichen Server. Der Grund dafür ist, sind Browser intelligent genug, um den Server zu informieren wenn ein Benutzer anfordert etwas Webseite, was Domain-Namen der Nutzer will das Homepage. Also, was ist schön, darüber wird Sie nicht brauchen ein physischer Server oder ein CS50 Appliance für jede Website möchten Sie vielleicht zu schaffen. Sie können den gleichen Server und entwickeln hundert verschiedenen Webseiten. Und in der Tat, wenn Sie eine Person, die versucht, eine Website zu starten, ob zum Spaß oder für Unternehmen, in der Regel werden Sie gehen über das Internet, und du wirst jemand zahlen zehn Dollar im Monat, hundert Dollar pro Monat Ihre Website für Sie zu hosten. Und der Weg, der funktioniert, ist sie dort verlangen andere Menschen zehn Dollar pro Monat oder hundert Dollar pro Monat anderer Leute Webseiten auf ihre demselben Server hosten. Der Grund warum sie das tun kann, ist, weil dieses Feature namens bhosts, sondern mehr auf, dass, wenn es an der Zeit für die endgültige Projekte geht. 

Denn jetzt, lasst uns einfach dort zu tauchen. So cd vhosts, und wenn ich ls jetzt feststellen, dass es ein Ordner dort als lokalen Host. Das ist, da standardmäßig die Appliance Zahlen Sie jemals eine Website auf einem Gerät laufen. Das ist nicht wirklich die reale Welt, es ist nicht eine reale Web-Server. Also lassen Sie mich in lokalen Host zu gehen, und jetzt werden wir dort sehen ein letztes Verzeichnis namens HTML. So ist es ein wenig tief, die Hierarchie, aber ob und wann Sie entscheiden, zu entwickeln beginnen mehrere Websites in den nächsten n Monate oder Jahre, diese Art von Ordner-Struktur neigt dazu, hilfreich sein. Lassen Sie uns nun in HTML gehen, wie ich tat genau, ls, und nichts ist da. So, jetzt lass uns weitermachen und tun. Lassen Sie mich eröffnen Chrome im Inneren des Geräts, und lassen Sie mich http://localhost gehen. So wörtlich der Name für mein Gerät geben, und ich bekomme index of /. Dies ist nicht wirklich zeigt mir nichts von Interesse, aber es stellt sich heraus, dass das, was wir sehen, ist, dass Ordner, HTML. Es gibt nichts in diesem Ordner gerade jetzt, so statt, was werde ich tun müssen, ist zunächst eine Datei. Erstellen Sie eine HTML-Datei, wie wir es am Montag, aber diesmal legte es in das Gerät. Für diejenigen unter Ihnen, die versuchen zu folgen zusammen mit Laptops sind jetzt lass es mich tun ein beiseite, die in der Web-basierten pset abgedeckt werde, sondern um sich dies für das erste Mal zu arbeiten, Sie gehen zu müssen, um diesen Befehl auszuführen: sudo service httpd start. Und dies wiederum wird in der letzten pset wiederholt werden, aber wenn Sie Mitspielen jetzt zu Hause, der Web-Server ausgeschaltet ist im Gerät eingeschaltet wird, und dass es so, dass es nicht untergraben RAM und Speicher für 7 Wochen aus dem Semester, wenn wir es nicht brauchen. So müssen Sie diesen Befehl einmal ausführen, und Sie erhalten eine Ausgabe wie das zu bekommen. Dann sollten Sie in der Lage sein zu spielen hier entlang. Jetzt gehen wir wieder in diesen Ordner. Dieser Ordner ist leer, so lassen Sie mich beginnen Erstellen einer Datei, gedit hello.html. 

Gut. Gedit ist offen, wie üblich. Lass es mich tun doctype, html, html, lassen Sie mich vor mir selbst und beginnen schloss meine Tags im Voraus. Jetzt habe ich den Kopf. Lassen Sie mich gehen Sie vor und schließen Sie den Kopf, Lassen Sie mich nun zu tun den Titel der Seite, Hallo Welt wie beim letzten Mal, close Titel, jetzt lass mich einen Körper. Hier werde ich sagen, hallo, Welt mit einigen exclams deutlich zu machen, dass es eine andere Zeichenfolge ist. Schließen Körper, und lassen Sie mich jetzt gehen Sie vor und speichern. Lassen Sie mich zurück zu meinem Terminal-Fenster, und wenn ich ls, Ich sollte vermutlich sehen hello.html. Und das tue ich. So, jetzt gehen wir zurück zu meinem Browser zu gehen, klicken Sie auf nachladen, und Sie sehen, wir sind in der Tat innerhalb dieses HTML-Ordner. Ich bin nicht zu sehen eine Web-Seite noch nicht, das ist Apache, der Web-Server, nur zeigt mir die Liste Inhalt dieses Verzeichnisses. Genau wie Mac OS oder Windows typischerweise auf Ihrem eigenen lokalen Festplatte zu tun. Also, wenn ich diese Web-Seite sehen möchten, kann ich auf dieses kleine Link hier, hello.html, und in der Tat ist das, was ich erwartet hatte, um zu sehen. Jetzt wieder, ist dies nicht eine URL, dass jeder von euch kann jetzt besuchen, denn für Sie, lokalen Host, wenn Sie einen Laptop hier es wird eine eigene Instanz des Gerätes beziehen. Dies ist auf meinen eigenen persönlichen Gerät, aber dies ist eine Art stummen für mich zu haben, haben ein Benutzer, wie ich mich auf hello.html klicken Sie tatsächlich sehen, den Inhalt dieser Seite. Es stellt sich heraus, dass Web-Servern wie Apache können Sie eine Standard-Datei für jede Web-Server. Beachten Sie hier haben wir hello.html. Was ist der Befehl in Linux, um eine Datei umbenennen? 

MV für unterwegs. Also lass mich tun, und lassen Sie mich umbenennen hello.html index.html. Lassen Sie mich ls zu bestätigen es jetzt umbenannt. Nun ist dies zu gehen - wenn ich wieder zu lokalen Host gehen, merkt jetzt, dass ich automatisch zu sehen, dass Web-Seite. Dies ist identisch mit meinem eigentlich tun / index.html, aber die nette Sache ist jetzt, dass die Web-Servers herauszufinden, oh, wenn Sie eine Datei, die es, durch die menschlichen Konventionen, heißt index.html, lassen Sie mich den Benutzer, dass die Datei standardmäßig anstatt einige dumme Verzeichnisliste das ist überhaupt nicht benutzerfreundlich. In der Tat haben die meisten von Ihnen besuchten Websites im Internet nicht über eine Liste von Dateien klicken Sie auf, sie nur zeigen Sie den Inhalt. Also das ist, wie wir, dass index.html tun. Also das ist alles Spaß und gut, aber das ist eine ziemlich einfache Web-Seite. Lassen Sie mich gehen Sie vor und eröffnen index.html in meinem vhosts, lokalen Hosts, html-Verzeichnis, und lassen Sie uns noch etwas von größerem Interesse. So gibt es Hallo Welt, lass uns stattdessen sagen: "Das ist CS50, Harvard College. . . " So der Beginn des Kurses Katalogbeschreibung irgendeiner Art gibt. Nun, wenn ich neu zu laden, sollte ich dies in meiner Homepage zu sehen. Okay, und ich sehe, dass, aber angenommen, dass ich nun eine Liste einige weitere Inhalte in dieser Datei wollen. Ich könnte hier unten und sagen, Voraussetzungen none, obwohl einige von Ihnen wahrscheinlich werden wollen, 'Ha ha ha, keine Voraussetzungen. " Aber - offiziell. So laden, und jetzt haben wir die gleiche Eigenart, dass wir das letzte Mal sah. Aber warum ist das so? Es war eine einfache Lösung. Warum wird diese Seite gebrochen? [Student, unverständlich] >> Ja, wir haben diese gelöst werden, bevor explizit sagen des Browsers legte einen Zeilenumbruch hier. Und das ist, weil wieder ist ein Browser nur noch zu tun explizit, was die Markup-Sprache erzählt, es zu tun, so, obwohl Sie getroffen haben könnte einmal oder zweimal oder sogar zehnmal einzugeben, es geht um, dass alle in einem einzigen Raum zu kombinieren, nur durch Konvention. Also, wenn Sie wirklich wollen, einen Zeilenumbruch, müssen Sie das br-Tag verwenden, und jetzt Ankündigung, wie Montag, lege ich die / innen dieser Tag, nur, weil diese einfach nicht fühlen um einen Zeilenumbruch zu starten dann stoppen sie mit nichts dazwischen. 

So ist die Konvention in HTML ist zum Öffnen und Schließen einen Tag gleichzeitig. Nebenbei werden Sie eine Vielzahl von Websites in Bücher nicht tun sehen. Es ist richtig, zu tun oder es nicht zu tun, aber wir würden argumentieren, dass Design-weise und stilistisch ist dies nur besser weil dann jeden tag ist sowohl geöffnet und geschlossen irgendwie. So, jetzt lasst uns speichern und neu laden. Gehe zurück an den Browser, okay. Jetzt werden wir einige Fortschritte, aber es ist nicht genug. Lasst uns weitermachen und Eingabe in einigen längeren Körper des Textes. Also sagen wir mal, 'A quick brown fox springt über einen faulen Hund.' Und jetzt lassen Sie mich nur kopieren und fügen Sie ein paar Mal so dass wir einen Absatz des Textes haben. Lassen Sie mich zurück hierher. So ist es nicht sehr gut aus. Ich habe einen Zeilenumbruch, so ist es okay, aber jetzt, nachdem wir zu dem Punkt, der mit einer Web-Seite bekommen das hat viele Inhalte und nicht nur einzelne Linien zu zeigen, HTML, können wir beginnen, diese Dinge als tatsächliche Absätze denken. Und wir können beginnen, unsere Web-Seite ein wenig mehr sauber zu strukturieren. Und in der Tat, was ich tun kann ist, gehen hier in meinem Körper tag, und weißt du was, wenn "Dieses CS50 ist. . . " wirklich renzeichen den Anfang eines Absatzes, gut, lass uns kennzeichnen sie als solche. Lassen Sie mich Gedankenstrich den Text, nur durch Konvention, lassen Sie mich sagen, dass dieser Absatz endet hier, und dann anstatt dies tun Zeilenumbruch, lassen Sie mich nur sagen, dass diese gehört dort als neuer Absatz, und ich werde nur schnell Gedankenstrich von nur clobbering all dieses Zeug. 

Deshalb haben wir jetzt einen eingerückten Absatz dort, und jetzt unsere Markup ab, um ein wenig mehr zu bekommen semantisch konsistent mit, was wir zu tun versuchen. Wir haben einen Absatz, so nennen wir es ein Absatz mit dem p-Tag. Wir haben einen zweiten Absatz, so nennen wir es ein Absatz mit dem p-Tag. Und nun, was der Browser normalerweise tun ist nur in einem englischen Buch oder einen Aufsatz möchten, wo Sie in der Regel sehen Sie einige Zeilenumbrüche zwischen den Absätzen. Browser wird das für Sie automatisch. So, jetzt haben wir zwei Absätzen und wir können weitermachen. Aber, natürlich, auf dem Web, wenn Sie einen Körper aus Text ist es in der Regel nicht einfach riesig Blobs von Text. Oft gibt es Hyperlinks drin. Also, wenn wir wollen, zum Beispiel, sind einige Links dort, nehme an, was vielleicht von Interesse, in welcher Seite ich dabei bin hier ist sein - lassen Sie mich zu Google.com gehen, und lassen Sie mich für eine quick brown fox suchen. Zur Google Bilder, und wie wäre es - das ist niedlich. Wir gehen mit diesem. Wir haben hier also eine schnelle braune Fuchs springt über einen faulen Hund. Also, was ich hier tun, nur zum Zwecke der Demonstration, ist anzunehmen, dass dieses Bild auf meinem Server war, und ich hatte die Erstellung dieser Bilder. Was ich gerade tat, war die rechte Maustaste oder kontrollieren, klicken Sie auf das Bild, und was Sie in den meisten Browsern zu sehen ist ein kleines Menü - damit aufhören - ein kleines Menü, mit dem Sie Link-Adresse kopieren oder kopieren URL auswählen können. Also lassen Sie mich zurück gehen jetzt zu meinem HTML und nehme, was ich will einen Hyperlink dieses zu einer anderen Webseite. 

Was war der Tag für heißt das? [Student, unverständlich] >> Ja. So a href für hyper Referenz. Lassen Sie mich gehen Sie vor und fügen Sie diese in. Es ist eine ziemlich lange URL, also lass mich wieder heraus zu zoomen. Schließen Klammern, so dass jetzt merke ich, bin Weg hierher weil diese URL passiert ist ziemlich lang. Lassen Sie mich zu blättern hier bis zum Ende des quick brown fox, und dann lassen Sie mich schließen diesen Tag mit </ a, wo ich nur geschlossen den Namen der Variablen. Nun lassen Sie mich gehen Sie vor und speichern Sie die Datei, laden Sie die Web-Seite, und jetzt standardmäßig, das geht in blau für mich unterstrichen werden, wohl aber kann ich jetzt auf dieser und voila klicken. Es ist das Bild. Und es war nicht ein Bild sein, es könnte verknüpft haben zu einem anderen zufälligen Website im Internet. Ich konnte dies tun, zum Beispiel mit CS50, so ein letztes Beispiel hier. 'Dies ist CS50 "könnte Sinn machen, gehen ein, href = http://www.cs50.net Nähe Zitat, in der Nähe Anker. So das ist jetzt eine noch kürzere URL, und dieses Mal werden wir nicht zu einem Bild verknüpfen. Wir gehen stattdessen zu einer anderen Seite zu verknüpfen. Jetzt haben wir ein Bild hier. Ich fühle mich wie können wir tun, ein wenig besser als nur die Verknüpfung zu einem Bild. Was, wenn wir tatsächlich verkörpern in unserem eigenen Web-Seite wollen? 

Nun, was kann ich hier tun, ist, anstatt Link zu dieser Grafik, Lassen Sie mich statt schneiden Sie die URL, und wir loswerden, dass Hyperlink und reinigen diese auf. Und wir gehen runter und los davon. Wir wissen nicht wirklich brauchen alle diese Sätze jetzt, so lassen Sie mich verkürzen die Seite ein wenig. Und dann hier unten lassen Sie mich gehen Sie in einem neuen Absatz, sagen, dass ich nicht wollen, Text jetzt, ich will ein Bild, dessen Quelle wird, dass URL sein. Ein Bild, wie ein Zeilenumbruch, ist entweder da oder nicht. Also lassen Sie mich sofort zu schließen, dass die tag. Lassen Sie mich gehen Sie jetzt und schließen Sie den Absatz, dass ich drin bin, und wenn alles gut geht mit hallo, Welt, wenn ich jetzt zu laden, Ich, ja, direkt in meine eigene Web-Seite ein Bild sehen. So, jetzt haben wir ein Image-Tag, ein Anker-Tag und dergleichen, und für eine gute Maßnahme, lass mich noch eine andere Sache, die oft vernachlässigt hat auf Websites in diesen Tagen: Lasst uns einen gewissen beschreibenden Text zu diesem Bild für Menschen, die auf einem mobilen Gerät stehen und daher möglicherweise nicht in der Lage sein, um dieses Bild sehr schnell downloaden, für Menschen, die blind sind und möglicherweise nicht in der Lage sein, um das Bild zu sehen aber sie könnten einen Screenreader, die ihnen sagen können, was das Bild ist. Und das zu tun, gibt es ein weiteres Attribut für Image-Tags als alt, für einen alternativen Text. Und was kann ich hier tun müssen, ist zu sagen, 'Dies ist eine quick brown fox ". So dass selbst wenn der menschliche nicht sehen kann das Bild auf dem Bildschirm, er oder sie zumindest hören, wie bei manchen Stück Software, was ist eigentlich da auf dem Bildschirm. 

Das wird sich nicht ändern, die Ästhetik der Seite aber es ist sicherlich eine gute Übung für Benutzer. Alle Rechte, lassen wir diese Web-Seite in seiner jetzigen Form, aber lasst uns sehen, ob wir jetzt nicht vorstellen kann einige bessere Ansätze zur schreibe diese Web-Seiten, einige Lektionen, die gehen, um uns gut auf unseren Seiten mehr und mehr komplexen dienen sollen. Was wir nicht tun in den nächsten Wochen wird Sie durch alle der mehreren Dutzend HTML-Tags, dass es gehen. Viel im Scratch zurück wie in Woche 0, wird es wahrscheinlich genügen, eine High-Level-Überblick über einige der Konzepte geben, eine schnelle Tour durch einige der Blöcke waren Sie wahrscheinlich in der Lage, ziemlich bequem, um auf eigene Faust zu navigieren, die verschiedenen Puzzleteile. Und das wird wieder geschehen in HTML, most likely, wobei es gibt reichlich Ressourcen auf dem Web, dass wir Sie bei Punkt, verschiedenen Lehrbüchern, wenn Sie ein Lehrbuch lesen möchten, , der Sie durch all die verschiedenen Dinge, die Sie mit HTML zu tun laufen können, aber wirklich, haben wir bisher in HTML sehen die meisten der grundlegenden Konzepte. Wir haben den Begriff des Tags geöffnet, wobei Tags geschlossen. Einige Tags, die sowohl geöffnet und geschlossen werden in dem Sinne, dass sie leer sind, es sollte nichts im Inneren von ihnen sein wie ein Bild-Tag oder einen Zeilenumbruch, die einfach da sind. Wir haben auch schon bei der Vorstellung eines Attributs, wie alt oder Quelle. Beachten Sie, dass diese Worte neigen, durch Konvention, kurz und prägnant. 

Wir haben keine Wahl mehr, was diese Dinge genannt werden, jemanden, der HTML erfunden kam mit diesen Namen. So müssen Sie nur noch zu starten, zu wissen oder diese nachschlagen, wann immer Sie sie brauchen, Was sind die Namen für diese Tags und Attributen. Im Fall dieser Attribute Attribute generell das Verhalten von einigen tag. In diesem Fall, sagt die Quelle-Attribut des Bildes tag was die Quelle des Bildes sein sollte. Das href-Attribut weist den Anker-Tag, was es eigentlich zu verknüpfen. Aber in Bezug auf die Struktur von einer Web-Seite, obwohl Facebook und Google und die aussehen wie ein komplettes Chaos unter der Haube auf den ersten Blick, wenn man durch sie zu lesen beginnen mehr methodisch, sie alle folgen dieser, Basismaterial Struktur. Aber können wir die Stilisierung von diesen Dingen. Also lassen Sie mich einige Beispiele, die ich im Voraus vorbereitet gehen. Lassen Sie mich gehen Sie vor und kopieren Sie sie aus einem anderen Ordner hier und legte sie in dieses Verzeichnis. Im Vorfeld, was ich tat, war bereiten ein paar Dateien: search0, search1, search2 und search3 und 4. Lassen Sie mich gehen Sie vor und eröffnen das erste dieser Dateien, und lasst uns sehen, ob wir nicht anfangen, unsere eigene Suchmaschine erstellen. An der Spitze dieser Datei, wie es normalerweise der Fall in der Klasse, nur ein paar Kommentare. In HTML, aber die Mittel, mit denen Sie beginnen einen Kommentar ist <-! und dann bist du im Inneren eines Kommentars, ein mehrzeiliger Kommentar. Wenn Sie bereit sind, diesen Kommentar zu stoppen sind, können Sie ->. Also alles oben in blau ist nur ein Kommentar. 

Dies ist meine Doctype-Deklaration, die wieder Sie können einfach kopieren und fügen Sie den Glauben, für jetzt. Dies nur teilt dem Browser mit, 'Hier kommt einige HTML 5. Darunter on line 14, ist die erste von meiner eigentlichen Tags, und das sagt nur, wie bisher, hier kommt etwas HTML, hier kommt der Kopf auf meiner Seite, hier kommt der Titel, und dann im Umkehrschluss, dass es für den Titel, das ist es für den Kopf. Hier nun kommt der Körper meiner Seite. So ein paar neue Tags Jetzt: h1 steht für die Rubrik 1. Es ist eine Tradition in HTML für viele Jahre zurück der mit unterschiedlichen Größen von Text. Und wieder in den Tag, bedeutete jeder, in der Regel, gerade groß und fett. Aber es gibt auch h2, die groß, aber nicht ganz so groß und fett ist. Es gibt h3, welche Art von ist groß, aber nicht annähernd so groß und fett, und so weiter, den ganzen Weg hinunter bis h6. In diesen Tagen, obwohl, h1, h2 und h3 wirklich gemeint mehr semantische Bedeutung sie haben, wobei h1 ist wirklich eine Überschrift: Die Überschrift einer Web-Seite, die Überschrift einer Spalte oder so etwas Text. Also habe ich bewusst gesagt h1 CS50 Suche> h1 um specifiy, dass dies wirklich die Überschrift, der Titel meiner Seite. Nicht der Titel in der Titelleiste Sinne aber der Titel, die Sie tatsächlich in der Web-Seite selbst zu sehen, in den Körper. Nun, können Sie wahrscheinlich erraten, was es ist, obwohl wir haben ein paar neue Stücke der Syntax. Dies ist eine Form. So das Web richtig interessant wenn Websites Eingabe nehmen von Benutzern. In dieser Klasse, in dem Problem auf Web-Programmierung eingestellt, wir werden nicht auf eine Website, per se zu machen, mit statischem Inhalt, die Fotos, die Sie aufgenommen haben zeigt, oder ist dies meinen Lebenslauf, und die Dinge um mich, weil diese Dinge sind relativ einfach zusammen zu stellen. Es ist schwer, die Dinge schön auf dem Web, aber zumindest das Aufstellen von Inhalten ist ziemlich trivial. Aber die Dinge wirklich interessant, wenn jemand Ihre Website besuchen und Input und kann Formulare ausfüllen, können abhaken Checkboxen und können mit Ihrer Website interagieren. Und in der Tat, wahrscheinlich jede Website die Sie interessieren in diesen Tagen, in jedem Detail, ist irgendwie interaktiv. Facebook, Google und dergleichen, die Benutzereingaben zu nehmen und angepasste Ausgabe. 

Also fangen wir das jetzt tun. Let Übergang jetzt aus nur mit HTML für Markup von statischen Inhalten als vielmehr eine Lieferung Mechanismus für dynamische Inhalte. Und auf dieses Ziel wollen wir die Umsetzung unserer eigenen Suchmaschine. Lasst es wie folgt. Hier ist die Form-Tag. Das action-Attribut gibt an, dass, wenn der Benutzer füllt dieses Formular mit ihrer Tastatur, wird es zu dieser URL hier eingereicht werden. Also ich bin Art von Betrug. Es wird uns ein wenig länger dauern als eine Klasse, die ganze Suchmaschine implementieren, so dass wir nur tun das vordere Ende, so zu sprechen. Wir tun das Teil, das den Benutzer suchen können, und wir werden von punt Google sortieren der schwierige Teil des Findens Suchergebnissen aber gesagt, ich werde die Google-Web-Server sprechen mit einer von zwei sehr beliebte Methoden. Einer ist zu bekommen, eine andere, dass wir schließlich sehen, dass Post, obwohl es andere, die weniger häufig verwendet werden. So bekommen nur beschwört die Idee, ich einige Inhalte erhalten möchten, bekommen einige Suchergebnisse. Dies können Sie vielleicht erraten, was dieser tut. Dies ist eine Art von Input, ist es in der Tat, werde wie ein Textfeld suchen, und der Name des betreffenden Eingang, der Name dieser Variablen, sozusagen wird für die Abfrage durch Konvention q sein. Und wieder ist die Art von diesem Eingang nicht zu einem Kontrollkästchen sein; es wird nicht ein Menü sein, es geht um ein Textfeld sein durch dieses Attribut hier, und dieses Textfeld bezeichnet, wie ein Zeilenumbruch, ist entweder da oder nicht. So haben wir ein leeres Element mit dem Schrägstrich innerhalb dieser tag. Dann werde ich einen Zeilenumbruch gesetzt, und Sie können vielleicht erraten, was dieser tun wird. Dies ist eine andere Art von Form-Eingang. 

Dieser geht für die Einreichung des Form verwendet werden. Es wird also auf die große Taste, die der Benutzer klicken kann, um das Formular abschicken zu sein, und das Etikett auf diese Schaltfläche wird sein 'CS50 suchen. " Close Form, engen Körperkontakt, in der Nähe HTML. Lasst uns sehen, was wir in der Form von dieser Web-Seite zu haben. Also lassen Sie mich meinen Browser gehen, lass mich gehen, noch auf lokalen. Dies ist immer noch index.html, so dass, wenn ich diese Datei mit dem Namen search0 sehen wollen, Ich kann einfach tun / search0.html geben - und die erste meine Fehler. Was ist los? Ich klar nicht über die Berechtigung Zugriff auf diese Datei, aus irgendeinem Grund. Aber das ist, denn anders als die Arbeit, die wir bisher gemacht haben in C, wo die Programme, die Sie schreiben, sind davon ausgegangen, dass lauffähige von Ihnen, ausführbare von Ihnen, das ist nicht wirklich der Fall auf dem Web, wobei manchmal möchten Sie vielleicht auf Dateien auf einem Server zu erstellen, aber Sie wollen nicht die ganze Welt in der Lage sein, sie zu sehen. Vielmehr wollen sie die Welt um einige Dateien zu sehen andere aber nicht, nur für die Privatsphäre willen. Es ist also mehr eine Opt-in-Basis, wenn Sie die Dinge auf dem Web. Und so lassen Sie mich eigentlich ls hier und Sie sehen die Dateien, die ich haben, aber daran erinnern, dass, wenn ich ls-l für lange, Ich werde eine längere Liste, die mir einige weitere Details zu diesen Dateien das sind nun wirklich, zum ersten Mal für uns relevanten. Beachten Sie, dass auf der rechten Seite sind die Namen meiner Dateien, und dann der Zeitpunkt, an dem sie zuletzt geändert wurden oder kopiert werden. Diese Zahl ist hier, was? Erinnern Sie sich? Die Größe in Bytes, wie groß die Datei ist. 

So scheine ich eine Art von logo hier, die größer als alle anderen Dateien ist zu haben. Dies ist, wer ich bin, das ist, was ich bin und welche Gruppe ich bin in. Aber dann, als hier auf der linken Seite ist ein bisschen kryptisch Sequenz, und wir unterhielten uns, glaube ich, kurz über das in der Vergangenheit, aber das hat mit Berechtigungen zu tun. Und selbst wenn es das ist ein wenig verschwommen, RW bedeutet wahrscheinlich, lesen und schreiben. So stellt sich heraus, dass diese Striche verschiedene Sätze von Berechtigungen bezeichnen für verschiedene Menschen. Und das Muster ist, im Wesentlichen wie folgt. Wenn Sie eine Sequenz von Strichen hier sehen, sehen sie wie folgt. Es ist ein Strich, dann gibt es drei weitere Striche, dann gibt es noch drei, dann gibt es drei weitere. Die erste ist entweder ein Bindestrich oder es ad für Verzeichnis. So dass man ziemlich einfach. Wenn es ein Ordner ist, ist es d sagt, ansonsten ist es ein Bindestrich. Es gibt ein paar andere Fälle, aber jetzt werden wir nur über Dateien und Verzeichnisse kümmern. Diese nächsten drei Striche - und ich habe künstlich die Räume eingefügt. Sie waren offensichtlich nicht da, wenn wir sie sahen vor einem Augenblick. Dies sind die Eigentümer der Datei die Berechtigungen, und aus einem zweiten her, dass es gelesen wurde und schreiben zu erinnern. Das war, weil ich, wie die Person, die diese Datei erstellt vor einem Augenblick, Ich, nur standardmäßig auf einem Linux-Computer die Möglichkeit haben, weiterhin das Lesen und Schreiben die Datei. 

So das Betriebssystem gibt mir RW ​​automatisch. Die mittleren beziehen sich auf meiner Fraktion, daß von Studenten, das ist eine Art von Sinn auf das Gerät, weil ich die einzige Person, die das Gerät bin. So lassen Sie mich nur winken meine Hände an, dass für den Moment. Aber die letzten sind die wichtigsten für das Web. Dies ist allen anderen in der Welt, und die Tatsache, dass es das ist --- bedeutet, dass niemand sonst in der Welt hat alle Berechtigungen auf diese Datei. Eindeutig ein Problem, also muss ich dieses Problem beheben by irgendwie gibt der Welt, was? Lesen & Schreiben? Das ist wahrscheinlich dumm, nicht wahr? Ich glaube nicht, dass jemand auf dem Web zu gehen, um meine Seite zu besuchen und irgendwie ändern Sie die Datei, obwohl sie eigentlich nicht mit einer HTML-Datei, aber nur im Prinzip, wahrscheinlich nur wollen, dass sie in der Lage sein, es zu lesen. Was bedeutet es, sie zu lesen? Es bedeutet nicht, sie gehen über die eigentlichen HTML kümmern, aber der Browser muss in der Lage, diese Auszeichnungssprache zu analysieren, oben nach unten, von links nach rechts. So jemand auf der Web muss in der Lage sein, es zu lesen, so dass ich nur minimal benötigen, um ihm r. Ich kann dies in ein paar verschiedene Möglichkeiten zu tun, aber vielleicht die einfachste ist, diesen Befehl hier laufen. Chmod Änderungsmodus, dann a + r, so dass alle, jeder in der Welt + lesen, und dann den Namen der Datei, search0.html. 

Nun, wenn ich ls-l wieder tun, feststellen, dass die Datei geändert hat, und in der Tat, ich habe auf r für jedermann geworden. Ich habe auch drehte sie auf für meine Gruppe, aber das ist in Ordnung, denn wenn ich in eingeschaltet für alle, ist meine Fraktion eine Teilmenge davon. Also das ist auch in Ordnung. Dies bedeutet nur, der Computer ist es nun lesbar. Nun lassen Sie mich zurück zu meinem Browser zu gehen, klicken Sie auf nachladen. Ah-ha. Wir haben jetzt CS50 Search. Ziemlich scheußlichen Suchmaschine - Ich habe in einem kleinen künstlich vergrößert. Aber lasst uns sehen, ob es wirklich funktioniert. Lassen Sie mich zunächst tun, eine schnelle Plausibilitätsprüfung, lass mich kontrollieren klicken und Quelltext der Seite. Beachten Sie, dass innerhalb von Chrome wir jetzt sehen, das gleiche HTML, dass ich selbst erstellt. Hier nicht verwirren lassen, though. Ich kann nicht gestartet Änderung des Codes hier da der Browser eine schreibgeschützte Ansicht dieses Codes. Der Browser hat nur lokale Host für eine Datei namens search0.html gefragt. Es ist jetzt reiner Zufall, dass das Gerät zufällig auf dem gleichen Computer wie mein Browser sein. Ich konnte nur noch, äquivalent, in www.facebook.com/search0.html getippt, und wenn Facebook hatte eine Datei mit dem Namen, dass würde ich dann sehen werden ihre HTML. Und natürlich kann ich nicht ändern Sie die Datei, die zurück kommt von Facebook, entweder. So, jetzt sind wir eine Art verwischen die Grenzen. Das Gerät ist sowohl ein Server, serviert Web-Seiten, aber es ist auch ein Client in dem Sinne, dass ich mit einem Browser tatsächlich auf diesem Server zu sprechen. Also lasst uns sehen, ob meine Google-Suchmaschine funktioniert. Lassen Sie mich gehen Sie vor und suchen quick brown fox, geben. Und voila, ich habe jetzt meine eigene Suchmaschine. 

Aber wie funktioniert das? Bisschen weit hergeholt, aber - und jetzt können Sie nicht sehen, genau den Teil, der von Interesse ist. Beachten Sie, was passiert. Beachten Sie die URL. Es stellt sich heraus, dass diese Methode, genannt zu bekommen, ist super-einfach. Wenn Sie in einem Formular angeben, dass Sie 'get' resultiert aus einem Server möchten, was es tun werden, ist zu nehmen, was Sie in das Formular eingegeben und legen Sie sie in der URL. Es wird zu standardisieren, wie es in der URL wird genommen wie folgt. Beachten Sie, dass dies die URL, die den Wert meiner action-Attribut war und ist. Das ist, wo ich das Formular am Ende wollte. Doch dann bemerken diese Fragezeichen. Dies ist eine Konvention über das Web, wodurch Benutzer Input liefern auf eine Website, fügen Sie die URL ein Fragezeichen, und dann haben Sie eine ganze Reihe von Schlüssel-Wert-Paaren. Der Name einer Taste, sonst als ein Parameter in der Web bekannt, dann das gleiche Vorzeichen haben, dann haben Sie den Wert dieses Parameters. So ist es im Wesentlichen eine variable Namen und ein variabler Wert, Aber diejenigen Variablen Namen und Werte kamen aus dem HTML-Formular. Warum sind die Pluspunkte gibt, denken Sie? Weil ich nicht geben + zwischen meine Worte. [Student, unverständlich] >> Ja, es ist nur für den Abstand. Quoten sind, wenn Sie eine URL gesehen habe, es gibt nie irgendwelche Leerzeichen enthalten, wenn auch nur, weil wenn es gab, konnte man nicht wirklich kopieren und einfügen in eine IM oder in einer E-Mail, weil sie brechen würde. Sie wollen, dass die ganze Sache ein zusammenhängende Kette von Zeichen sein. 

So dass der Browser ist klug genug zu erkennen, uh-uh. Nicht gerade einen Raum gibt. Lassen Sie mich codieren den Raum in einigen Standard-Weg. Einer von den Konventionen dafür ist, um den Browser haben automatisch setzen ein +, wo Sie sonst ein Leerzeichen ein. So, jetzt mitgeteilt hat Google schon Art von Benutzer-freundlich. Ich sicherlich nicht schaffen diese Web-Seite, aber sie haben ihre eigenen Textfeld vorbelegt mit, was genau tippte ich in. Angenommen, ich möchte für etwas anderes zu suchen, wie ein fauler Hund. Ich kann nur geben Sie diese hier re-search. Beachten Sie, dass die URL up ändert hier dann aber feststellen, dass ich tatsächlich für alles, was ich will suchen nur durch das Verständnis, wie URLs Arbeit. Was ich tun konnte faule Katze, geben, und jetzt merke ich bin gerade sehr faul - sollten wir? Ich fühle mich wie wir sollten. Ich bekomme eine sehr faule Katze. Gut. Dies ist eines der dümmsten Dinge, die wir getan haben. Aber das ist eine faule Katze. Jedenfalls, was ist der Schlüssel zum Mitnehmen hier? Jetzt sind wir eine Art spielen in der Welt der HTTP. HTML ist gerade diese Markup-Sprache, offene tag, in der Nähe tag, das sagt ein Browser, wie Inhalte auf einer Webseite zu machen. Aber wenn Sie beginnen die Datenübertragung über das Internet zwischen Web-Browser und Server, das ist, wo dieses Protokoll bekannt als HyperText Transfer Protocol übernimmt. Dies ist die Art der menschlichen Konvention; wenn Sam und ich schüttelten sich die Hände am Montag, Starten einer Verbindung und Abbau einer Verbindung, gleiche Idee hier. Wie werden die Google-Ergebnisse kommen zu mir zurück? Wie wird mein Formularübermittlung werde Google? Nun, von den anderen Tag daran erinnern, dass das, was wirklich vor sich geht unter der Haube, wenn Sie fordern eine Web-Seite, Ihr Browser sendet eine etwas kryptische-Nachricht wie GET / HTTP/1.1 für die Standard-Homepage. 

Oder, in diesem Fall, weil ich ausdrücklich darum gebeten früheren search0.html, diese dann wäre das etwas-kryptische Botschaft dass mein Browser sendet, um das Gerät. Oder, in diesem Fall von Google, was ist tatsächlich gesendet ist eine Aufforderung an / search, und dann? q = faule Katze, die mit einem Plus gibt. So diese Meldung, dass ich, der Mensch, bin nie eingeben, wird aber von meinem Browser gesendet wird, ist dies, wie HTTP passiert. Dies ist das Äquivalent unserer nachdem die Hände geschüttelt. Dies ist der Wunsch und der Server ist über eine Antwort zu senden. Werfen wir also einen Blick auf diese unter der Haube. Nach wie vor können wir Erschließung dieses Spezialgebiet in einem Browser. Zeige Seite untersuchen Elemente. So unter Inspect Element, bemerken, dass, was in Chrome passiert, und IE und Firefox haben ähnliche Mechanismen, wir haben diese Entwickler-Tools für uns zugänglich. Normale Menschen nicht diese Registerkarten verwenden. Aber wir, jetzt sind daran interessiert, was los ist unter der Haube auf der Netzwerkebene. Also, wenn ich ziehen Sie die Netzwerk-Ebene hier Lassen Sie mich gehen Sie vor und erweitern dieses Fenster eröffnen Diesen Eintrag hier, und schauen Sie sich die Header. Also, was passiert, wenn ich eine Datei von einem Webserver an ist mein Browser sendet eine ganze Reihe von Dingen. Und lassen Sie mich sehen Quelle. So unter Request-Header, Und dies ist nur Chrome zeigt mir etwas Diagnoseausgang, wie eine Art Debugger von einer Art, feststellen, dass das, was ich hier hervorgehoben ist genau das, was Chrome wird an den Server senden, um eine Datei namens search0.html beantragen. Es ist bezeichnend, den Server, was sie denkt ihr Name ist, Dank dieser Host Doppelpunkt Feld, dann gibt es einige ziemlich esoterischen Zeug hier, wie etwas mit Datum und Uhrzeit zu tun, etwas mit den Sprachen, die der Browser versteht tun, aber die wirklich wichtigen Linien sind diese ersten beiden hier. 

Was macht der Server reagieren mit? Nun, wenn wir nach unten scrollen Sie hier und sehen Quelle dieser Sache, feststellen, dass der Server hat mit einem etwas kryptische Nachricht reagierte sowie, 304 nicht geändert. Das ist ein wenig seltsam, laß mich tatsächlich versuchen, dieses Problem zu beheben. Lassen Sie mich die Umschalttaste gedrückt halten und klicken Sie laden hier um den Browser zu zwingen, um tatsächlich diese Anforderung für die erste Zeit. Dann lassen Sie mich zu vergrößern, und wir werden nun sehen, dass die Antwort des Servers, weil ich Verschiebung stattfindet, ist 200 OK. So haben Sie wahrscheinlich noch nie die Zahl 200 zu sehen Im Rahmen des Web, aber welche Zahlen Sie haben manchmal unerwartet von einem Server gesehen? 404, Datei nicht gefunden, 403, verboten; 500, server error. So gibt es diese numerischen Codes, dass die Welt setzt im Web um Fehler, wie C-Funktionen bedeuten, können Fehler zurückgeben und die wichtigsten können Exit-Codes zurück. 200, obwohl man nur selten zu sehen, weil es bedeutet alles ist gut. Und 304 werden Sie wahrscheinlich nie sehen, weil, was es bedeutet wird? Das hat nichts - lassen Sie uns sehen, ob wir dies noch einmal zu simulieren - Oh, jetzt ist es nicht zusammen. 304 sagte nicht geändert warum wurde der Server selbst reagiert? Nun, für Effizienz, ein Web-Server automatisch für Sie, wenn die Datei nicht geändert hat, wird es nicht erneut die gesamte HTML-Datei. Es wird nur sagen, der Browser es nicht geändert hat. Verwenden Sie einfach die Kopie, die Sie bereits haben. Also gibt es diese Vorstellung von Caching auf dem Web für Leistung, so dass Sie verschwenden keine Zeit und Abfall Bandbreite Herunterladen von Dateien wieder und wieder unnötig. 

Aber diese Web-Seite, jetzt war super-einfach, und zeigte mir dann nur den HTML-Code kam zurück. Lasst uns tatsächlich die Registerkarte Netzwerk nun eine Google-Suche, wie quick brown fox tun. Lassen Sie mich dann auf CS50 suchen, und jetzt, in der unteren bemerken, die hier eine ganze Menge Zeug kam zurück denn wenn ich unter einer echten Website wie Google.com, sie haben Bilder, sie Text haben, haben sie eine Sprache namens JavaScript dort. Also jede Zeile in dieser Tabelle hier unten stellt etwas dar, Google ausspucken als Antwort auf meine einzigen Anfrage. Der, den ich kümmern uns um, aber ist diese erste. Und wenn ich auf die Suche gehen, Anfrage, klicken Sie auf Quelle hier, feststellen, dass in der Tat die kryptische Nachricht, dass mein Browser gesendet Google war diese beiden Linien hier, gefolgt von einigen obskuren Informationen hier unten, die wir jetzt zu ignorieren werde. Beachten Sie aber auch, was Chrome ist sehr praktisch mit, es ist auch zeigt mir die Query-String, leider wurde Also anstatt zeigen mir das, was war buchstäblich geschickt, wenn ich es sehen decodiert, Chrome, nur für Debugging-Zwecke für Entwickler wie uns, es ist nur zeigt mir einen Menschen-freundliche Version der - das ist nicht, wie Sie fox buchstabieren, anscheinend. Ich bin nur zu bemerken, das jetzt - aber es zeigt, was ich anscheinend getippt. Unterdessen ist die Antwort, die zurück von dem Server kam wieder 200 OK. Aber in dieser Antwort enthaltenen natürlich wenn wir tatsächlich sehen der Seite HTML - sorry, das ist ein wenig Tastenkombination schief heute verschwunden. 

Ich werde mit dieser später beschäftigen. Also, wenn wir tatsächlich sehen der Seite Quelle, was ich tun kann, hier unten, indem Sie auf Antwort, Dies ist, was tatsächlich wieder ausspucken, zusätzlich zu dieser kryptischen 200 OK-Nachricht vom Server. Ein wenig kryptisch, aber wo ist all dies aus? Nun, lasst uns eine andere Sache hier. Ein weiteres etwas kryptisch-Befehl aber dieses ist irgendwie ordentlich, dass es zeigt uns genau, was los ist unter der Haube. Also habe ich wieder auf meinem Mac bin hier, habe ich verbunden über ein Programm namens SSH, Secure Shell, auf einen anderen Server weil die meisten der Harvard-Computer den Befehl blockieren wir zur Neige weil es diesen Befehl auf einigen Servern als traceroute das Ihnen erlaubt, um die Strecke zwischen den Punkten A und B zu verfolgen, und damit weit wir vollständig unter selbstverständlich dass ich in Google.com eingeben und irgendwie Daten zurück von der Mitte über dem Land oder in der Mitte der ganzen Welt. Mit traceroute können wir tatsächlich in ein wenig tiefer tauchen , wie das Internet funktioniert, und zu sehen, was los ist unter der Haube. So lassen Sie uns fortfahren und willkürlich verfolgen einen Weg zu, sagen wir, Stanford.edu, das ist im ganzen Land, und drücken Sie Enter. Dieser Befehl kann super-schnell oder super-langsame, aber was wir jetzt sehen, Zeile für Zeile, ist jeder der Schritte oder Sprünge zwischen uns und Palo Alto, oder Stanford, wo sie ihren Web-Server. Also, was bedeutet jede dieser Linien stellen konkret, obwohl? Ein Stück von Jargon aus dem Internet? [Student, unverständlich] >> Was ist das? [Student, unverständlich] >> Oh, so gibt es Zeiten, aber was bedeutet jede Zeile - was ich von Hop bedeuten? 

Nun, es gibt diese Dinge im Internet abgerufen Routern. Und Router, wie der Name schon vermuten lässt, Routeninformationen von Punkt A nach Punkt b. Aber es gibt einige Punkte, über a und b. Es gibt c und d und e und f zwischen Zeile 1, was passiert mit meinem Computer die IP-Adresse, oder meine numerische Adresse, die eindeutig identifiziert meinem Computer, und Schritt 15, das ist eigentlich das sechste Web-Server, offenbar dem ich daraus folgern, oder Version 6 ihrer Web-Server an der Stanford. Aber was ist eine Art ordentlich ist, können wir sehen den Weg dass meine 0 und 1 ist von meinem Computer unter den Stanford. So Schritt 1 ist meine eigene Computer-Adresse. Jeder Computer im Internet hat eine eindeutige Kennung, die wie folgt aussieht. Number.number.number.number. Irgendwo auf diesem Campus, wahrscheinlich im Science Center, wird ein Router namens Core Gateway-2-te83, was immer das bedeutet, so ist dies ein großer Phantasie Harvard Router, einen Großteil ihrer Verkehrswege. Hier ist ein weiteres der Harvard-Router, ist dies ein Border Gateway, border Bedeutung ist es wahrscheinlich an der Peripherie des Campus irgendwo. Dann gibt es nox ein, Reihe 4, die Northern Crossroads ist, was ein großer ISP, Internet Service Provider, dass Orte wie Harvard Anschluss von bis zu. Aber dann wird es ein wenig interessant in Zeile 6. Wo sind meine Bits alle auf einmal? Kansas. Die Welt hat eine Gewohnheit, mit Flughafen-Codes in einer Menge von diesen Dingen, oder zumindest Abkürzungen für Staaten oder Städten so wie es aussieht, in nur 60 ms, ein Paket von Informationen, ist 0 und 1 von meinem Laptop habe den ganzen Weg nach Kansas, und wieder, in 60 ms. 

Darüber hinaus wurde nach Kansas, nahmen sie eine Tour durch Houston, wahrscheinlich, wie durch den Namen des Servers vorgeschlagen. So wie ein Server im Internet muss eine numerische Adresse, es kann auch optional einen etwas menschenfreundliche-Adresse, dass der Mensch kam mit. Nun, in Schritt 8, wissen wir nicht, was das ist. Manchmal Router nur irgendwie ignorieren sie dich, und sie einfach nicht die Fragen beantworten, so ist das in Ordnung. Der eine nach Schritt 8 ist offenbar, wo? L.A. Beachten Sie in nur 78 ms, was bringt uns Menschen wie 6 + Stunden physisch tun, nimmt Pakete von Informationen über das Internet 78 ms, so weit zu fahren. Schritt 10 ist in LA als gut, und Schritt 11 scheint nach Norden gegangen, bis in der Nähe Stanford. Dies ist ihre Grenze Router oder Router Grenze. Ein paar Schritte an der Stanford, die uns zu ignorieren sind, und schließlich erreichen wir den Web-Server in nur 87 ms. Nun, all diese Zahlen, als beiseite, nur sagen, wie lange es Daten von mir bekommen hat Jedem dieser Router, und es ist nicht kumulativ. Was dieses Programm nicht ist, wird zuerst eine Nachricht sendet, im Wesentlichen zu dem ersten Router. Dann ein an den zweiten Router; dann zu dem dritten Router, Messen jeder Zeit. Also in der Theorie, werden diese Zeiten zu wachsen oder zumindest sehr nahe beieinander, und in der Tat sind diejenigen, die hier auf dem Campus super-klein. Sobald Sie gehen im ganzen Land beginnen, dauert es Daten ein wenig länger zu reisen, näher an 100 ms, geben oder nehmen. Aber gehen wir in die andere Richtung jetzt. Wie wäre es mit der Cambridge University in Großbritannien? Lassen Sie mich laufen anstatt traceroute von www.cam für Cambridge, . Ac für die akademischen,. Uk, und drücken Sie hier eingeben. Das war verdammt schnell. Meine Daten ging buchstäblich in Cambridge, England, in diesem Bruchteil einer Sekunde Zeit. 

Also mal sehen, den Weg, es dauerte. Harvard, Harvard, Harvard, Northern Crossroads, was ist ein ISP, und dann ist das Northern Crossroads, und dann bam. Was zwischen den Schritten 6 und 7,-Router 6 und 7? Der Atlantische Ozean. Und wir folgern dies aus der Tatsache, dass wir gehen von 20 ms hier 80 ms hier. So etwas dauerte 60 ms, geben oder nehmen, um über. Und das war wohl ein großer Körper von Wasser. Was geht danach? Nun, hier sind wir in London, nur 88 ms später. More London, mehr London, nicht sicher, wo das ist, aber wir nehmen an, es ist außerhalb von London, Cambridge hier, und schließlich haben wir - buchstäblich, University of Cambridge . Something.net, und dann, endlich, in Zeile 16, ihre Web-Server wird offenbar als Scorpius unter der Haube, auch wenn wir es wissen, wie www. Kind of mind-blowing, denke ich. Das erste Mal, dass ich das tat, es völlig blies meinen Verstand. Leider sperrt Harvard diese Art von Verkehr, typischerweise auf dem Netzwerk. So können Sie nicht tun, es ist super leicht. Zu realisieren, allerdings ist dies hier möglich. Gut. Nehmen wir unsere 5-minütige Pause hier. Wir kommen zurück und tauchen in tieferen. So sind wir wieder zurück, und wir haben solche über in ein paar verschiedene Richtungen hier schlenderte. Lassen Sie uns also genau das, was geht schon hier zusammenzufassen. Wir begannen das Gespräch reden über diese Sprache namens HTML. Auch nicht eine Programmiersprache. Es ist nur eine Markup-Sprache das ist vor allem um Ästhetik und Strukturierung von Inhalten in Form von einer Webseite. Aber HTML, muss daher eine Art von Mechanismus für Reisen zwischen Web-Browser und Server. HTML daher Art von Fahrten auf dieser anderen Sprache, oder genauer, ein Protokoll, wie HTTP bekannt. 

Und HTTP, wie wir es bisher gesehen, ist eine Art analog zu diesem menschlichen Konvention Händeschütteln. Wenn ein Browser eine Seite von einem Server anfordern will, sendet er, dass "get" Anfrage vom Browser zum Server, und dann der Server antwortet mit einer Nummer wie 200, ist alles okay, sowie der HTML oder eine schlechte Zahl wie 404, Datei nicht gefunden. Aber mittlerweile ist HTTP selbst nicht das Internet, per se. HTTP ist nur eine Dienstleistung, ein Merkmal des Internet ähnlich wie G-Chat ist ein weiterer Dienst, ähnlich wie E-Mail ist ein weiterer Service. Es gibt alle Arten von Dingen, die wir im Internet tun können. HTTP ist nur eine dieser Anwendungen. So auf der Oberseite - HTTP ist oben auf etwas anderes was wir nicht beim Namen zu nennen, könnten Sie nach Namen, TCP / IP gehört haben. So ist die Geschichte, die wir gerade gesagt, es dreht sich alles um wie Daten fährt von Punkt A nach Punkt B. Und in diesem Fall, sahen wir auf einem sehr niedrigen Niveau Router zu Router zu Router Router wie die Daten tatsächlich übertragen werden. Aber auf dem Weg, wird es verschiedene Hindernisse stoßen. Neben diesen Router, es gibt Dinge, genannt Firewalls auf dem Internet, und so Daten, wie dass wir gerade Übertragung von mir zu Stanford, von mir zu Cambridge, gesendet wird, auf dieser Ebene, rief etwas eine IP-Adresse. Wir sahen dies vor einem Augenblick, und eine IP-Adresse ist nur eine numerische Adresse der Form w.x.y.z, wo jeder von ihnen dazwischen ist, geben oder nehmen, 0 und 255, Sie können jedoch nicht ganz alle von diesen Zahlen. Aber jede dieser Platzhalter ist eine Zahl zwischen 0 und 255 annehmen. So eine IP-Adresse in diesen Tagen ist 32 Bit. 

Nun, das gibt uns, wie viele mögliche IP-Adressen in der Welt? Rund 4 Milliarden, weil jede Zeit, die wir in Potenzen von 2 Zählen sind den ganzen Weg bis zu 32 von etwas, das in der Regel gibt uns 4 Milliarden Euro. Also das ist eine Menge von IP-Adressen, aber vielleicht gelesen haben, oder Sie könnten nun in der Boulevardpresse bemerken, ein Druck in Richtung einer neuen Version des IP genannt IPV6. Momentan sind wir mit der Version 4. Es gibt wirklich nicht eine Version 5, sind wir nur springen Recht auf 6. Version 6 wird 128 Bit für IP-Adressen, die ausgeflippt ist riesig verwenden. Wir sollten nicht auslaufen seit geraumer Zeit jetzt, aber wir haben begonnen zu laufen aus Version 4 IP-Adressen, weil alle von uns haben nicht nur Dinge wie Laptops und Desktops Viele von uns haben Telefone, haben viele von uns anderen Geräten wie TiVo und dergleichen, die IP-Adressen haben sich. Harvard selbst hat Zehntausende von Computern. So ist die Welt wirklich läuft aus IP-Adressen, zumindest dieses Formular. So in den nächsten paar Jahren, werden Sie um die Adressen zu sehen auf Ihrem eigenen Computer wahrscheinlich langsam ändern da mehr und mehr Unternehmen und Hochschulen starten, um die neue Version zu unterstützen. Aber eine IP-Adresse ist nicht ausreichend für Computer ein, um Daten vom Computer b beantragen. Weil Computer b könnte ein Server sein, und einem Server, wie ich bereits erwähnt habe, tun können Bündel von Dingen. Es kann Webseiten hosten, können Sie eine E-Mail-Server, es kann ein Skype-Server sein, es kann ein G Chat-Server sein. 

All diese verschiedenen Dienste, die auf einem Server bereitgestellt werden kann könnten alle, physikalisch auf der gleichen Maschine sein. So dass zusätzlich zu IP-Adressen, hat die Welt Dinge genannt Ports auf dem Internet. Ein Port ist nur eine Zahl, so gibt es eine eindeutige Nummer für HTTP. Seine Zahl ist 80. HTTP verwendet auch Nummer 443, aber genauer gesagt, für verschlüsselte HTTPS. Wenn Sie die mal sehen, für eine sichere, das ist mit einer anderen Nummer. Es gibt auch andere Zahlen, wie 25, so genannte SMTP verwendet, ansonsten als E-Mail bekannt. Es gibt so etwas wie 22 für SSH, und es gibt eine ganze Reihe von anderen Ports gibt. Nun, wir Menschen nur selten sehen diese Zahlen. Jedoch, wenn Sie geben in einer Adresse wie http://www.facebook.com, Der Browser ist heimlich Einfügen 80, weil Sie mit HTTP sind. Wenn Sie stattdessen Typ HTTPS, es heimlich Einfügen 443. Und wir können irgendwie sehen diese manuell, wenn ich ziehen eine brower und http://www.facebook.com:80 gehen. Daher ausdrücklich zitiert nicht nur den Namen der Website aber der Hafen, dass ich zu sprechen möchten, und drücken Sie Enter. Beachten sie verschwindet, weil der Browser davon aus, oh, 80, werde ich es gar nicht erst die Mühe zeigen, dass für Sie. Aber der Grund dafür ist, dass, wenn ich wollte eigentlich jemand eine E-Mail zu senden, Ich wäre wirklich Senden, um sie auf Port 25, dass ist SMTP. Ein bisschen ein Simplifizierung, aber einige von euch haben Freunde die tatsächlich bei Facebook arbeiten, und sie, ähnlich, haben Server, die E-Mail erhalten. 

Jedes Mal, wenn Sie senden eine E-Mail, ist das, was gmail für Sie tun oder Outlook oder was auch immer Programm, das Sie verwenden, Es ist eine Art von heimlich Einsetzen diese Zahl als gut, 25, in diesem Fall. Es ist diese Kombination aus IP-Adresse und die Nummer eindeutig identifiziert ein Computer, auf dem Internet und ein bestimmter Dienst auf diesem Computer. Nun, natürlich haben die meisten von uns wahrscheinlich niemals manuell eine IP-Adresse eingegeben haben. Vielleicht haben Sie im Gerät, sondern in der realen Welt, nicht so viel. Warum haben wir nicht geben IP-Adressen in Browsern? Es würde funktionieren, in der Tat, wir können das sehen, lassen Sie mich Ihnen zeigen, ein anderer Befehl, der fast überall arbeiten, sollten auf Harvard-Campus auf einem Mac oder einem PC. Es ist das Kommando aufgerufen nslookup, Nameserver-Lookup. Wenn ich www.cnn.com aussehen, es stellt sich heraus, dass CNN hat - oh, interessant. CNN hat begonnen mit Amazon Web Services. Sie könnten von Cloud Computing, Amazon einer der großen Akteure im Cloud Computing wissen. Was ich gerade tat, war, sagte ich, "Gib mir die Adresse des CNN-Web-Server" aber es stellt sich heraus, dass der CNN-Web-Server von Amazon verwaltet wird, Amazon Web Services, deutet dies. Und die Adresse des Servers ist das hier. Also ich bin nicht sicher, ob dies funktionieren wird, weil sie nicht genutzt, um Amazon zu nutzen. Aber lassen Sie uns versuchen, diese; http:// IP-Adresse, geben, und - wird es funktionieren? Ja. Es wird funktionieren. Internet ist super-slow heute. Aber in einem Moment, sehen Sie einige Neuigkeiten Geschichte. Dort gehen wir. Bank of America ist verklagt. Gut. 

Dies liegt daran, diese IP-Adresse nur zufällig durch gleichbedeutend mit www.cnn.com. Natürlich wäre es schrecklich Marketing sein zu sagen, besuchen Sie uns im Web unter 50.112.94.127. Du würdest nie erinnern. So auch diese Tage, die Sie erinnern sich vielleicht an die Dinge wie 1-800-COLLECT oder Eselsbrücken die Welt kam mit für Telefonnummern. Welche, vor Handys, waren ziemlich schwer zu merken bis Sie konnte nur eingeben und vergessen Sie es. Also das Web, hat auch diese Konvention von Namen und IP-Adressen, und es sind diese Dinge gibt als DNS-Server, Domain-Namen-Systems-Server, die IP-Adressen in Namen und umgekehrt übersetzen. Also das ist, was passiert unter der Haube. Am Ende haben wir TCP / IP, das dies sehr low-level Protokoll das, wirklich, nur bekommt 0 und 1 ist über das Internet, und sie tut dies, indem sie in einer virtuellen Umschlag, wenn man so will, und das Schreiben auf der Außenseite des Umschlags die IP-Adresse des Ziel-als auch die numerische Portnummer der Dienst auf diesem Ziel, das sie sprechen will. Inzwischen auf dem Umschlag gibt es auch etwas bekannt als Absenderadresse das ist Ihre IP-Adresse, so dass, wenn CNN ein Paket von Informationen bekommt von Ihnen, öffnet dieses virtuellen Umschlag, sieht, dass Sie die Homepage möchten, sie weiß von dem Absender Teil dieser virtuellen Umschlag, den die HTML zurück zu senden. Werfen wir also einen Blick auf diese in ein wenig mehr Details. Dies ist von einer Firma namens Ericson, von ein paar Jahre zurück. Und sie nahmen einige Freiheiten mit, wie das Internet funktioniert tatsächlich, aber es zeichnet ein viel visuelles Bild als bloße Kreide hier oben. So gebe ich euch "A Bit des Internet." 

[Erzähler] Zum ersten Mal in der Geschichte, Mensch und Maschine arbeiten zusammen, einen Traum zu verwirklichen. Eine einigende Kraft, die keine geographischen Grenzen kennt. Ohne Rücksicht auf Rasse, Glauben oder Farbe. Eine neue Ära in der Kommunikation wirklich bringt Menschen zusammen. Dies ist Die Dawn of the Net. Wollen Sie wissen, wie es funktioniert? Klicken Sie hier, um Ihre Reise in die Net beginnen. Jetzt passiert genau das, was, wenn man auf den Link geklickt? Sie begannen einen Fluss von Informationen. Diese Information fährt nach unten in Ihren persönlichen Poststelle wo Herr IP-Pakete ist, kennzeichnet sie und sendet sie auf ihrem Weg. Jedes Paket wird in ihrer Größe begrenzt. Die Poststelle muss entscheiden, wie die Informationen teilen und wie es zu verpacken. Jetzt muss das Paket ein Etikett mit wichtigen Informationen wie Absenderadresse, Empfängeradresse, und dem Typ des Pakets ist. Da dieses bestimmte Paket wird in das Internet, es wird auch eine Adresse für den Proxy-Server, die eine spezielle Funktion, wie wir später sehen werden. Das Paket wird nun auf Ihrem lokalen Netzwerk oder LAN gestartet. Dieses Netzwerk wird verwendet, um alle lokalen Computer verbinden ' Router, Drucker, etc., für den Informationsaustausch innerhalb der physischen Mauern des Gebäudes. Das LAN ist ein ziemlich unkontrollierten Platz, und, leider, Unfälle können passieren. Die Autobahn im LAN und ist mit allen Arten von Informationen verpackt. Das sind IP-Pakete, Novell-Pakete, AppleTalk-Pakete. Sie sind gegen den Datenverkehr, wie üblich. Der lokale Router liest die Adresse und, falls erforderlich, hebt das Paket auf einem anderen Netzwerk. Ah, der Router. Ein Symbol der Kontrolle in einer scheinbar ungeordneten Welt. [Router murmelt und spricht zu sich selbst] 

[Erzähler] Da ist er, systematisch, gefühllos, methodisch, konservativ, und manchmal nicht ganz auf dem Laufenden. Aber wenigstens ist er genau, zum größten Teil. Da die Pakete den Router verlassen, machen sie ihren Weg in das Unternehmensnetzwerk Internet und Kopf für den Router einschalten. Etwas weniger als die Router, spielt der Router-Schalter schnell und lose mit IP-Paketen, Geschickt leitet sie auf ihrem Weg. Eine digitale "Pinball Wizard", wenn man so will. [Router Switch zu reden selbst] [Erzähler] Wie Pakete ihr Ziel erreichen, sie sind durch die Netzwerkschnittstelle aufgenommen, bereit, um die nächste Stufe gesendet werden. In diesem Fall der Proxy. Der Proxy wird von vielen Unternehmen als eine Art Mittelsmann eingesetzt Um zur Verringerung der Belastung der Internetverbindung und aus Gründen der Sicherheit, wie gut. Wie Sie sehen können, sind die Pakete alle verschiedenen Größen je nach deren Inhalt. Der Proxy öffnet das Paket und sieht für die Web-Adresse oder URL. Abhängig davon, ob die Adresse ist akzeptabel, das Paket wird an das Internet gesendet werden. Es gibt jedoch einige Adressen, die nicht mit der Zustimmung des Proxy nicht erfüllen. Das heißt, Unternehmen oder Management-Richtlinien. Diese werden zusammenfassend behandelt. Wir müssen nichts davon. Für diejenigen, die es machen, ist es auf der Straße wieder. 

Weiter oben, die Firewall. Die Unternehmens-Firewall dient zwei Zwecken. Es verhindert, dass einige ziemlich böse Dinge aus dem Internet kommen, um das Intranet, und es kann auch verhindern, dass sensible Unternehmensdaten davor in das Internet gesendet werden. Einmal durch die Firewall, nimmt ein Router das Paket und legt sie auf einen viel schmaleren Straße, oder die Bandbreite, wie wir sagen. Offensichtlich ist die Straße nicht breit genug, um sie alle zu nehmen. Nun fragen Sie sich vielleicht, was passiert mit all den Paketen, die es nicht schaffen auf dem Weg. Nun, wenn Herr IP keine Bestätigung dass ein Paket rechtzeitig empfangen wurde, Er schickt einfach einen Ersatz-Paket. Wir sind nun bereit, die Welt des Internets geben. Ein Spinnennetz von miteinander verbundenen Netzwerken, die unsere gesamten Globus umspannen. Hier etablieren Routern und Switches Verbindungen zwischen Netzwerken. Nun ist das Net ein ganz anderes Umfeld als finden Sie innerhalb der schützenden Mauern Ihrem LAN. Hier draußen ist es der Wilde Westen. Viel Platz, viele Möglichkeiten, viele Dinge zu erkunden und Orte zu gehen. Dank sehr wenig Kontrolle und Regulierung, neue Ideen zu finden fruchtbaren Boden, um den Umschlag ihrer Möglichkeiten zu schieben. Aber wegen dieser Freiheit, gewisse Gefahren lauern auch. Du wirst nie wissen, wann Sie das gefürchtete ping of death treffen werde, eine spezielle Version von einer normalen Anfrage ping, denen irgendein Idiot dachte, bis zu mess up ahnungslosen Gastgeber. Der Weg unserer Pakete nehmen kann über Satellit, Telefonleitungen, Wireless, oder sogar transoceanic Kabel. Sie haben nicht immer die schnellsten oder kürzesten Routen möglich, aber sie werden es irgendwann. Vielleicht ist das, warum es manchmal heißt "The World Wide Wait". Aber wenn alles reibungslos funktioniert, Sie können den Globus fünfmal Umgehung an der Tropfen einen Hut, buchstäblich. Und das alles für die Kosten für ein Ortsgespräch oder weniger. Nahe dem Ende unser Ziel, wir finden eine andere Firewall. 

Abhängig von Ihrer Perspektive als Datenpaket, die Firewall könnte eine Bastion der Sicherheit oder einem gefürchteten Gegner sein. Es hängt alles davon ab, welche Seite du stehst und was Ihre Absichten sind. Die Firewall ist so konzipiert, nur in den Paketen, die die Kriterien erfüllen zu lassen. Diese Firewall ist auf den Ports 80 und 25 in Betrieb. Alle Versuche, durch andere Häfen anzulaufen sind für Geschäftsreisende geschlossen. Port 25 wird für E-Mail-Pakete verwendet, während Port 80 ist der Eintritt für Pakete aus dem Internet an den Webserver. Innerhalb der Firewall, werden Pakete abgeschirmt gründlicher. Einige Pakete machen es leicht durch den Zoll, während andere schauen nur ein bisschen zweifelhaft. Jetzt ist die Firewall Offizier nicht leicht täuschen, beispielsweise wenn dieser Ping des Todes Paket an sich selbst als eine normale Ping-Paket verschleiern versucht. [Firewall-Offizier im Gespräch mit Paketen] [Erzähler] Für diese Pakete Glück genug, um es so weit zu machen, die Reise ist fast vorbei. Es ist nur ein Line-Up auf der Oberfläche bis in die Web-Server übernommen werden. Heutzutage kann ein Web-Server auf viele Dinge laufen, von einem Mainframe auf eine Web-Cam an den Computer auf Ihrem Schreibtisch. Warum nicht Ihrem Kühlschrank? Mit der richtigen Einstellung können Sie herausfinden, ob Sie das Zeug haben, für Chicken Cacciatore, oder wenn Sie einkaufen gehen. Denken Sie daran, dies ist der Beginn des Net. Fast alles ist möglich. Einer nach dem anderen werden die empfangenen Pakete, geöffnet und ausgepackt. Die Informationen, die sie enthalten, das heißt, Ihre Anfrage zu Informationen, auf dem Web-Server-Anwendung gesendet. Das Paket selbst ist Recycling-Papier, bereit, wieder verwendet werden, und mit Ihren angeforderten Informationen, adressiert und verschickt auf dem Weg zurück zu Ihnen. Zurück Vergangenheit die Firewall, Routern, und weiter durch das Internet. Zurück durch Firewall Ihres Unternehmens und auf Ihre Schnittstelle, bereit, Ihren Web-Browser mit der von Ihnen angeforderten Informationen zu liefern. Das heißt, der Film. Zufrieden mit ihren Bemühungen, und Vertrauen in die bessere Welt, unsere treuen Datenpakete reite selig in den Sonnenuntergang von einem anderen Tag, Wissen voll haben sie ihren Herren gut gedient. Nun, ist das nicht ein Happy End? [Malan] Okay, das ist genug. Wir sehen uns nächste Woche. [CS50.TV]