[Powered by Google Translate] [Week 7, Vervolg] [David J. Malan, Harvard University] [Dit is CS50.] [CS50.TV] Oke. Welcome Back. Dit is CS50, en dit is het einde van week 7. Dus een van die stomme kleine dingen die gaat rond het internet en we slurpte, en het moet nu een beetje geeky gevoel voor jou. Nou, het was leuker om deze man dan het was om jullie. Spreken van, nou, jongens, vandaag is Nate's verjaardag. Om u een idee van hoe goed Nate en ik zijn op web development op basis van klasse maandag en nu op deze basis, Ik dacht dat ik trek Nate's homepage, als je het nog niet gezien. Dit hier ia Nate's HTML. Dus zie zijn broncode als je wilt zien hoe dit te doen, en Nate, als we je vernederen even kort, het personeel heb je een beetje iets als je wilt om een ​​dessert te delen met een aantal van de kinderen in de klas hier. Als u wilt naar beneden te komen op. U allen toejuichen en zijn erg leuk, maar niemand is overal zitten in de buurt Nate, andere reden, dat back zone. Dus misschien kun je sommige mensen om deze te genieten met. Happy Birthday, Nate. 

Extra hellos: We hebben een paar clips toonde van onze CS50x studenten. Als je wilt zien wie er nog meer is in de wereld dat is volgende mee, dan kunt u terecht bij deze URL, waar Jozef, een van onze TFS, heeft samen een montage van soorten van iedereen die is het indienen van deze video's, onder wie Rick Astley. En als u door deze, het is echt heel inspirerend aan de diversiteit van de landen en steden van waaruit mensen afkomstig te zien. Dus als je wilt een kijkje op die rekening, zal dat oplopen tot het einde van het semester. Vandaag hebben we onze blik verder met het web, web programmeren, HTML en dergelijke, en we ook lunchen er deze vrijdag als je zou willen, en met name niet heeft gedaan. Deze vrijdag is het thema zal Nate's verjaardag, dus als je wilt verjaardag lunch te hebben met Nate en anderen, sommige van onze vrienden van de bedrijven, gelieve hoofd naar die URL daar. Ruimte, zoals altijd, is beperkt. Ook, als u bent vergeten, beseffen dat volgende week is de deadline voor het probleem te stellen 4's speurtocht, waarbij na het herstellen al die JPEG's uit card.raw, u en uw sectie vrienden, als u wilt, kunt proberen te fotograferen omdat veel van de computer wetenschappers die geheugenkaart zijn, en u en uw sectie zal dan winnen een fantastische prijs. Kijk terug naar PSET 4 specificatie van wat te dienen en wanneer. Ook, als u wilt dat uw handwerk vereeuwigd op het verloop van de website en de geschiedenis van de kleding, weet dat u nu van harte welkom om te beginnen het indienen van ontwerpen voor dit jaar T-shirts en sweatshirts en dergelijke. We zullen ons best doen om zo veel als we kunnen zijn, maar we zullen moeten een aantal leden van het personeel beoordeling Alle van de ontwerpen om ervoor te zorgen dat ze in overeenstemming met de specificaties, en we dan over het algemeen kies een handvol van hen te worden tentoongesteld. Dus als je het constructietype, weet alleen dat aan de eisen voor graphics zijn PNG, minstens 200 DPI, zij niet meer dan 4000 x 4000 pixels, en niet meer dan 10 MB, maar je bent van harte welkom om dingen te gebruiken zoals Photoshop of GIMP of verschillende grafische programma's, wat je tot je beschikking hebt. 

Ook op de horizon is het laatste project. Het laatste project is echt het hoogtepunt van 50, waarbij van alle opdrachten in de cursus, het is uw kans echt doe je eigen ding. En dat kan gewoon om iets te doen voor de lol, het kan zijn om een ​​aantal urgente probleem dat uw student groep heeft op te lossen, voor een aantal nieuwe website, een aantal nieuwe collectie mechanisme voor data. Het kan een mobiele applicatie voor Android zijn, voor iOS. Echt, de sky is the limit, en in de komende paar weken, als we de overgang van C naar deze hogere talen zoals PHP en JavaScript, vind je jezelf meer en meer vertrouwd met een aantal real-world technieken, sommige real-world tools, en aan te vullen dat, weten dat de loop een geschiedenis van seminars heeft, waarbij in de komende paar weken, een deel van het onderwijzend personeel en vrienden van ons uit op de campus zal bieden optionele seminars die verder gaan dan wat er meestal gedaan in paragraaf u laten kennismaken met dingen zoals Android programmeren, u laten kennismaken met dingen zoals iOS programmering of meer geavanceerde web-development technieken. Er is een hele geschiedenis van deze al online. Als je naar cs50.net/seminars, we doen dit al heel wat jaren, en je zult zien dat hier gearchiveerd met PDF's en video's en dergelijke zijn enkele tientallen video's van seminars. Vorig jaar, bijvoorbeeld, hadden we een seminar over acing uw technische interviews, als je eigenlijk op zoek te gaan uit en een stage of full-time optreden te doen. Windows mobiele ontwikkeling, Android ontwikkeling, Google Maps, API, CSS, het ontwikkelen voor de BlackBerry, Emacs. Echt, je van harte welkom om een ​​kijkje op een van deze seminars op uw gemak te nemen. En we zullen die een deel nieuwe dit semester, als goed. 

Dus wat is verder met het laatste project? Nou, ten eerste, ook al is deze datum is enigszins dreigend, Dit is eigenlijk gewoon een kans om na te denken over het uiteindelijke project te starten heel realistisch. Wij kennen alleen het begin van een deel van wat we nog die in de loop, HTML, PHP en dergelijke, maar je bent allemaal bekend met het web, en Ibias dit gesprek in de richting van het web alleen omdat de meeste mensen uiteindelijk doen op het web gebaseerde afstudeeropdrachten, maar dat is zeker niet nodig. Met behulp van C is prima, Objective C, Java, elke andere taal die je misschien kent of wilt u weten is heel goed. Maar om de sappen stromen in eerste instantie te krijgen, zullen we verwachten dat het indienen van een vooraanmelding die, volgens de PDF op de website, die nu op cs50.net, en in de linkerbovenhoek zie je afstudeerproject is de specificatie voor het afstudeerproject, en er informatie over de vooraanmelding en dergelijke. Het vrij veel komt neer op een e-mail naar uw onderwijs mede alleen maar om een ​​praatje met hem of haar over wat je denkt. Op projects.cs50.net is een opslagplaats van ideeën van mensen op de campus als je moeite hebt om te komen met een idee, en manual.cs50.net/APIs is een verzameling van links naar API's. 

Maar wat is een API? Wat is een API? Ik heb gezegd dat het ten minste tweemaal, volgens de transcripten van de afgelopen week. Wat is dat? [Student, onverstaanbaar] >> Oke, goed. Dus iets programmeer-interface. Application programming interface, en dit kan verschillende vormen aannemen, maar wat dit echt op neer komt is code dat iemand anders hs geschreven of gegevens die iemand anders heeft verzameld dat is aan u beschikbaar gesteld in een aantal programmatische manier. U kunt code schrijven in C, PHP, Python, Ruby, wat meestal de taal van uw keuze is, en u kunt een of andere manier voort te bouwen op andermans functionaliteit of van iemand anders dataset. Bijvoorbeeld, als ik ga naar deze link hier, en zie je een paar links op de volgende pagina waarbij we hebben een eigen API's CS50's, die zeer Harvard-centric, en vervolgens van derden API's. Onder de derde-API's zijn echt nuttige dingen zoals de mogelijkheid om de mensen sms'en te sturen, de mogelijkheid om SMS-berichten te ontvangen van mensen. En dat soort dingen die je zou geen idee hoe je jezelf uitvoer te leggen, maar dankzij diensten, zowel gratis als commerciële, je kunt bouwen op de top van deze en iets doen voor u van belang. Onder API's CS50's zijn deze campus-centric zaken als Harvard cursussen, energie, evenementen, eten, kaarten, nieuws, tweets en Shuttleboy eigen, en dit zijn API's die een beetje zoiets als dit te kijken. 

Laat me trek de HarvardFood API. Als je ooit naar de website van HUD's, hebt u waarschijnlijk er geweest gewoon zien wat er voor het diner of om te zien wat de uren zijn voor een aantal d-hal. Nou, het is niet bijzonder gemakkelijk te navigeren, en dus wat we hadden enige tijd geleden werd schreven we software, het gebeurt te zijn in PHP, die eigenlijk scherm schraapt het geheel van de website van HUD's. Om te screenen schrapen iets betekent voor een programma te schrijven in een taal zoals PHP dat zich voordoet als een browser, zelfs al zou je het uit te voeren bij een opdrachtprompt, dat zich voordoet als een browser, wordt aangesloten op een website, downloadt de HTML, de taal waarin het is geschreven, en dan het leest, of meer specifiek, ontleedt het boven naar beneden, van links naar rechts. En wat we deden was schreven we onze code op een zodanige wijze dat elke keer als we iets zagen in dat HTML die eruit zag als iets op het menu, zoals hamburger, zouden we vervolgens importeren die in onze eigen database. En elke keer dat we zagen voedingswaarde, zouden we importeren dat in onze eigen database. En wat we deden was hefboomeffect van het feit dat HUD's website, zelfs al is het misschien een beetje een uitdaging voor ons mensen om te navigeren zijn onder de kap, wordt alle HTML gegenereerd door hun eigen computerprogramma's. Dus al hun HTML, ook al is het misschien rommelig uitzien, zoals de meeste websites onder de motorkap volgt een patroon. Dus we net een paar uur uit te vinden dat patroon zodat op het einde, gooien we al die vieze HTML, alle van de esthetiek van vet facing en cursief en dergelijke, en wat wij zijn dan in staat om te doen is bloot dat dezelfde gegevens. Bijvoorbeeld op deze manier. Dus, volgens de documentatie hier hebben de wereld dat als je een URL dat ziet er zo uit, food.cs50.net / iets, en u te voorzien van bepaalde parameters, die we zullen praten over vandaag, als einddatum de tijd, startdatum tijd, maaltijd, enzovoort, wat onze servers zullen terugkeren naar je, bijvoorbeeld, wordt een CSV-bestand, komma separted waarden als een Excel-bestand, met alles voor het ontbijt op deze bijzondere datum in maart vorig jaar toen ik toevallig te schrijven van deze documentatie. 

Voor degenen die bekend, CSV is niet de enige bestandsformaat. Er is een ander formaat dat is alles wat de meest veelzijdige genaamd JSON, JavaScript Object Notation. De gegevens kunnen terugkomen in dat formaat. Dus de afhaalmaaltijden hier is dat de vraag of u een duik nemen in deze API of een van de andere CS50's of iets die er zijn op het internet, of helemaal niet realiseren dat de wereld steeds meer begint te standaardiseren hoe machines elkaar verbonden. Wij gebruiken standaard data formaten zoals CSV of JSON. En wat dit betekent voor u is dat je kunt schrijven het interessante deel van een programma waarmee uw gebruikers zoeken in een eetzaal menu, waarmee ze te maken lijsten van favorieten waarmee ze te krijgen tekst waarschuwingen wanneer hun favoriete maaltijd staat te worden geserveerd in een aantal d-hal door gebruik te maken van iemand anders datasets en voortbouwend op de top van hun API's. Dus meer op die in de vorm van seminars en de documentatie die u hier online te hebben. Dus die zijn dus API's. 

Dat brengt ons terug naar HTML. Korte samenvatting. Wat is HTML? [Student, onverstaanbaar] >> Goed. HyperText Markup Language. Iemand anders, wat is Hypertext Markup Language? HyperText Markup Language. Oke. Dus HTML, HyperText. HyperText verwijst gewoon naar het web, voor het grootste deel. Markup betekent dat het niet is eigenlijk een programmeertaal, HTML. Het is niet een taal die je kunt Logic Express inch Het geen lussen. Het geen voorwaarden. Het geen functies per se. Integendeel, het heeft deze dingen tags genoemd, of beter gezegd, elementen. En die elementen hebben begin tags en eind tags, of open-tags en gesloten tags, deze tags en wat over het algemeen betekenen voor een browser is, iets gaan doen en dan stoppen om iets te doen, al zijn er uitzonderingen op die. Soms is het gewoon 'een regeleinde hier zetten,' bijvoorbeeld. En we zagen voorbeelden van dat de andere dag, tussen vet geconfronteerd, regeleinden, en dan een paar andere tags. Dus HTML is de taal waarin webpagina's worden geschreven. Dus als ik naar iets als Google.com en trek je gewoon hun home page, herinneren dat als u met de rechtermuisknop te klikken of te controleren klikt u op en kijk naar View Page Source, meestal het is een grote puinhoop deze dagen onder de motorkap, maar dat komt omdat computers geven niet om witte ruimte, dus dit hoeft niet mooi te kijken. Maar als we inzoomen op delen daarvan, merken dat Chrome gewoon om aardig te zijn, heeft kleurcode dingen. Inderdaad, dit is de eerste tag die we zagen in een webpagina. En nogmaals, HTML 5, de nieuwste versie van deze taal, hoeft dit ding aan het begin, <! Doctype html, of kleine letters of hoofdletters, maar dat is gewoon soort van een standaard die zegt: hey wereld hier, een HTML-bestand in versie 5 komt. 

Het interessante deel begint hier. Dus <html, en dan waren er twee kinderen van de HTML-elementen laatste keer. Wat waren dat voor twee belangrijke kinderen? Hoofd en lichaam, net als de man met de tatoeage een moment geleden. Er zijn twee delen van webpagina hoofd en lichaam, en terugroepen, dan, dat misschien wel de eenvoudigste webpagina konden we er zo uitziet. En ik heb ingesprongen het alleen maar om soort van netjes en opgeruimd met mijn code, worden maar wat echt belangrijk is hier dat er een hiërarchie bij. En elke tag die ik heb geopend Ik heb gesloten en dat er daarom deze symmetrie om alle opmaak die ik heb gemaakt. Dus laatste keer dat we begonnen met het schrijven van web pagina's op mijn eigen laptop. Ik opende de tekst bewerken, ik heb het bestand als hello.html, Vervolgens heb ik sleepte het bestand op mijn browser, en voila, ik had een pagina op het internet. Nu, het is niet helemaal het geval is, ik had een pagina op mijn harde schijf, en ik was letterlijk de enige persoon in de wereld die dat zou webpagina te zien in een browser. 

Dus vandaag introduceren we een echte webserver en het begrip van het daadwerkelijk leveren van content op het Internet en hoe Dit begint op elkaar aansluiten. Dus het blijkt dat al die tijd in de CS50 apparaat u beschikken over een webserver op uw computer. Wij hebben, in alle eerlijkheid, alleen gebruikt het voor gedit, voor Clang, voor GDB en dergelijke, maar ook geïnstalleerd door ons voor u in het apparaat is een web-server, en dat webserver toevallig vrij, een open source, een van de meest populaire in de wereld, genaamd Apache. De meer technische benaming is HTTPd, de d voor daemon wordt hier, wat een technische term voor een server. Dus geïnstalleerd in de CS50 apparaat is een web-server, en wat betekent dat? Nou, een webserver is, conceptueel, sommige server op het Internet die serveert webinhoud. Toen we vroegen om een ​​bestand, het spuugt de HTML die dat bestand componeert, en voila. Je ziet een aantal website's home page. Maar een server is, meer precies, een stuk software. Het hoeft niet op een fysieke machine, het moet alleen een software lopen. Dus de CS50 apparaat, is natuurlijk een stuk software ook al is het soort van doen alsof ze een machine te zijn. Het is alsof ze een computer binnenkant van een computer, maar dat betekent gewoon dat het apparaat zeker kan lopen dingen zoals webservers. Het kan zelfs draaien e-mailservers. We kunnen uitvoeren van een instant messaging-server in het apparaat als we wilden, en inderdaad, we lopen een andere type server, die bekend staat als een database-server, MySQL. Maar meer daarover volgende week. Dit betekent dat ik daadwerkelijk kan webpagina's bezoeken binnenkant van mijn apparaat met behulp van een browser in het toestel of zelfs op mijn eigen laptop, mijn Mac of mijn pc. Dus wat betekent dit? Het blijkt dat elke keer dat je een Linux-computer draait, zijn bijnaam is "local host." Het beschikt niet over een domeinnaam, omdat we nog niet gekocht een domeinnaam voor iets als het apparaat, zodat de standaardnaam is de lokale host. 

Maar om het apparaat te krijgen om te beginnen met serveren webpagina's, moeten we eerst hen. Dus laten we dat doen. Laat me hier gaan in een terminal venster en merk dat ik op mijn typische John Harvard prompt. Laat me ga je gang en typ ls, en we zullen een aantal bekende dingen te zien vanuit dit semester, bureaublad, downloads, dropbox, enzovoort, maar nu zijn we beginnen te draaien onze aandacht op een paar. Op veel Linux-webservers er is een map met de naam openbare html, maar we gaan naar die ene overslaan en op deze, vhosts richten. Iedereen weet wat een vhost is? Gewoon dom jargon voor virtuele host, en wat dit betekent is dat op een typische server je kunt eigenlijk meerdere websites hosten. U kunt een domeinnaam zoals foo.com, en je kunt het hosten op een server. Maar je kunt ook kopen bar.com en hosten op dezelfde server. De reden hiervoor is, browsers zijn slim genoeg om de server te informeren wanneer een gebruiker wordt een aantal webpagina vraagt, wat domeinnaam de gebruiker wil de homepage voor. Dus wat er leuk is aan dit is dat je niet nodig hebt een fysieke server of een CS50 apparaat voor elke website die u zou willen maken. U kunt gebruik maken van dezelfde server en het ontwikkelen van een honderd verschillende websites. En inderdaad, als je een persoon die probeert om een ​​website te starten, of het nu voor plezier of voor zaken, meestal je uit te gaan op het internet, en u betaalt iemand die tien dollar per maand, een honderd dollar per maand om uw website te hosten voor u. En de manier waarop die werkt is dat ze andere mensen het opladen tien dollar per maand of honderd dollar per maand andermans websites te hosten op hun dezelfde server. De reden dat ze dat kunnen doen is vanwege deze functie genaamd bhosts, maar meer op dat wanneer het tijd is voor de definitieve projecten. 

Voor nu, laten we gewoon duiken daar. Dus cd vhosts, en als ik typ ls nu, merken dat er een map in zijn naam de lokale host. Dat komt omdat, standaard, het apparaat cijfers die je ooit zult naar een website draaien op een apparaat. Dit is niet echt de echte wereld, het is niet een real-world web-server. Dus laat me gaan in de lokale host, en nu zullen we zien daar een laatste directory met de naam HTML. Dus het is een beetje diep, de hiërarchie, maar of en wanneer u besluit om de ontwikkeling van meerdere websites te starten in de komende n maanden of jaren, dergelijke mappenstructuur meestal nuttig. Laten we nu eens gaan in HTML zoals ik net deed, ls intikt, en niets is er. Dus laten we nu verder gaan en dit doen. Laat me open te stellen Chrome binnenkant van het apparaat, en laat mij gaan naar http://localhost. Dus letterlijk de naam voor mijn apparaat, in te voeren, en ik krijg index van /. Dit is niet echt laat me iets van belang, maar het blijkt dat wat we nu zien is dat de map HTML. Er is niets in die map op dit moment, dus in plaats, wat ik ga moeten doen is eerst een bestand. Maak een HTML-bestand zoals wij deden op maandag, maar deze keer zet het binnenkant van het apparaat. Voor degenen onder u die proberen om mee te volgen met laptops nu, Laat me u een apart dat zal worden behandeld in de web-based PSET, maar om te krijgen dit te laten werken voor de allereerste keer, je gaat te hebben om deze opdracht uit te voeren: sudo service httpd start. En dit, nogmaals, zal worden herhaald in de laatste PSET, maar als je meespeelt nu thuis, de webserver wordt uitgeschakeld in het apparaat, en dat is zo dat het niet sap up RAM en geheugen voor 7 weken van het semester als we het niet nodig hebben. Dus je moet dit commando eenmaal uit te voeren, en u zult een uitvoer is als dat te krijgen. Dan moet je in staat zijn om hier mee te spelen. Laten we nu eens terug te gaan in deze map. Deze map is leeg, dus laat me beginnen met het maken van een bestand, gedit hello.html. 

Oke. Gedit is open, zoals gewoonlijk. Laat mij dat doen doctype, html, html, laat me voor mezelf en begin het sluiten van mijn tags op voorhand. Nu heb ik het hoofd. Laat me ga je gang en sluit het hoofd, laat me je nu de titel van de pagina doen, hello world zoals de vorige keer, dicht titel, nu laat mij een lichaam. Hierin zal ik hallo zeggen, wereld met een aantal exclams om duidelijk te maken dat het een andere snaar. Sluiten lichaam, en nu laat me gaan en op te slaan. Laat me terug naar mijn terminal venster, en als ik typ ls, Ik zou, vermoedelijk, zie hello.html. En ik doe. Dus laten we nu terug naar mijn browser, klik herladen, en je kunt zien dat we inderdaad de binnenkant van deze HTML map. Ik ben niet het zien van een webpagina nog, dit is Apache, de webserver, gewoon je me de lijst met de inhoud van deze map. Net zoals Mac OS of Windows zouden in het algemeen te doen op uw eigen lokale harde schijf. Dus als ik wil deze webpagina te zien, kan ik op dit kleine link hier, hello.html, en inderdaad, dat is wat ik had verwacht te zien. Nu, nogmaals, dit is niet een URL die een van je nu kunt bezoeken, want voor u, lokale host, als je een laptop hier, Het is een verwijzing naar uw eigen exemplaar van het apparaat. Dit is op mijn eigen persoonlijke apparaat, maar dit is een beetje dom voor mij te hebben, moeten een gebruiker zoals ik klik op hello.html om daadwerkelijk te zien van de inhoud van deze pagina. Het blijkt dat webservers zoals Apache laten heb je een standaard bestand voor elke web-server. Let hier hebben we hello.html. Wat is het commando in Linux om een ​​bestand te hernoemen? 

MV, voor beweging. Dus laat me dat doen, en laat me hello.html hernoemen naar index.html. Laat ik typ ls om te bevestigen dat het nu is omgedoopt. Nu dit gaat - als ik terug naar de lokale host, merk nu dat ik automatisch ben die webpagina te zien. Dit is identiek aan mijn werkelijk te doen / index.html, maar het leuke is nu dat de webserver is uitzoeken, oh, als u een bestand dat, door menselijke conventies, wordt de naam index.html, laat ik de gebruiker dat bestand standaard in plaats van een domme directory listing die helemaal niet gebruiksvriendelijk. Sterker nog, de meeste websites die u bezoekt op het internet niet over een lijst met bestanden om te klikken op, ze gewoon tonen u de inhoud. Dus dat is hoe we dat kunnen doen, index.html. Dus dit is allemaal leuk en aardig, maar dit is een vrij eenvoudige webpagina. Laat me ga je gang en open index.html in mijn vhosts, lokale hosts, html directory, en laten we iets toevoegen van groter belang. Dus er is hello world, in plaats daarvan laten we zeggen: 'Dit is CS50, Harvard College. . . ' Dus het begin van de studiegids beschrijving van een soort daar. Nu, als ik herladen, moet ik dit zien in mijn home page. Oke, en ik zie dat, maar stel dat ik wil wat meer inhoud nu een lijst van in dit bestand. Ik kan hier naar beneden gaan en zeggen, voorwaarden geen, hoewel sommige van jullie waarschijnlijk graag, 'Ha ha ha, geen vereisten.' Maar - officieel. Dus herladen, en nu hebben we dezelfde eigenaardigheid die we vorige keer zagen. Maar waarom is dat? Het was een eenvoudige oplossing. Waarom is deze pagina kapot is? [Student, onverstaanbaar] >> Ja, we hebben dit opgelost voordat door expliciet de browser te vertellen "hier zetten een regeleinde. ' En dat komt omdat, nogmaals, is een browser alleen maar te doen expliciet wat de opmaaktaal hem opdraagt, dus zelfs al heb je misschien druk op enter of twee keer of zelfs tien keer, het gaat om die samen alle in een enkele ruimte, maar volgens afspraak. Dus als je echt wilt een regeleinde, moet je de br tag te gebruiken, en nu bericht, net als maandag, heb ik de / binnenkant van deze tag, alleen omdat dit werkt gewoon niet goed voelt om een ​​regeleinde te starten, stop deze met niets ertussen. 

Dus de conventie in HTML is te openen en tegelijkertijd sluiten van een tag. Even terzijde, je zult een heleboel websites te zien in boeken niet om dat te doen. Het is juist om te doen of niet te doen, maar we pleiten zouden dat het ontwerp-wijs en stilistisch, dit is gewoon beter want dan elke tag is zowel geopend en gesloten een of andere manier. Dus laten we nu opslaan en opnieuw laden. Ga terug naar de browser, oke. Nu maken we enige vooruitgang, maar het is niet genoeg. Laten we verder gaan en beginnen met typen in sommige langer lichaam van de tekst. Dus laten we zeggen, 'Een snelle bruine vos springt over een luie hond.' En nu laat ik gewoon kopiëren en plak deze een paar keer zodat wij een paragraaf van tekst. Laten we terug gaan hier. Dus het ziet er niet erg goed. Ik heb wel een regeleinde, dus het is oke, maar nu, als we nu op het punt van het hebben van een webpagina dat heeft veel van de inhoud en niet alleen enkele lijnen aan te tonen HTML, kunnen we beginnen te denken van deze dingen als werkelijke leden. En we kunnen beginnen met onze webpagina structureren een beetje schoner. En inderdaad, wat ik kan doen is hier naar boven binnenkant van mijn body-tag, en weet je wat, als 'Dit is CS50. . . ' echt demarks het begin van een paragraaf, Nou, laten we taggen als zodanig. Laat me streepje van de tekst, maar volgens afspraak, laat ik zeggen dat deze paragraaf eindigt hier, en dan in plaats van er dit regeleinde, laat me gewoon zeggen dat dit hoort daar en als een nieuwe paragraaf, en ik zal gewoon snel streepje door gewoon verpesten alle van dit spul. 

Dus nu hebben we een ingesprongen paragraaf daar, en nu onze markup begint om een ​​beetje meer te krijgen semantisch overeen met wat we proberen te doen. We hebben een paragraaf, dus laten we noemen het een paragraaf met de tag p. We hebben een tweede paragraaf, dus laten we noemen het een paragraaf met de tag p. En nu is de browser, wat zal doorgaans doen is net als in een Engels boek of essay, waar je normaal gesproken ziet een aantal lege ruimtes tussen de. Browsers zal dat automatisch voor u doen. Dus nu hebben we twee leden en kunnen we verder met deze. Maar, uiteraard, op het web, als je lichaam van de tekst het is meestal niet alleen grote klodders van tekst. Er zijn vaak hyperlinks in. Dus als we willen, bijvoorbeeld, zijn enkele links daar, veronderstel dat interessant kunnen zijn in welke webpagina ik hier het creëren van is - laat mij gaan naar Google.com, en laat mij zoeken naar een snelle bruine vos. Ga naar Google afbeeldingen, en, wat dacht je - dit is leuk. We gaan met dit. Hier hebben we dus een snelle bruine vos springen over een luie hond. Dus wat ik ga doen hier, alleen maar omwille van de demonstratie, wordt veronderstellen dat dit beeld was op mijn server, en ik was het maken van deze beelden. Wat ik net deed was de rechter muisknop of Ctrl-klik op de afbeelding, en wat je ziet in de meeste browsers is er een klein menu - stoppen met het doen dat - een klein menu waarmee u kunt kiezen koppeling kopiëren locatie of kopieer de URL. Dus laat me nu terug naar mijn HTML, en stel dat ik wil om een ​​hyperlink deze naar een andere webpagina. 

Wat was de label met de naam voor? [Student, onverstaanbaar] >> Ja. Dus a href voor hyper referentie. Laat me ga je gang en plak die binnen Het is een vrij lange URL, dus laat me zoomen weer naar buiten. Sluiten haakjes, dus let nu op ik ben weg hier omdat die URL toevallig vrij lang. Laat me scrollen hier naar het einde van de quick brown fox, en dan laat ik deze tag te sluiten met </ a, waar ik alleen de naam van de tag gesloten. Laat me nu gaan en op te slaan dat bestand, laadt de webpagina, en nu, standaard, dat gaat worden blauw onderstreept voor mij, maar inderdaad, ik kan nu klikken op deze en voila. Er is dat beeld. En het hoefde niet een beeld te zijn, het kan zijn gekoppeld met een andere willekeurige website op het internet. Ik zou dit kunnen doen, bijvoorbeeld met CS50, dus een laatste voorbeeld. 'Dit is CS50' misschien zinvol om te gaan een, href = http://www.cs50.net, dicht citaat, in de buurt anker. Dus nu dat is een nog kortere URL, en deze keer zijn we niet van plan om te koppelen aan een afbeelding. We gaan in plaats daarvan om te linken naar een andere pagina. Nu hebben we een beeld hier. Ik voel me als we kunnen doen een beetje beter dan alleen maar linken naar een afbeelding. Wat als we willen echt belichamen in onze eigen webpagina? 

Nou, wat kan ik hier doen is, in plaats van link naar deze grafisch, laat me in plaats daarvan de URL te snijden, en wij zullen te ontdoen van die hyperlink en dit opruimen. En we zullen hier naar beneden gaan en zich te ontdoen van deze. We hebben niet echt al die zinnen nu nodig, dus laat me verkorten van de pagina een beetje. En dan hier beneden laat me gaan in een nieuwe paragraaf, zeggen dat ik niet de tekst nu wil, ik wil een afbeelding waarvan de bron gaat dat URL zijn. Een beeld, zoals een regeleinde, is er of het is het niet. Dus laat me meteen die tag te sluiten. Laat me nu ga je gang en sluit de paragraaf die ik binnen ben, en als alles goed gaat met hello, world, als ik nu opnieuw te laden, Ik, inderdaad, zie rechts in mijn eigen webpagina een afbeelding. Dus nu hebben we een image tag, een anker tag en dergelijke, en voor een goede maatregel, laat mij een ander ding dat vaak verwaarloosd op websites van deze dag: Laten we zorgen voor een beschrijvende tekst voor deze afbeelding voor mensen die op een mobiel apparaat en dus misschien niet in staat om dit beeld te downloaden zeer snel, voor mensen die blind zijn en misschien niet in staat om het beeld te zien maar ze zou kunnen hebben een schermlezer die kan vertellen wat dit beeld is van. En om dat te doen, is er een ander attribuut voor het imago-tags riep alt, voor alternatieve tekst. En wat ik hier kan doen is zeggen: 'Dit is een snelle bruine vos.' Zodat zelfs indien de mens kan het beeld niet op het scherm, hij kan tenminste horen als enkele software, Wat er eigenlijk op het scherm. 

Dat zal niet veranderen de esthetiek van de pagina, maar het is zeker een goede praktijk voor de gebruikers. Oke, laten we deze webpagina te verlaten in zijn huidige vorm, maar laten we eens kijken of we kunnen nu niet invoeren sommige beter benaderingen van het schrijven van deze webpagina's, een aantal lessen die gaan om ons te dienen en onze pagina's krijgen meer en meer complex. Wat we niet gaan doen in de komende paar weken wordt u door alle van de tientallen HTML-tags die er zijn. Veel terug als in kras in week 0, zal het waarschijnlijk voldoende op een hoog niveau overzicht van enkele van de concepten te geven, een korte rondleiding van een aantal van de blokken was je waarschijnlijk in staat, vrij comfortabel, om te navigeren op uw eigen, de verschillende puzzelstukjes. En dat gaat weer gebeuren in HTML, het meest waarschijnlijk, waarbij er voldoende middelen op het web dat we u wijzen op, verschillende leerboeken, als u liever een studieboek te lezen, dat zal u door alle van de verschillende dingen die je kunt doen met HTML, maar echt, hebben we tot nu toe gezien in HTML het grootste deel van de fundamentele concepten. We hebben het idee van tags worden geopend, worden labels gesloten. Sommige tags die zijn beide geopend en gesloten in de zin dat ze leeg zijn, er mag niets binnenkant van hen zijn als een afbeelding tag of een regeleinde, die zijn er gewoon. We hebben ook gekeken al bij het idee van een attribuut, zoals alt of bron. Merk op dat deze woorden de neiging, volgens afspraak, kort en bondig. 

We hebben geen zeggenschap meer over wat deze dingen worden genoemd, iemand anders die de uitvinder van HTML kwam met deze namen. Dus je hoeft alleen te gaan om te weten of opzoeken, elke keer dat je ze nodig hebt, wat de namen zijn van deze tags en attributen. Bij deze kenmerken toekent algemeen het gedrag van sommige tag. In dit geval is de bron attribuut vertelt de image tag wat de bron van het beeld moet. De href attribuut vertelt de ankertag wat het eigenlijk zou moeten worden gekoppeld aan. Maar in termen van de structuur van een webpagina, hoewel Facebook en Google en dergelijke eruit ziet als een grote puinhoop onder de kap op het eerste gezicht, als je begint te lezen door het meer methodisch, ze volgen allemaal deze fundamentele, basisstructuur. Maar we kunnen het verbeteren van de stilering van deze dingen. Dus laat me gaan naar een paar voorbeelden die ik voorbereid. Laat me ga je gang en kopieer ze vanaf een andere map hier en leg ze in deze map. Van te voren, wat ik deed was bereid een paar bestanden: search0, SEARCH1, search2 en search3 en 4. Laat me verder gaan en het openstellen van de eerste van deze bestanden, en laten we kijken of we kunnen niet beginnen om onze eigen zoekmachine te maken. Op de top van dit bestand, zoals meestal het geval is in de klas, gewoon een stel van opmerkingen. In HTML, echter de manier waarop je begint een reactie is <- en dan ben je de binnenkant van een reactie, een multi-line commentaar. Wanneer u klaar bent om die opmerking te stoppen, kun je ->. Dus alles aan de top in het blauw is gewoon een reactie. 

Dit is mijn doctype declaratie, wat ook weer, je kunt gewoon kopiëren en plakken op het geloof, voor nu. Dit vertelt alleen de browser, "Hier komt een aantal HTML 5. ' Daaronder, op lijn 14, is de eerste van mijn echte tags, en dit zegt alleen, zoals voorheen, hier komt een aantal HTML, hier komt de kop van mijn pagina, hier komt de titel, en dan, omgekeerd, dat is het voor de titel, dat is het voor het hoofd. Hier komt nu het lichaam van mijn pagina. Dus een paar nieuwe tags nu: h1 staat voor rubriek 1. Er is een traditie in HTML voor vele jaren terug van met verschillende afmetingen tekst. En terug in de dag, elk bedoeld, over het algemeen, net groot en vet. Maar er is ook h2, die is groot, maar niet zo groot en vet. Er is h3, dat is een beetje groot, maar lang niet zo groot en vet, enzovoort, helemaal naar beneden tot h6. Deze dagen, niettemin, zijn H1, H2 en H3 echt bedoeld om meer semantische betekenis hebben voor hen, waarbij h1 is echt een rubriek: de titel van een webpagina, de kop van een kolom of iets dergelijks van de tekst. Dus ik heb met opzet zei h1 CS50 zoeken> h1 te worden aangegeven dat dit echt de kop, de titel van mijn pagina. Niet de titel in de titelbalk zin, maar de titel die u daadwerkelijk in de webpagina zelf, in het lichaam. Nu dit, kunt u waarschijnlijk wel raden wat het is, ook al hebben we een paar nieuwe stukken van de syntaxis. Dit is een vorm. Dus het web echt interessant wanneer websites input van gebruikers. In deze klasse, in het probleem te stellen op de website van de programmering, we gaan niet naar een website, per se te maken, met statische content die foto's die je hebt genomen laat zien, of dit is mijn CV, en dingen over mij, want die dingen zijn relatief eenvoudig in elkaar te zetten. Het is moeilijk om mooie dingen te maken op het web, maar in ieder geval het ophangen van de inhoud is vrij triviaal. Maar pas echt interessant wanneer iemand uw website te bezoeken en zorgen voor input en kunnen formulieren invullen, kunt afvinken checkboxes en kan communiceren met uw website. En inderdaad, waarschijnlijk elke website die u belangrijk vindt deze dagen, in detail, is een of andere manier interactief. Facebook, Google, en dergelijke, dat invoer van de gebruiker te nemen en produceren uitvoerprofiel. 

Dus laten we beginnen nu doen. Laten we de overgang nu van alleen met behulp van HTML-opmaak voor de statische inhoud als in plaats daarvan een mechanisme voor aflevering van dynamische inhoud. En in de richting van dat doel, laten we voeren onze eigen zoekmachine. Laten we het doen als volgt. Hier is de form tag. De actie attribuut geeft aan dat wanneer de gebruiker vult dit formulier in met hun toetsenbord, zal het worden voorgelegd aan deze URL hier. Dus ik ben een beetje vals spelen. Het gaat ons iets langer duren dan een klasse om de hele zoekmachine implementeren, dus we zullen gewoon de front-end, bij wijze van spreken. We doen het deel dat de gebruiker zoeken laat, en wij zullen van Punt sorteren naar Google het harde deel van het vinden van de zoekresultaten, maar, in het bijzonder, ik ga praten met web Google-server met behulp van een van de twee zeer populaire methoden. Een wordt krijgen, een ander, dat we uiteindelijk zullen zien, zijn post, hoewel er anderen zijn die minder vaak worden gebruikt. Dus maak je maar roept het idee van, ik wil een aantal inhoud te krijgen, nog wat zoekresultaten. Dit kun je misschien raden wat dit doet. Dit is een soort van input, het is in feite gaan om te kijken als een tekstveld, en de naam van de input, de naam van de variabele, zogezegd zal worden q voor zoekopdracht volgens afspraak. En nogmaals, is de aard van deze ingang niet van plan om een ​​checkbox te zijn; het is niet van plan om een ​​menu te zijn, het gaat om een ​​tekstveld zoals aangeduid door dit kenmerk hier en dit tekstvak zoals een regeleinde, is er of niet. Dus hebben we een leeg element met de schuine streep in die tag. Dan ga ik naar een regeleinde zetten, en je kunt misschien wat denk je dit gaat doen. Dit is een andere soort vorm input. 

Deze is gebruikt zal worden voor het indienen van het formulier. Dus dit gaat om de grote knop die de gebruiker kan klikken om het formulier te zijn, en het etiket op die knop gaat worden "CS50 zoeken. ' Sluiten vorm, in de buurt lichaam, in de buurt HTML. Laten we eens kijken wat we hebben in de vorm van deze webpagina. Dus laat me naar mijn browser, laat me nog steeds naar,, de lokale host. Dit is nog steeds index.html, dus als ik wil dit bestand met de naam search0 te zien, Ik kan gewoon doen / search0.html, voer - en de eerste van mijn fouten. Wat is er aan de hand? Ik heb duidelijk niet gemachtigd dit bestand te openen, om wat voor reden. Maar dat komt omdat, in tegenstelling tot het werk dat we hebben tot nu toe gedaan in C, waar de programma's die u schrijft wordt verondersteld dat runable door u, uitvoerbaar door u, dat is niet echt het geval is op het web, waarbij je soms zou willen bestanden maken op een server, maar u niet wilt dat de hele wereld om te kunnen om ze te zien. Integendeel, u wilt dat de wereld om een ​​aantal bestanden te zien maar andere niet, gewoon omwille van de privacy van de. Dus het is meer een opt-in basis als je dingen doet op het web. En dus laat ik eigenlijk ls hier te typen, en zie je de bestanden die ik heb, maar herinneren dat als ik dat doe ls-l voor lang, Ik krijg een langere lijst, dat geeft me wat meer details over deze bestanden die nu, echt, voor het eerst in die relevant zijn voor ons. Merk op dat aan de rechterkant zijn de namen van mijn bestanden, en dan is de tijd waarop ze het laatst zijn gewijzigd of gekopieerd. Dit nummer hier is wat? Herinnert u zich? De grootte in bytes, hoe groot het bestand is. 

Dus ik lijken een soort van logo hier dat groter is dan alle andere bestanden. Dit is wie ik ben, dit is wat ik ben en wat de groep Ik ben binnen Maar dan, hier aan de linkerkant is een beetje cryptische reeks, en we spraken, denk ik, kort hierover in het verleden, maar dit heeft te maken met machtigingen. En zelfs als dat is een beetje vaag, RW betekent waarschijnlijk lezen en schrijven &. Dus het blijkt dat deze streepjes verschillende sets met permissies geven voor verschillende mensen. En het patroon is in wezen als volgt. Als u een reeks streepjes hier, ze zien er als volgt. Er is een streepje, dan is er nog drie streepjes, dan is er nog drie, dan is er nog drie. De eerste is een liggend streepje of het is reclame voor directory. Zodat men is vrij eenvoudig. Als het een map, d zegt, anders is het een koppelteken. Er zijn een paar andere gevallen, maar voor nu zullen we alleen de zorg over bestanden en mappen. Deze volgende drie streepjes - en ik heb kunstmatig geplaatste ruimtes. Ze waren uiteraard niet aanwezig toen we zagen een moment geleden. Dit zijn de eigenaar van het bestand de permissies, en oproepen van een tweede geleden dat het werd lezen en schrijven. Dat kwam omdat ik, als de persoon die dit bestand een moment geleden, Ik, net standaard, op een Linux-computer, de mogelijkheid om verder te lezen en schrijven dat bestand. 

Dus het besturingssysteem geeft me gewoon RW automatisch. De middelste betrekking hebben op mijn groep, die van de studenten, dat is een soort van betekenis op het toestel, want ik ben de enige persoon met behulp van het apparaat. Dus laat me gewoon mijn handen zwaaien op dat voor nu. Maar de laatste die het belangrijkst zijn voor het web. Dit is iedereen in de wereld, en het feit dat is --- betekent dat niemand anders in de wereld heeft enige rechten om dit bestand. Het is duidelijk een probleem, dus ik moet dit op te lossen door een of andere manier geeft de wereld wat? Lezen en schrijven? Dat is waarschijnlijk dom, toch? Ik wil niet dat iemand op het web naar mijn pagina een of andere manier te bezoeken en dat bestand te veranderen, hoewel ze kon echt niet met een HTML-bestand, maar gewoon in principe, waarschijnlijk gewoon willen dat ze in staat zijn om het te lezen. Wat betekent het om het te lezen? Het betekent niet dat ze gaan geven om de eigenlijke HTML, maar de browser nodig heeft om te kunnen dat opmaaktaal ontleden, boven naar beneden, van links naar rechts. Dus iemand op het web moet kunnen om het te lezen, dus ik minimaal nodig om het r. Ik kan dit doen in een paar verschillende manieren, maar misschien de eenvoudigste is om deze opdracht hier uit te voeren. Chmod, verandering modus, dan is een + r dus alle, iedereen in de wereld + lezen, en vervolgens de naam van het bestand, search0.html. 

Nu als ik dat doe ls-l weer merken dat het bestand is gewijzigd, en inderdaad, ik heb aangezet r voor iedereen. Ik heb ook aan het zetten voor mijn groep, maar dat is prima, want als ik me omdraaide in op voor iedereen, mijn groep is een subset van dat. Dus dat is ook goed. Dit betekent dat alleen de computer heeft nu het leesbaar. Laat me nu terug naar mijn browser, klikt u opnieuw te laden. Ah-ha. We hebben nu CS50 zoeken. Ik heb ingezoomd een beetje kunstmatig - vrij afschuwelijke zoekmachine. Maar laten we eens kijken of het echt werkt. Ten eerste, laat me doen een snelle sanity check, laat me controleren klikt u op en bekijk pagina te verbeteren. Merk op dat binnen Chrome we nu dezelfde HTML die ik zelf gemaakt te zien. Hier niet in de war, dat wel. Ik kan niet beginnen met het veranderen van de code hier, omdat de browser heeft een alleen-lezen weergave van deze code. De browser heeft zojuist gevraagd lokale host naar een bestand genaamd search0.html. Het is nu puur toeval dat het apparaat toevallig op dezelfde computer als mijn browser. Ik kon gewoon, gelijkwaardig, hebt getypt in www.facebook.com/search0.html, en als Facebook had een bestand met de naam die zou ik dan het zien van hun HTML. En, natuurlijk, kan ik niet veranderen het bestand dat afkomstig is van Facebook, hetzij. Dus nu zijn we soort van het vervagen van de lijnen. Het apparaat is zowel een server, waar je van webpagina's, maar het is ook een klant in de zin dat ik een browser met behulp van om daadwerkelijk praten met die server. Dus laten we eens kijken of mijn Google zoekmachine werkt. Laat me ga je gang en zoek naar snelle bruine vos, in te voeren. En voila, ik heb nu mijn eigen zoekmachine. 

Maar hoe werkt dit? Beetje een stretch, maar - en nu kun je niet zien, precies, het deel dat is van belang. Let op wat er gebeurt. Let op de URL. Het blijkt dat deze methode, krijgen genaamd, is super-eenvoudig. Wanneer u opgeeft in een vorm die u wilt resultaten 'krijgen' van enkele server, wat het gaat doen is nemen wat u hebt getypt in de vorm en zet het in de URL. Het gaat om te standaardiseren hoe het wordt gezet in de URL als volgt. Merk op dat dit is de URL die is de waarde van mijn action attribuut. Dat is waar ik wilde het formulier te eindigen. Maar dan merk je vraagteken. Dit is een verdrag op het web, waarbij de gebruiker input te leveren naar een website, je toe te voegen aan de URL van een vraagteken, en dan heb je een hele hoop van sleutel-waarde paren. De naam van een sleutel, ook wel bekend als een parameter in het web dan heb je een gelijkteken, dan heb je de waarde van die parameter. Dus het is in wezen een variabele naam en een variabele waarde, maar die variabele namen en waarden kwam van de HTML-formulier. Waarom zijn er de plussen, denk je? Omdat ik niet typ + tussen mijn woorden. [Student, onverstaanbaar] >> Ja, het is gewoon voor het op afstand. Odds zijn, wanneer je hebt gezien een URL, er is nooit spaties bevat, alleen al omdat als er waren, kon je niet echt kopiëren en plakken in een IM of in een e-mail, omdat het zou breken. U wilt dat de hele zaak om een ​​aaneengesloten reeks tekens zijn. 

Dus de browser is slim genoeg om te beseffen, uh-uh. Niet zomaar een ruimte daar. Laat me coderen de ruimte in een aantal standaard manier. Een van de verdragen daarvoor is dat de browser automatisch in een + waar je anders zou hebben een ruimte. Dus nu, kennis heeft Google al een soort van gebruiksvriendelijk. Ik heb helemaal niet maken deze webpagina, maar ze hebben vooraf ingevuld hun eigen tekstveld met wat, precies, ik getypt inch Stel ik wil om te zoeken naar iets anders, zoals een luie hond. Ik kan hier alleen dit typ, re-search. Merk op dat de URL verandert hier op, maar dan merken dat ik eigenlijk kunt zoeken naar wat ik wil gewoon door te begrijpen hoe URL's werken. Ik kon doen luie kat, in te voeren, en nu merk ik krijg een heel lui - moeten we? Ik vind dat we moeten doen. Ik krijg een heel luie kat. Oke. Dit is een van de domste dingen die we hebben gedaan. Maar dat is een luie kat. Hoe dan ook, wat is de sleutel mee te nemen hier? Nu zijn we soort van het spelen in de wereld van HTTP. HTML is alleen deze opmaaktaal, open label, sluit tag, dat vertelt een browser hoe je content renderen op een webpagina. Maar wanneer u begint met het verzenden van gegevens via het internet tussen web browser en de server, dat is waar dit protocol bekend als HyperText Transfer Protocol overneemt. Dit is het soort van de menselijke conventie, toen Sam en ik schudden elkaar de hand op maandag, het starten van een verbinding en beëindigen van een verbinding, hier hetzelfde idee. Hoe worden de zoekresultaten van Google weer terug naar mij? Hoe wordt mijn formulier indienen gaan naar Google? Nou ja, herinneren van de andere dag dat wat er echt aan de hand is onder de kap bij het aanvragen van een webpagina is, uw browser stuurt een wat-cryptische boodschap zoals GET / HTTP/1.1 voor de standaard startpagina. 

Of, in dit geval, omdat ik specifiek gevraagd eerder search0.html Dit zou dan de wat-cryptische boodschap dat mijn browser stuurt naar het apparaat. Of, in dit geval van Google, wat is er eigenlijk verzonden is een verzoek om / zoeken, en dan? q = luie kat, met een plus daar. Dus dit bericht, dat ik, de mens, ben nooit te typen, maar wordt gestuurd door mijn browser, dit is hoe HTTP gebeurt. Dit is het equivalent van onze hebben handen geschud. Dit is de aanvraag, en de server staat op het punt een reactie te sturen. Dus laten we eens een kijkje op deze onder de kap. Zoals eerder kunnen we openen deze speciale veld in een browser. Bekijk pagina, inspecteren elementen. Dus onder inspecteren element, merken dat wat er gebeurd is in Chrome, en IE en Firefox hebben soortgelijke mechanismen, hebben we deze ontwikkeltools toegankelijk voor ons. Normale mensen geen gebruik maken van deze tabbladen. Maar wij, nu, zijn geïnteresseerd in wat er aan de hand onder de motorkap op het netwerk niveau. Dus als ik trek het netwerk niveau hier, laat me ga je gang en dit venster uitbreiden, open dit bericht hier, en kijk naar de headers. Dus wat gebeurt er als ik vragen om een ​​bestand van een webserver is mijn browser stuurt een hele hoop dingen. En laat me bekijken bron. Dus op aanvraag headers, en dit is gewoon Chrome toont me wat diagnose-uitgang, een beetje als een debugger van een soort, merken dat wat ik hier heb benadrukt is precies wat Chrome stuurt naar de server om een ​​bestand met de naam search0.html te vragen. Het is het vertellen van de server wat het denkt zijn naam is, Dankzij deze host colon gebied, dan is er een aantal vrij esoterische dingen hier, zoals iets te maken met data en tijden, iets te maken met de talen die de browser begrijpt, maar de echt belangrijke lijnen zijn deze eerste twee hier. 

Wat doet de server reageren met? Nou, als we naar beneden scrollen hier en bekijk de bron van dit ding, merken dat de server heeft hierop gereageerd met een wat cryptische boodschap zo goed, 304 niet gewijzigd. Dat is een beetje vreemd, laat me eigenlijk proberen om dit op te lossen. Laat me houd Shift ingedrukt en klik hier opnieuw te laden up de browser dwingen werkelijk dit verzoek voor het eerst. Laat me in te zoomen, en we zullen nu zien dat de server het antwoord, omdat ik shift gehouden, is 200 OK. Dus je hebt waarschijnlijk nog nooit gezien het nummer 200 in het kader van het web, maar wat cijfers heb je soms onverwacht gezien vanaf een server? 404, bestand niet gevonden; 403, verboden, 500, serverfout. Dus er zijn deze numerieke codes die de wereld gebruikt in de Web om fouten, net als C-functies betekenen kan terugkeren fouten en de belangrijkste kan terugkeren exit codes. 200, hoewel, je zelden ziet, omdat het betekent alles goed is. En 304 u waarschijnlijk nooit zien, want wat is het betekenende? Dat er niets is - laten we eens kijken of we weer simuleren - Oh, nu is het niet mee. 304 zei niet gewijzigd, dus waarom is de server nog reageert? Nou ja, voor efficiëntie, een web server automatisch voor u, als het bestand niet is gewijzigd, zal het niet opnieuw te verzenden de hele HTML-bestand. Het zal gewoon vertellen de browser het niet is veranderd. Gebruik gewoon de kopie die u al hebt. Dus er is dit begrip van caching op het web voor prestaties, zodat u geen tijd verspilt en afval bandbreedte downloaden van bestanden opnieuw en opnieuw onnodig. 

Maar deze webpagina, nu, was super-eenvoudig, en het alleen liet me de HTML die terug kwam. Laten we in feite het tabblad Netwerk nu gebruik maken van een Google-zoekopdracht als quick brown fox doen. Laat mij dan CS50 keuze klik op, en nu, hier op te merken in de bodem een ​​heleboel dingen terug want als ik een bezoek aan een echte website, zoals Google.com, ze hebben foto's, ze tekst hebben, hebben zij een taal genaamd JavaScript daar. Dus elke rij in deze tabel hier beneden vertegenwoordigt iets dat Google uit te spugen in reactie op mijn enkel verzoek. Degene die ik de zorg over, echter is deze eerste. En als ik naar aan het zoeken, verzoek, klik hier te bekijken bron, merken dat, inderdaad, de cryptische boodschap dat mijn browser gestuurd Google was deze twee lijnen hier, gevolgd door enkele geheimzinnige informatie hier beneden die we negeren voor nu. Maar let op, ook wat Chrome is vrij handig met, het is ook laat me de query string die werd het verzonden in Dus in plaats van toon me dit, wat letterlijk is verzonden, als ik het bekijken gedecodeerd, Chrome, alleen voor debugging doeleinden, voor ontwikkelaars net als wij, het is gewoon laten mij een mens-vriendelijke versie van - dat is niet hoe u de naam spellen vos, blijkbaar. Ik ben gewoon te merken dit nu - maar het is laten zien wat ik blijkbaar, getypt. Intussen is de reactie die terug kwam van de server is weer 200 OK. Maar in dit antwoord natuurlijk Als we echt bekijken van de pagina HTML - Sorry, dit is een beetje toetsencombinatie mis gegaan vandaag. 

Ik zal later wel mee. Dus als we daadwerkelijk de pagina bekijken de bron, die ik hier kan doen door te klikken op respons, dit is wat er eigenlijk terug spugen, in aanvulling op die cryptische 200 OK bericht van de server. Een beetje cryptisch, maar waar is dit allemaal vandaan? Nou, laten we het doen een ander ding hier. Een ander enigszins cryptisch-commando, maar deze is een soort van netjes in, dat het aan ons openbaart precies wat er gaande is onder de motorkap. Dus ik ben terug op mijn Mac hier, heb ik aangesloten via een programma genaamd SSH, Secure Shell, naar een andere server omdat de meeste van Harvard de computers blokkeren de commando's die we staan ​​op het punt om te draaien want er is deze opdracht op sommige servers genoemd traceroute die u toelaat om te traceren van de route tussen punten a en b, en tot nu toe hebben we volledig als vanzelfsprekend dat ik kan typen in Google.com en een of andere manier terug te krijgen gegevens vanaf halverwege het land of de halve wereld. Met traceroute kunnen we eigenlijk duiken in een beetje dieper over hoe het internet werkt, en zie wat er gebeurt onder de motorkap. Dus laten we verder gaan en willekeurig een route herleiden tot, laten we zeggen, Stanford.edu, dat is in het hele land, en druk op enter. Deze opdracht kan worden super-snel of super-slow, maar wat we nu zien, regel voor regel, is elk van de stappen of hop tussen ons en Palo Alto, of Stanford, waar zij hun web-server. Dus wat doet elk van deze lijnen vertegenwoordigen meer concreet, hoewel? Een stuk van jargon van het internet? [Student, onverstaanbaar] >> Wat is dat? [Student, onverstaanbaar] >> Oh, dus er zijn momenten, maar wat betekent elke rij - wat bedoel ik met hop? 

Nou, er zijn deze dingen op het internet genaamd routers. En routers, zoals de naam al doet vermoeden, route-informatie van punt a naar punt b. Maar er zijn verschillende punten voorbij a en b. Er c en d en e en f tussen rij 1, die toevallig ook mijn computer het IP-adres, of mijn numeriek adres, dat een unieke aanduiding mijn computer, en stap 15, dat is eigenlijk de zesde webserver, blijkbaar, dat ik afgeleid van deze, of versie 6 van hun web-server op Stanford. Maar wat is een beetje netjes is, kunnen we zien het pad dat mijn 0's en 1's nemen van mijn computer naar Stanford. Dus stap 1 is mijn eigen computer het adres. Elke computer op het internet heeft een uniek identificatienummer dat er zo uitziet. Number.number.number.number. Ergens op deze campus, waarschijnlijk in het science center, is een router heet Core Gateway 2-te83, wat dat betekent, dus dit is een van de grote luxe Harvard routers die routeert veel van hun verkeer. Hier is nog een van de Harvard-routers, deze is Border Gateway, grens betekenis is het waarschijnlijk in de periferie van campus ergens. Dan is er nox een, rij 4, dat is Noord Crossroads, dat is een grote ISP, Internet Service Provider, dat plaatsen als Harvard het aansluiten van maximaal. Maar dan dingen een beetje interessant in lijn 6. Waar zijn mijn stukjes ineens? Kansas. De wereld heeft er een gewoonte van het gebruik van de luchthaven codes in veel van deze dingen, of op zijn minst afkortingen voor staten of steden, zodat het lijkt alsof, in slechts 60 ms, een pakket van informatie, 0's en 1's van mijn laptop kreeg de hele weg naar Kansas, en opnieuw, in 60 ms. 

Bovendien, na Kansas, namen ze een rondleiding door Houston, waarschijnlijk, zoals voorgesteld door de naam van deze server. Dus net als een server op internet moet beschikken over een numeriek adres, het kan ook eventueel een iets mensvriendelijke adres dat mensen bedacht. Nu, in stap 8, weten we niet wat dit is. Soms routers gewoon een soort van negeren, en ze gewoon niet de vragen te beantwoorden, zodat dat is prima. Het daaropvolgende stap 8 blijkbaar waar? L.A. Merk op dat in slechts 78 ms, wat brengt ons mensen zoals 6 + uur om fysiek te doen, neemt pakketten van informatie op het internet 78 ms om te reizen zo ver. Stap 10 is in LA als goed, en stap 11 lijkt naar het noorden zijn gegaan, op in de buurt van Stanford. Dit is hun grens router of border router. Een paar stappen van Stanford die het negeren van ons, en ten slotte, bereiken we de webserver in slechts 87 ms. Nu, al deze nummers, als een terzijde, gewoon vertellen hoe lang het duurt voor data te krijgen van mij elk van deze routers, en het is niet cumulatief. Wat dit programma doet is, stuurt eerst een bericht wezen de eerste router. Dan de tweede router, vandaar een router de derde, telkens meten. Dus in theorie, zal deze tijden te groeien of ten minste redelijk dicht bij elkaar, en, inderdaad, degenen die hier zijn op de campus zijn super-klein. Zodra je begint te gaan in het hele land, het duurt gegevens iets langer te reizen, dichter bij de 100 ms, geven of te nemen. Maar laten we nu gaan de andere kant op. Wat dacht je van de universiteit van Cambridge in het Verenigd Koninkrijk? Laat mij in plaats traceroute van www.cam voor Cambridge lopen, . Ac voor academische,. Uk, en druk hier in te voeren. Dat was verdomd snel. Mijn gegevens letterlijk ging naar Cambridge, Engeland, in die fractie van een seconde van de tijd. 

Dus laten we eens kijken de weg die het kostte. Harvard, Harvard, Harvard, Noord Crossroads, die een ISP, en dan is dit Noord-Crossroads, en dan bam. Wat zit er in tussen de stappen 6 en 7, router 6 en 7? De Atlantische Oceaan. En we afleiden dit uit het feit dat We gaan van 20 ms hier om 80 ms hier. Dus iets nam 60 ms, geven of te nemen, om over. En dat was waarschijnlijk een grote hoeveelheid water. Wat gaat er daarna? Nou, hier zijn we in Londen, slechts 88 ms later. Meer London, meer London, niet zeker waar dit is, maar we zullen aannemen dat het buiten Londen, Cambridge hier, en uiteindelijk hebben we - letterlijk, Universiteit van Cambridge . Something.net, en dan, ten slotte, in de lijn 16, hun webserver wordt blijkbaar genoemd Scorpius onder de motorkap, ook al hebben we die kennen als www. Kind van mind-blowing, denk ik. De eerste keer dat ik ooit heb gedaan dit, is het helemaal in mijn gedachten. Helaas Harvard blokkeert dit type verkeer, gewoonlijk op het netwerk. Dus je kunt niet gemakkelijk doen het super. Echter te realiseren, is dit hier mogelijk is. Oke. Laten we hier nemen onze 5-minuten pauze. We komen terug en duiken in dieper. Dus we zijn weer terug, en we hebben soort van kuierde rond in een paar verschillende richtingen hier. Dus laten we samenvatten precies wat er hier aan de hand. We begonnen het gesprek over deze taal genaamd HTML. Nogmaals, geen programmeertaal. Het is gewoon een opmaaktaal dat is grotendeels over esthetiek en structurering van de inhoud in de vorm van een webpagina. Maar HTML moet derhalve een soort van mechanisme voor het reizen tussen de webbrowser en de server. HTML dus soort van ritten op de top van deze andere taal, of beter gezegd, een protocol, bekend als HTTP. 

En HTTP, zoals we hebben gezien tot nu toe, is een soort van analoog aan deze menselijke conventie van handen schudden. Wanneer een browser wil vragen om een ​​pagina van een server, stuurt dat "get" verzoek van browser naar server, en vervolgens de server reageert met een nummer als 200, is alles oke, evenals de HTML of een slecht nummer, zoals 404, bestand niet gevonden. Maar ondertussen HTTP zelf niet het Internet, per se. HTTP is slechts een dienst, een kenmerk van het internet net als G chat is een andere dienst, net als e-mail is een andere dienst. Er is van alles wat we kunnen doen op het internet. HTTP is slechts een van die toepassingen. Dus op de top van - HTTP is op de top van iets anders die we niet bij naam noemen, zou u hebben gehoord van de naam, TCP / IP. Dus het verhaal dat we net te horen dat er alles over hoe gegevens reist van punt A naar punt b. En in dit geval, zoals we aan een zeer laag niveau router naar router naar router naar router, hoe de gegevens daadwerkelijk worden verzonden. Maar langs de weg, gaat het om diverse belemmeringen tegenkomen. Naast deze routers, zijn er dingen die genoemd firewalls op het internet, en zo data, zoals we gewoon zenden van mij naar Stanford, van mij naar Cambridge, zijn overgedragen op dit niveau zoiets als een IP-adres. We zagen dit even geleden, en een IP-adres is slechts een numeriek adres van de vorm w.x.y.z, waarbij elk van deze tussen, plus of, 0 en 255, maar je kunt niet echt gebruik maken van alle van de nummers. Maar elk van deze plaats houders is een getal tussen 0 en 255. Dus een IP-adres van deze dag is 32 bits. 

Nu, dat geeft ons hoeveel mogelijke IP-adressen in de wereld? Ongeveer 4 miljard, omdat elke keer dat we tellen in machten van 2 helemaal tot 32 van iets, dat geeft ons meestal 4 miljard. Dus dat is een veel IP-adressen, maar u heeft kunnen lezen, of u kunt nu zien in de populaire pers, een duw in de richting van een nieuwe versie van IP, IPv6 genaamd. Op dit moment gebruiken we versie 4. Er is echt geen sprake is van een versie 5, we gewoon springen recht op 6. Versie 6 gaat 128 bits te gebruiken voor IP-adressen, die is freaking enorm. We moeten niet uit nu draaien al geruime tijd, maar we zijn begonnen met het opraken van versie 4 IP-adressen, omdat alle van ons hebben niet alleen zaken als laptops en desktops, veel van ons hebben telefoons, veel van ons hebben andere apparaten zoals TiVo en dergelijke die een IP-adres zelf. Harvard zelf heeft tienduizenden computers. Dus de wereld is echt te weinig IP-adressen, althans van dit formulier. Dus in de komende paar jaar, ga je de adressen zien op uw eigen computers waarschijnlijk langzaam te veranderen als meer en meer bedrijven en universiteiten beginnen om de nieuwere versie te ondersteunen. Maar een IP adres is niet voldoende voor een computer om gegevens van computer b vragen. Omdat de computer b kan een server, en een server, zoals ik al eerder vermeld, kan trossen van de dingen. Het kan webpagina's te hosten, kan het een e-mailserver, het kan een Skype-server, kan het een G chatserver. 

Al deze verschillende diensten die kunnen worden aangebracht op een server kunnen allemaal, fysiek op dezelfde machine. Dus naast IP adressen, de wereld heeft dingen geroepen poorten op het Internet. Een poort is maar een getal, dus er is een uniek nummer voor HTTP. Het nummer is 80. HTTP gebruikt ook nummer 443, maar meer in het bijzonder, voor versleutelde HTTPS. Wanneer u de s te zien, voor een veilige, dat is een ander nummer gebruikt. Er zijn andere getallen, zoals 25, voor een zogenaamde SMTP, ook bekend als email. Er is zoiets als 22 voor SSH, en er is een hele hoop andere havens die er zijn. Nu, wij mensen zelden zien deze getallen. Echter, wanneer u typt in een adres, zoals http://www.facebook.com, de browser is het geheim het plaatsen van 80, omdat je met behulp van HTTP. Als u, in plaats daarvan, type HTTPS, het is stiekem het plaatsen van 443. En we kunnen soort van handmatig zien of ik trek een brower en ga naar http://www.facebook.com:80. Dan ook expliciet onder vermelding van niet alleen de naam van de website maar de poort die ik wil met je praten, en druk op enter. Let op het verdwijnt, omdat de browser aanneemt, oh, 80, ik ben niet eens gaan om moeite waaruit blijkt dat aan u. Maar de reden hiervoor is dat als ik echt wilde iemand een email te sturen, Ik zou het echt op te sturen naar hen op poort 25, dat wezen SMTP. Een beetje een oversimplificatie, maar sommigen van jullie hebben vrienden die daadwerkelijk werken op Facebook, en zij, op dezelfde wijze, hebben servers die e-mail te ontvangen. 

Elke keer dat je een email sturen, is wat gmail voor je doet of Outlook of wat programma dat u gebruikt, Het is een soort geheim invoegen van dat nummer zo goed, 25, in dat geval. Het is deze combinatie van IP-adres en het nummer dat uniek is voor een computer op het internet en een specifieke dienst op die computer. Nu, natuurlijk, hebben de meesten van ons waarschijnlijk nooit handmatig ingetypt een IP-adres. Misschien heb je in het apparaat, maar in de echte wereld, niet zo veel. Waarom hebben we niet typen IP-adressen in browsers? Het zou werken, in feite, kunnen we dit zien, laat me u tonen een andere opdracht die maximaal moeten overal op de campus van Harvard te werken op een Mac of een PC. Er is een commando genaamd nslookup, nameserver lookup. Als ik kijk omhoog www.cnn.com, blijkt dat CNN heeft - oh, interessant. CNN is begonnen met behulp van Amazon Web Services. Misschien ken je van cloud computing, Amazon is een van de grote spelers in cloud computing. Wat ik net deed was, zei ik: 'Geef mij het adres van de website van CNN-server,' maar het blijkt dat CNN de webserver wordt beheerd door Amazon, Amazon Web Services, suggereert dit. En het adres van die server is dit hier. Dus ik weet niet zeker of dit zal werken, omdat ze niet gebruikt worden om Amazon te gebruiken. Maar laten we proberen dit, http://, IP-adres, voer, en - gaat het werken? Ja. Het gaat werken. Internet is super-slow vandaag. Maar, in een moment, zie je wat nieuws verhaal. Daar gaan we dan. Bank of America is aangeklaagd. Oke. 

Dit komt omdat dit IP-adres toevallig door synoniem met www.cnn.com. Natuurlijk zou het vreselijk marketing te zeggen, ons te bezoeken op het web op 50.112.94.127. Je zou nooit herinneren. Dus zelfs deze dagen u wellicht herinneren dingen zoals 1-800-COLLECT of geheugensteuntjes de wereld kwam met voor telefoonnummers. Die vóór mobiele telefoons, waren nogal moeilijk te onthouden totdat je kon gewoon typ het in en vergeet het. Dus het web, ook heeft deze conventie van namen en IP-adressen, en er zijn deze dingen die er geroepen DNS-servers, domeinnaam systemen servers, die IP-adressen te vertalen naar namen en vice versa. Dus dat is wat er aan de hand onder de kap. Op het einde hebben we TCP / IP, dat is deze zeer low-level protocol die echt, net krijgt 0's en 1's over het internet, en doet dit door ze in een virtuele enveloppe, als je wil, en het schrijven aan de buitenkant van de envelop het IP adres van de bestemming, en de numerieke poortnummer van de dienst op die bestemming te willen praten. Ondertussen, op de envelop is er ook iets bekend als een retouradres, dat is uw IP-adres, zodat wanneer CNN een pakket van informatie krijgt van u, opent deze virtuele enveloppe, ziet dat je de home page wilt, hij weet van de afzender deel van deze virtuele enveloppe die aan de HTML terug te sturen naar. Dus laten we eens een kijkje op deze in iets meer detail. Dit is van een bedrijf met de naam Ericson, van een paar jaar terug. En ze enkele vrijheden genomen met de manier waarop het internet eigenlijk werkt, maar het schildert een veel visueel beeld dan alleen maar krijt hier. Dus ik geef je "Een beetje van het internet." 

[Narrator] Voor de eerste keer in de geschiedenis, mensen en machines werken samen, het realiseren van een droom. Een verenigen kracht die geen geografische grenzen kent. Ongeacht ras, geloof of kleur. Een nieuw tijdperk en waarbij communicatie daadwerkelijk brengt mensen samen. Dit is De Dageraad van het Net. Wil je weten hoe het werkt? Klik hier om uw reis te beginnen in het Net. Nu, precies wat er gebeurd als je klikt op die link? Je begon een stroom van informatie. Deze informatie reist in uw eigen persoonlijke postkamer waar de heer IP-pakketten het, labels, en stuurt het op zijn manier. Elk pakket wordt beperkt in omvang. De postkamer moet beslissen hoe de informatie te verdelen en hoe het te verpakken. Nu, de verpakking moet een etiket met belangrijke informatie zoals adres afzender, ontvanger adres en het type pakket is. Omdat dit bijzondere pakket is uit te gaan op het internet, het wordt ook een adres voor de proxyserver, die heeft een speciale functie, zoals we later zullen zien. Het pakket wordt nu gestart op uw lokale netwerk of LAN. Dit netwerk wordt gebruikt om alle lokale computers verbinden " routers, printers, enzovoort, voor de uitwisseling van informatie binnen de fysieke muren van het gebouw. De LAN is een vrij ongecontroleerd plaats, en, helaas, ongelukken kunnen gebeuren. De snelweg van het LAN zit vol met alle soorten informatie. Dit zijn IP-pakketten, Novell pakketjes, AppleTalk-pakketten. Ze gaan tegen het verkeer in, zoals gewoonlijk. De lokale router leest het adres en, indien nodig, heft het pakket op een ander netwerk. Ah, de router. Een symbool van controle in een schijnbaar ongeorganiseerd wereld. [Router mompelen en praten met zichzelf] 

[Narrator] Daar is hij, systematisch, onverschillig, methodische, conservatief, en soms niet helemaal op de hoogte. Maar hij is exact, voor het grootste deel. Als de pakketten laat de router, ze maken hun weg naar de corporate internet en ga naar de router switch. Een beetje efficiënter dan de router, de router switch speelt zo nauw nemen met IP-pakketten, behendig routing hen op hun weg. Een digitale 'Pinball Wizard,' als je wil. [Router-schakelaar in gesprek met zichzelf] [Narrator] Zoals pakketten op hun bestemming aankomen, ze opgepikt door de netwerkinterface, klaar om te worden verzonden naar het volgende niveau. In dit geval de proxy. De proxy wordt gebruikt door veel bedrijven als een soort van een man midden om de belasting van de internetverbinding verminderen en om redenen van veiligheid, als goed. Zoals u kunt zien, de pakketten zijn allemaal van verschillende grootte, afhankelijk van de inhoud ervan. De proxy opent het pakket en zoekt naar het webadres of URL. Afhankelijk of het adres aanvaardbaar het pakket doorgestuurd naar het Internet. Er zijn echter een aantal adressen die niet voldoen aan met de goedkeuring van de proxy. Dat wil zeggen, bedrijfs-of management richtlijnen. Deze worden summier behandeld. We zullen niets van dat. Voor degenen die het, het is weer op de weg. 

Next up, de firewall. De firewall van het bedrijf dient twee doelen. Het voorkomt nare dingen van het internet kunnen komen om het intranet, en het kan gevoelige bedrijfsinformatie ook voorkomen worden verzonden uit op het internet. Eenmaal door de firewall, een router pikt het pakket en plaatst deze op een veel smallere weg, of bandbreedte, zoals wij zeggen. Uiteraard is de weg is niet breed genoeg om ze allemaal te nemen. Nu, je kunt je afvragen wat er gebeurt met al die pakketten die niet te maken langs de weg. Wel, toen de heer IP niet ontvangen een bevestiging dat een pakket is ontvangen te zijner tijd, stuurt hij slechts een vervangende pakket. We zijn nu klaar om de wereld van het internet in te voeren. Een spinnenweb van onderling verbonden netwerken die onze hele wereld omspannen. Hier, routers en switches verbindingen tot stand brengen tussen de netwerken. Nu, het Net is een totaal andere omgeving dan vindt u binnen de beschermende muren van uw LAN. Out hier, het is het Wilde Westen. Veel ruimte, veel mogelijkheden, genoeg dingen om te verkennen en te gaan plaatsen. Dankzij de zeer weinig controle en regulering, nieuwe ideeën te vinden vruchtbare grond om de envelop van hun mogelijkheden te duwen. Maar door deze vrijheid, bepaalde gevaren ook op de loer liggen. Je weet nooit wanneer je de gevreesde ping van de dood te ontmoeten, een speciale versie van een normale aanvraag ping, die een of andere idioot bedacht te verknoeien nietsvermoedende gastheer. Het pad onze pakketten te nemen kan via de satelliet, telefoonlijnen, draadloze, of zelfs transoceanische kabel. Ze hebben niet altijd de snelste of kortste routes mogelijk, maar ze zullen er uiteindelijk wel. Misschien is dat waarom het soms ook wel "The World Wide Wait." Maar als alles goed werkt, kun je omzeilen de hele wereld vijf keer meer dan bij de daling van een hoed, letterlijk. En de kosten van een lokaal gesprek of minder. Tegen het einde van onze bestemming, vinden we een andere firewall. 

Afhankelijk van uw perspectief als een datapakket, de firewall kan een bastion van veiligheid of een gevreesde tegenstander te zijn. Het hangt allemaal af van welke kant je staat en wat je bedoelingen zijn. De firewall is ontworpen om u te laten in alleen die pakketten die haar criteria voldoen. Deze firewall werkt op de poorten 80 en 25. Alle pogingen om in te voeren via andere poorten worden gesloten voor het bedrijfsleven. Poort 25 wordt gebruikt voor e-mail pakketten, terwijl poort 80 is de ingang voor pakketten vanaf het internet naar de webserver. Binnen de firewall, worden pakketten grondiger gescreend. Sommige pakketten maken het gemakkelijk door de douane, terwijl anderen zien er net een beetje dubieus. Nu is de firewall officier niet gemakkelijk voor de gek houden, zoals wanneer deze ping of death pakket probeert zich te vermommen als een normale ping pakket. [Firewall officier praten om pakketten] [Narrator] Voor die pakketjes gelukkig genoeg om het te maken zo ver, de reis is bijna voorbij. Het is gewoon een line-up op de interface te worden opgenomen in de webserver. Tegenwoordig kan een web server draaien op veel dingen, van een mainframe naar een webcam op de computer op uw bureau. Waarom niet uw koelkast? Met de juiste setup, kun je erachter komen of je hebt de ingrediënten voor Chicken Cacciatore, of als u om te gaan winkelen. Vergeet niet, dit is het begin van het Net. Bijna alles is mogelijk. Een voor een worden de pakketten ontvangen, geopend, en uitgepakt. De informatie die ze bevatten, dat wil zeggen, uw verzoek om informatie, wordt doorgestuurd naar de webserver. Het pakket zelf is gerecycled, klaar om opnieuw te worden gebruikt, en gevuld met uw gevraagde informatie, aangepakt, en verzonden op weg terug naar jou. Terug langs de firewall, routers, en verder door naar het internet. Terug door uw firewall en op uw interface, klaar om uw web browser te voorzien van de informatie die u hebt aangevraagd. Dwz deze film. Blij met hun inspanningen, en het vertrouwen van de betere wereld, onze trouwe datapakketjes afrijden zalig in de zonsondergang van een andere dag, wetende dat ze hebben hun meesters goed bereikbaar. Nu, is dat niet een happy end? [Malan] Oke, dat is genoeg. We zien je volgende week. [CS50.TV]