[Powered by Google Translate] [Tydzień 7, ciąg dalszy]
[David J. Malan, Harvard University]
[To jest CS50.] [CS50.TV]
Dobrze. Welcome Back. To CS50,
i to jest koniec tygodnia 7.
Tak więc jeden z tych głupich rzeczy małych, że idzie w całym internecie
i slurped, i teraz powinna się trochę naukowy sens dla Ciebie.
Cóż, to było zabawne do tego faceta, niż było do was.
Mówiąc o, no, chłopaki,
dziś są urodziny Nate'a.
Aby dać ci poczucie Nate'a jak dobry i ja
na rozwój sieci w oparciu o klasy poniedziałkowej i opiera się na tym,
Myślałam, że podciągnąć stronę Nate'a do domu, jeśli nie widziałeś jeszcze.
To tutaj HTML IA Nate'a.
Więc zobaczyć jego kodu źródłowego, jeśli chcesz zobaczyć, jak to zrobić, i Nate,
czy możemy embarass Cię tak krótko, że personel ma coś dla ciebie
jeśli chcesz podzielić się deser niektóre z dzieci w klasie tutaj.
Jeśli chcesz przyjść na dół.
Wszyscy przyklasnąć i są bardzo ładne, ale nikt nie siedzi gdzieś w pobliżu Nate'a,
z jakiegoś powodu, w tej strefie tylnej.
Więc może można znaleźć niektórzy ludzie cieszyć te z.
Happy Birthday, Nate.
>> Dodatkowe hellos: pokazaliśmy kilka klipów z naszych CS50x studentów.
Jeśli chciałbyś, aby zobaczyć, kto jeszcze jest na świecie
który jest po wzdłuż, można wybrać się do tego adresu URL,
gdzie Joseph, jeden z naszych TFS, zebrała montaż rodzaju
każdego, kto został przekazującym te filmy, wśród nich Rick Astley.
A jeśli przewijać nich, to naprawdę bardzo inspirujące
aby zobaczyć różnorodność krajów i miast, z których ludzie są wywoływania.
Więc jeśli chcesz, aby spojrzeć na to, że będzie się do końca semestru.
Dzisiaj kontynuujemy nasze spojrzenie na sieci, programowania WWW, HTML i tym podobne,
i my również lunch zbliża się w ten piątek
jeśli chcesz, a zwłaszcza, nie zrobiłeś tego wcześniej.
Motyw ten piątek będzie mieć urodziny Nate'a,
więc jeśli chcesz zjeść obiad urodzinowy z Natem
i inni, niektórzy z naszych przyjaciół z branży,
proszę głowę do tego URL tam.
Space, jak zawsze, jest ograniczona. Ponadto, jeśli nie pamiętasz,
sobie sprawę, że w przyszłym tygodniu mija termin problemu ustalonym 4 w Scavenger Hunt,
której po odzyskaniu tych wszystkich plików JPEG z card.raw,
ty i twoi koledzy z sekcji, jeśli chcesz, możesz spróbować fotografować
jak wielu informatyków z tej karty pamięci, jak to możliwe,
i ty i twój punkt będzie wygrać wspaniałe nagrody.
Odsyłają do PSET 4 specyfikacji, co do złożenia i do kiedy.
Ponadto, jeśli chcesz, aby Twoja dzieło uwiecznione
na kurs na stronie internetowej i jej historii odzieży,
wiem, że są mile widziane teraz, aby rozpocząć składanie projektów
na tegoroczne T-shirty i bluzy i tym podobne.
Dołożymy wszelkich starań, aby to tak wiele, jak to możliwe,
ale musimy niektórych członków personelu przeglądu wszystkich projektów
aby upewnić się, że są zgodne ze specyfikacjami,
i następnie wybrać ogólnie kilka z nich, które mają być wystawione.
Więc jeśli jesteś typ konstrukcji, po prostu wiem, że wymagania
dla grafiki PNG, co najmniej 200 DPI,
nie powinno być więcej niż 4000 x 4000 pikseli,
i nie więcej niż 10 MB, ale zapraszamy do korzystania rzeczy jak
Photoshop lub GIMP lub różne programy, graficzny
co masz do dyspozycji.
>> Również na horyzoncie jest projekt końcowy. Ostateczny projekt jest naprawdę kulminacyjnym 50,
przy czym wszystkie w trakcie zadań,
To Twoja szansa naprawdę robić własne rzeczy.
A to może być po prostu zrobić coś dla zabawy,
można go rozwiązać jakiś palący problem, grupa studentów ma,
jakiegoś nowego serwisu, niektóre nowy mechanizm zbierania danych.
To może być mobilna aplikacja dla Androida, dla iOS.
Naprawdę, niebo jest granicą, a w ciągu najbliższych kilku tygodni,
jak przejście z C do tych wyższego szczebla języków takich jak PHP i JavaScript,
znajdziesz się w coraz większym stopniu zapoznał się z niektórych technik w świecie rzeczywistym,
niektóre rzeczywistych narzędzi, oraz uzupełnienie, że
wiem, że kurs ma historię seminariów,
przy czym w ciągu najbliższych kilku tygodni, niektórzy z pracowników dydaktycznych
i przyjaciele naszego od kampusu będzie oferować opcjonalne seminaria
które wykraczają poza to, co zazwyczaj odbywa się w sekcji
wprowadzenie do rzeczy jak programowanie Android
wprowadzenie do rzeczy takich jak iOS programowania
lub bardziej zaawansowanych web-rozwoju techniki.
Jest cała historia to już online.
Jeśli pójdziesz do cs50.net/seminars, robiliśmy to już od jakiegoś roku,
, a zobaczysz, że w archiwum tutaj z plikami PDF i filmy oraz jak
kilka filmów kilkanaście seminariów.
W zeszłym roku, na przykład, mieliśmy seminarium acing swój technicznych wywiadów,
jeśli rzeczywiście chce pójść i zrobić staż lub w pełnym wymiarze czasu koncertu.
Windows mobile rozwój, rozwój Android, Google Maps,
API, CSS, opracowanie dla BlackBerry, Emacs.
Naprawdę, proszę spojrzeć na którykolwiek z tych seminariów w Twojej wygody.
A my będziemy się trzymać kilka nowych w tym semestrze, jak również.
>> Więc co jest do przodu z końcowego projektu?
Cóż, po pierwsze, nawet jeśli ta data jest dość bliskie,
to jest naprawdę tylko okazja, aby zacząć myśleć o końcowym projekcie całkiem realistycznie.
Wiemy tylko początki część tego, co będziemy nadal obejmujące w trakcie,
HTML, PHP i jak, ale wszyscy jesteście zaznajomieni z sieci,
i stronniczość tę rozmowę w kierunku sieci tylko dlatego, że
większość osób robi opartych na sieci Web finałowych projektów,
ale to wcale nie jest wymagane.
Przy użyciu C jest w porządku, celem C, Java,
inny język może wiesz lub chcesz wiedzieć, jest całkiem w porządku.
Jednak, aby uzyskać soki płynące początkowo będziemy oczekiwać przedstawienia preproposal
co, za PDF na stronie internetowej, która jest teraz w cs50.net,
i na górze po lewej stronie zobaczysz ostateczny projekt
jest specyfikacja końcowego projektu,
i jest na preproposal szczegóły i podobne.
To dość dużo sprowadza się do e-mail do kolegów nauczycieli
tylko nawiązać rozmowę z niego o tym, co myślisz.
Na projects.cs50.net jest skarbnicą pomysłów od ludzi na kampusie
Jeśli nie radzisz sobie wymyślić jakiś pomysł,
i manual.cs50.net/APIs jest repozytorium linków do API.
>> Co jednak jest API?
Co jest API? Powiedziałem to co najmniej dwukrotnie,
według stenogramu z ostatnich kilku tygodni.
Co to jest? [Student, niezrozumiały]
>> Dobrze. Więc interfejs programowania coś.
Interfejs programowania aplikacji, a to może przybierać różne formy,
ale co to tak naprawdę sprowadza się do jest kod
że ktoś inny hs pisemnych lub danych, które ktoś inny zebrane
że jest dostępne dla Ciebie w jakiś sposób programowy.
Można napisać kod w C, PHP, Python, Ruby,
niezależnie od języka z wyboru jest zazwyczaj,
i można jakoś opierać cudzym funkcjonalności
lub ktoś inny zestaw danych.
Na przykład, jeśli pójdę na ten link tutaj
i zobaczysz parę linków na kolejnej stronie
w którym mamy własne API CS50 firmy, które są bardzo Harvard-centric, a następnie innej API.
Wśród API firm trzecich są naprawdę przydatne rzeczy
jak jest w stanie wysłać do ludzi SMSy,
jest w stanie odbierać wiadomości SMS od ludzi.
I takie rzeczy, że może nie masz pojęcia, jak do realizacji siebie,
ale dzięki usług, niektóre darmowe, a niektóre komercyjne,
można zbudować na szczycie tych, i zrobić coś dla ciebie.
Wśród API CS50 to są te campus-centric rzeczy jak
Kursy Harvard, energii, imprezy, jedzenie, mapy, wiadomości, tweets i Shuttleboy własnej,
i są to interfejsy API, które wyglądają trochę coś takiego.
>> Pozwól mi wyciągnąć API HarvardFood.
Jeśli kiedykolwiek byłeś na stronie HUD jest, to prawdopodobnie tam nie było
po prostu zobaczyć, co jest na obiad lub zobaczyć, co godzina to dla niektórych d-hall.
Cóż, nie jest to szczególnie łatwe w obsłudze,
a więc to, co udało nam się już jakiś czas temu został pisaliśmy oprogramowania
zdarza się w PHP, które rzeczywiście ekran scrapes całość stronie HUD jego.
Do przeszukiwania coś skrobać oznacza napisać program w językach takich jak PHP
że udaje się przeglądarki, choć można go uruchomić w wierszu polecenia,
że udaje się przeglądarki, łączy się na stronie internetowej,
pobiera jej HTML, język, w którym jest napisane,
a następnie otrzymuje się, lub bardziej konkretnie, przetwarza go
od góry do dołu, od lewej do prawej.
A co zrobiliśmy było pisaliśmy nasz kod w taki sposób, że
każdym razem gdy widziałem coś w tym HTML, który wyglądał jak coś w menu,
jak hamburger, chcemy zaimportować, że w naszej własnej bazy danych.
I za każdym razem widzieliśmy odżywczych, możemy importować, że w naszej własnej bazy danych.
I to, co zrobił, było wykorzystać fakt, że HUD na stronie internetowej,
chociaż może to być nie lada wyzwaniem dla nas, ludzi, aby przejść
pod maską, wszystkie HTML są generowane przez ich programów komputerowych.
Tak więc wszystkie ich HTML, choć może to wyglądać niechlujny,
jak większość witryn internetowych pod maską wynika wzór.
Więc po prostu spędziliśmy kilka godzin na zastanawianie się, że wzór
tak, że w końcu, które wyrzucamy cały bałagan HTML,
wszystkie estetyki okładziny i kursywą pogrubioną i podobnych,
i czym jesteśmy wtedy w stanie zrobić, to narażać, że te same dane.
Na przykład, w ten sposób.
Tak więc, zgodnie z dokumentacją tutaj,
poinformowali świat, że jeśli poprosisz o adres URL
, który wygląda tak, food.cs50.net / coś,
i zapewnienia pewnych parametrów, które będziemy dziś mówić,
jak koniec daty czasu, data rozpoczęcia czasu, posiłek i tak dalej,
co nasze serwery powróci do was, na przykład,
jest plik CSV, comma separted wartości takich jak pliku Excel,
zawierający wszystko na śniadanie na tej konkretnej daty w marcu ubiegłego roku
kiedy stało się napisać tę dokumentację.
>> Dla tych, którzy znają, CSV, nie tylko w formacie pliku.
Jest inny format to wszystko bardziej uniwersalny
nazywa JSON, JavaScript Object Notation.
Dane mogą wrócić w tym formacie.
Więc jest to, że na wynos czy nurkowania w tym API
lub inny z CS50 męskie lub coś tam w Internecie,
lub w ogóle nie uświadomić sobie, że świat coraz bardziej zaczął standaryzować
w jaki sposób komputery są połączone ze sobą.
Stosujemy standardowe formaty danych, takie jak CSV lub JSON.
I co to oznacza dla ciebie można napisać ciekawą część programu
, które umożliwia użytkownikowi przeszukiwać dining-hall menu
który pozwala im tworzyć listy ulubionych, które pozwala im otrzymywać powiadomienia SMS
gdy ich ulubiony posiłek ma być podawane w niektórych d-hall
używając cudzego zestawów danych i budowaniu na górze ich API.
Więc więcej na ten temat w formie seminariów i dokumentacją, że masz tutaj online.
Tak więc ci, a następnie są API.
>> To prowadzi nas z powrotem do HTML. Szybkie podsumowanie.
Co to jest HTML?
[Student, niezrozumiały] >> Good. HyperText Markup Language.
Ktoś inny, co to jest Hypertext Markup Language?
HyperText Markup Language.
Okay. Więc HTML, HyperText.
HyperText prostu odnosi się do sieci, w przeważającej części.
Markup oznacza, że ​​nie jest właściwie językiem programowania, HTML.
To nie język, który można wyrazić logikę widok jest
Nie ma pętli. Nie ma warunków.
Nie posiada funkcji, per se.
Przeciwnie, ma ona te rzeczy zwane tagi, lub bardziej poprawnie, elementy.
I te elementy mają znaczniki początkowe i znaczniki końcowe,
lub otwarte i zamknięte tagi tagi i co te tagi zazwyczaj oznacza dla przeglądarki jest,
zacząć robić coś, a potem przestać coś robić, choć istnieją wyjątki od tego.
Czasami jest to po prostu "umieścić podział wiersza tutaj," na przykład.
I widzieliśmy przykłady tego dnia inny, między pogrubioną okładziny,
podziały wiersza, a następnie kilka innych tagów.
Więc HTML jest językiem, w którym strony są napisane.
Tak więc, jeśli pójdę na coś jak Google.com
i pociągnij tylko ich stronę główną,
Przypomnijmy, że jeśli klikniesz prawym przyciskiem myszy lub sterowania kliknij
i spojrzeć na źródło strony, zazwyczaj
to kompletny bałagan w tych dniach pod maską, ale to dlatego, że
komputery nie dbam o białej przestrzeni, więc to nie musi ładnie wyglądać.
Ale jeśli powiększyć jej części,
zauważyć, że Chrome, po prostu być miły, jest kolorami rzeczy.
Rzeczywiście, jest to pierwszy tag, który widzieliśmy na stronie internetowej.
I znowu, HTML 5, najnowsza wersja tego języka,
ma to coś na początku,
<! Doctype html, czy małe i duże,
ale to po prostu swego rodzaju standardem, który mówi, hej świat, oto plik HTML w wersji 5.
>> Najciekawsza część zaczyna się tutaj. Więc <html, a następnie było dwoje dzieci
z elementów HTML, ostatni raz.
Czym były te dwa główne dzieci?
Głowa i ciało, tak jak facet z tatuażem chwilą.
Istnieją dwie części stronie, głowa i ciało,
i pamięć, a następnie, że być może najprostszym strona moglibyśmy wygląda.
A ja go po prostu wcięte być rodzaj czysty i schludny z mojego kodu,
ale to, co naprawdę ważne jest to, że istnieje jakaś hierarchia tego.
I każdy znacznik, że mam otwarte już zamknięte i że nie ma w związku z tym ta symetria
do wszystkich znaczników, które stworzyłem.
Więc ostatni raz, kiedy zacząłem pisać stron internetowych na własnym laptopie.
Otworzyłem edytować tekst, zapisane plik jako hello.html,
Potem wyciągnął plik na mojej przeglądarce, i voila, miałem stronę w Internecie.
Teraz, to nie całkiem przypadek znajduje; miałem stronę na dysku twardym,
i byłem dosłownie jedyną osobą na świecie, która by zobaczyć, że strony WWW w przeglądarce.
>> Więc dzisiaj, wprowadzamy rzeczywisty serwer WWW
i pojęcie rzeczywistości służąc treści w Internecie
i jak to wszystko zaczyna do siebie pasować.
Tak więc okazuje się, że przez cały ten czas w CS50 urządzenia
miałeś serwer WWW na komputerze.
Mamy, w uczciwości, tylko używali go do gedit dla Clang na GDB i tym podobnych,
ale również instalowane przez nas dla Ciebie w urządzeniu jest serwer WWW,
i że serwer WWW dzieje się wolne, open source,
jeden z najbardziej popularne na świecie, zwany Apache.
Jego nazwa jest bardziej techniczna HTTPd, d jest dla demona tutaj
które jest słowo techniczne serwerze.
Tak zainstalowany w CS50 urządzenia jest serwer WWW, a co to znaczy?
Cóż, serwer WWW jest pojęciowo jakiś serwer w Internecie, który służy do internetowej treści.
Gdy poprosiłem o pliku, zwraca kod HTML, który komponuje ten plik, i voila.
Można zobaczyć niektóre witryny stronę główną.
Ale serwer jest dokładniej kawałek oprogramowania.
Nie musi to być na fizycznej urządzenia, to po prostu musi być element do uruchamiania oprogramowania.
Więc CS50 urządzenia, oczywiście, jest to oprogramowanie
nawet jeśli jest to coś w rodzaju udając maszyna.
To udaje się wewnątrz komputera z komputera,
ale to tylko oznacza, że ​​urządzenie z pewnością może uruchomić takie rzeczy jak serwery www.
Może faktycznie uruchomić serwery pocztowe.
Możemy uruchomić serwer wiadomości w urządzeniu, jeśli chcieliśmy,
i rzeczywiście, mamy uruchomić jeden inny typ serwera, znane jako serwera baz danych MySQL.
Ale o tym w przyszłym tygodniu.
Oznacza to, że faktycznie mogę odwiedzić stron internetowych
wewnątrz z mojego urządzenia za pomocą przeglądarki wewnątrz urządzenia
lub nawet na moim laptopie, mój Mac czy mój PC.
Więc co to znaczy? Okazuje się, że za każdym razem używasz komputera z systemem Linux,
jego nick to "local host."
Nie masz nazwy domeny, bo nie kupił nazwę domeny
na coś takiego urządzenia, więc jego domyślna nazwa to host lokalny.
>> Jednak w celu uzyskania urządzenia, aby rozpocząć wyświetlanie się stron internetowych,
musimy stworzyć je w pierwszej kolejności.
Więc zróbmy to. Pozwólcie mi iść do okna terminala tutaj
i zauważ, że jestem w moim typowym John Harvard zachęty.
Pozwól mi iść dalej i wpisz ls i zobaczymy kilka znanych rzeczy z tego semestru,
desktop, pliki do pobrania, dropbox i tak dalej,
ale teraz zaczynają się obracać naszą uwagę na parę.
Na wielu serwerach Linux internetowych jest jeszcze to folder o nazwie public html,
ale mamy zamiar pominąć, że jeden na teraz i skupić się na tym, vhosts.
Ktoś wie co vhost jest?
Tylko głupi żargon dla wirtualnego hosta,
i co to oznacza to, że na typowym serwerze
rzeczywiście można obsługiwać wiele stron.
Możesz kupić nazwę domeny jak foo.com i możesz udostępniać je na serwerze.
Ale można też kupić bar.com i udostępniać je na tym samym serwerze.
Powodem jest, przeglądarki są wystarczająco inteligentny, aby poinformować serwer
gdy użytkownik żąda jakąś stronę internetową, jaka nazwa domeny użytkownik chce główną dla.
Więc co jest miły o to nie musisz jeden fizyczny serwer
lub jeden CS50 urządzenie dla każdej witryny może chcesz utworzyć.
Możesz użyć tego samego serwera i rozwijać setki różnych stron internetowych.
I rzeczywiście, jeśli jesteś osobą, próbuje uruchomić stronę internetową,
czy dla przyjemności lub w celach biznesowych, zazwyczaj musisz iść w Internecie,
i będziesz płacić komuś dziesięć dolarów miesiąc, sto dolarów miesięcznie
gospodarzem swojej stronie internetowej dla Ciebie.
A sposób, w jaki działa jest ich ładowania innych ludzi
dziesięć dolców miesięcy lub sto dolców miesiąc
gościć strony innych ludzi na ich samym serwerze.
Powodem mogą zrobić, to dlatego, że z tej funkcji o nazwie bhosts,
ale o tym, kiedy nadejdzie czas na ostateczne projekty.
>> Na razie, po prostu nurkować tam. Więc vhosts cd i jeśli wpisz ls teraz
zauważyć, że jest tam folder o nazwie host lokalny.
To dlatego, że domyślnie dane appliance
masz kiedykolwiek zamiar uruchomić jedną stronę na urządzeniu.
To nie jest prawdziwy świat, nie jest to w świecie rzeczywistym serwer WWW.
Więc pozwól mi iść do lokalnego komputera, a teraz zobaczymy tam
ostatnia katalog o nazwie HTML.
Więc to trochę głęboki, hierarchia, ale czy i kiedy
zdecydujesz się rozpocząć tworzenie wielu stron internetowych w ciągu najbliższych miesięcy lub roku n,
ten rodzaj struktury folderów bywa pomocny.
A teraz chodźmy do HTML jak właśnie zrobił,
ls, i nic nie ma.
Więc teraz idziemy do przodu i to zrobić. Pozwól mi otworzyć Chrome
wewnątrz urządzenia, i pozwól mi iść do http://localhost.
Tak dosłownie nazwa mojego urządzenia, wprowadzić i uzyskać indeks /.
To nie jest tak naprawdę pokazuje mi nic ciekawego,
ale okazuje się, że to, co widzimy, jest to, że folder, HTML.
Nie ma nic w środku tego folderu teraz,
więc zamiast tego, co mam zamiar zrobić, to najpierw utworzyć plik.
Utwórz plik HTML tak jak my w poniedziałek, ale tym razem umieścić go wewnątrz urządzenia.
Dla tych z Was, którzy starają się podążać z laptopami teraz
pozwól mi zrobić jeden bok to będzie uwzględnione w Pset internetowej,
ale aby uzyskać to do pracy po raz pierwszy,
masz zamiar uruchomić tego polecenia: sudo uruchomić httpd service.
A to znów, będzie powtarzany w ostatnim PSET,
ale jeśli grasz razem teraz w domu, serwer WWW
jest wyłączony w urządzeniu, i to tak, że sok nie do RAM
i pamięć do 7 tygodni z semestru, kiedy nie jest to potrzebne.
Więc musisz uruchomić to polecenie raz, a dostaniesz wyjście takiego.
To powinieneś być w stanie grać tutaj.
Teraz wróćmy do tego folderu.
Ten folder jest pusty, więc pozwól mi rozpocząć tworzenie pliku,
gedit hello.html.
>> Dobrze. Gedit jest otwarte, jak zwykle. Pozwól mi zrobić doctype, html,
html, daj mi przed siebie i zacząć zamykając tagi w góry.
Teraz mam na głowie. Pozwól mi iść dalej i zamknąć głowę
chciałbym teraz zrobić tytuł strony, hello world jak ostatnim razem,
blisko tytuł, teraz pozwól mi ciało.
Tu powiem cześć, świat z pewnymi exclams
wyjaśnić, że jest to inny ciąg.
Blisko ciała, a teraz pozwól mi iść dalej i złożyć zapisać.
Pozwól mi wrócić do mojego okna terminala, a jeśli wpiszę ls
Mam, prawdopodobnie, patrz hello.html. I ja.
Więc teraz wróćmy do mojej przeglądarce, kliknij przeładować
i widać, że rzeczywiście są wewnątrz tego HTML folderze.
Nie widzę jeszcze strony WWW, jest to Apache, serwer WWW,
tylko pokazuje mi zawartość listy tego katalogu.
Podobnie jak w Mac OS lub Windows będzie zazwyczaj zrobić na własnym lokalnym dysku twardym.
Więc jeśli chcesz zobaczyć tę stronę, mogę kliknąć ten mały link tutaj, hello.html,
i rzeczywiście, to, co spodziewałem się zobaczyć.
Teraz znów, nie URL, że każdy z Was może odwiedzić właśnie teraz jest,
bo dla Ciebie, host lokalny, jeśli masz laptopa tutaj
to odnosi się do własnego przykładu urządzenia.
To jest na moim własnym urządzeniem osobistym,
, ale jest to swego rodzaju głupi dla mnie mieć, mieć
użytkownik taki jak ja, kliknij na hello.html rzeczywiście zobaczyć zawartość tej strony.
Okazuje się, że serwery takie jak Apache pozwalają mieć plik domyślny dla każdego serwera.
Zauważcie, mamy hello.html.
Co znajduje się w systemie Linux polecenia, aby zmienić nazwę pliku?
>> MV dla ruchu. Więc pozwól mi to zrobić,
i pozwól mi zmienić nazwę hello.html do index.html.
Pozwól, wpisz ls potwierdzić to teraz została zmieniona.
Teraz to będzie - jeśli wrócę do lokalnego komputera,
zauważyć, że jestem teraz automatycznie widząc, że stronę internetową.
To jest identyczne do mojego rzeczywiście robi / index.html,
ale miłą rzeczą jest teraz, że serwer www jest zastanawianie,
oh, jeśli masz plik, który według ludzkich konwencji, nazywa index.html,
pozwól mi pokazać użytkownikowi, że plik domyślnie
zamiast jakiejś głupiej listy katalogów, które nie jest wcale łatwy w obsłudze.
Rzeczywiście, większość odwiedzanych witryn w Internecie nie ma listy plików do kliknięcia,
oni po prostu pokazać zawartość. Więc tak, jak możemy zrobić, index.html.
Więc to wszystko jest zabawne i dobre, ale jest to dość prosta strona internetowa.
Pozwólcie mi iść do przodu i otworzyć plik index.html w moich vhosts,
lokalne gospodarze, html katalog, a dodajmy coś większego zainteresowania.
Więc nie hello world, niech zamiast powiedzieć: "To jest CS50, Harvard College. . ".
Więc początek opisu katalogu kursów jakiejś tam.
Teraz jeśli przeładować, należy to zobaczyć na mojej stronie domowej.
Okay, i widzę, że, ale załóżmy, że chcę teraz kilka więcej zawartości w tym pliku.
Mogłem iść na dół i, że żadne warunki wstępne,
chociaż niektórzy z was zapewne jak "Ha ha ha, żadnych wymagań wstępnych."
Ale - oficjalnie. Więc przeładować, a teraz mamy to samo dziwactwo, które widzieliśmy ostatnio.
Ale dlaczego tak jest? To był prosty fix.
Dlaczego ta strona działa?
[Student, niezrozumiały] >> Tak, mamy rozwiązane to przed
jawnie mówi przeglądarce umieścić podział wiersza tutaj.
A to dlatego, że jeszcze raz, tylko w przeglądarce zrobi
wyraźnie, co język znaczników mówi mu do zrobienia,
więc choć mogłeś trafić wprowadzić raz lub dwa, a nawet dziesięć razy,
to się połączyć to wszystko w jednym miejscu, tylko umownie.
Więc jeśli naprawdę chcesz końca linii, trzeba użyć znacznika br,
a teraz informacja, jak Poniedziałek, kładę / wewnątrz tego znacznika
tylko dlatego, że to po prostu nie czuję się dobrze
rozpocząć podział wiersza, a następnie zatrzymać go z nic pomiędzy.
>> Więc konwencja HTML jest do otwierania i zamykania tag jednocześnie.
Tak na marginesie, to zobaczysz wiele stron w książkach, nie robi tego.
Prawdą jest, zrobić lub nie robić, ale kłócimy
że projektowanie mądry i stylistycznie, to tylko lepiej
bo wtedy każdy tag jest zarówno otwierane i zamykane jakoś.
Więc teraz niech zapisać i przeładować. Idź z powrotem do przeglądarki, w porządku.
Teraz robimy pewne postępy, ale to nie wystarczy.
Idziemy do przodu i zacząć pisać w jakimś dłuższym korpusie tekstu.
Więc powiedzmy, "Szybki, brązowy lis skacze nad leniwym psem."
A teraz pozwól mi wystarczy skopiować i wkleić to kilka razy
tak, że mamy akapit tekstu.
Pozwól mi wrócić tutaj. Więc to nie wygląda bardzo dobrze.
Mam koniec linii, więc jest w porządku,
ale teraz, gdy stajemy się do tego stopnia, że ​​stronę internetową
że ma wiele treści, a nie tylko pojedyncze linie, aby wykazać HTML,
możemy zacząć myśleć o tych rzeczach jak rzeczywistych punktach.
I możemy zacząć kształtować naszą stronę trochę bardziej czysto.
I rzeczywiście, co mogę zrobić, to udać się tutaj, wewnątrz mojego znacznika body,
i wiesz co, jeśli "To CS50. . ". naprawdę demarks początek ustępu,
no, oznacz je jako takie.
Pozwól, że wcięcie tekstu, tylko umownie powiem
że ustęp kończy się tutaj,
a potem zamiast to zrobić podział wiersza, pozwól mi tylko powiedzieć
To, że nie należy w nowych i ust,
a ja po prostu szybko tiret tylko przez nadpisanie wszystkich tych rzeczy.
>> Więc teraz mamy wcięty akapit tam,
a teraz nasza markup zaczyna trochę więcej
semantycznie spójne z tym, co staramy się robić.
Mamy punkt, więc nazwijmy to ustęp z tagiem str.
Mamy drugi akapit, więc nazwijmy to ustęp z tagiem str.
A teraz, co przeglądarka będzie zwykle zrobić
jest tak jak w angielskiej książce lub eseju,
gdzie zwykle zobaczyć kilka linii przerw między akapitami.
Przeglądarki zrobi to za ciebie automatycznie.
Więc teraz mamy dwa punkty i możemy kontynuować.
Ale, oczywiście, w sieci, gdy masz ciała tekstu
nie jest to zwykle tylko ogromne bąble tekstu.
Są to często hiperłącza w tam.
Więc jeśli chcemy, na przykład, to kilka linków tam,
przypuszczać, co może być interesujące w cokolwiek strona Tworzę tu jest -
Pozwólcie mi odejść do Google.com,
i pozwól mi szukać Szybki, brązowy lis.
Idź do Google Images i, jak o - to jest słodkie.
Pójdziemy z tym. Mamy tu więc szybki brązowy skoki lisa nad leniwym psem.
Więc, co mam zamiar zrobić, po prostu ze względu na demonstracji
Przypuszczam, że jest to obraz był na moim serwerze,
i byłem tworzenia tych obrazów.
Co właśnie nie był prawym przyciskiem myszy lub kontrolować Kliknij na obrazek,
i to, co można zobaczyć w większości przeglądarek jest trochę menu -
przestać to robić - trochę menu, które pozwala wybrać Kopiuj adres odnośnika lub adres URL kopii.
Więc pozwól mi teraz wrócić do mojego HTML, i załóżmy, że chcę
do tego hiperłącza do innej strony internetowej.
>> Co było tag wezwał do tego?
[Student, niezrozumiały] >> Tak. Więc href dla hiper odniesienia.
Pozwólcie mi iść do przodu i wklej to widok
Jest to dość długi URL, więc pozwól mi powiększać powrotem.
Zamknij uchwyty, więc teraz zauważyć, że jestem tak tu
ponieważ URL stało się dość długo.
Pozwól mi przejść tutaj do końca Szybki, brązowy lis,
i pozwól mi zamknąć ten tag z </ a,
gdzie tylko zamknięte nazwę znacznika.
Teraz pozwól mi iść do przodu i zapisz plik, przeładuj stronę internetową,
i teraz, domyślnie, że zamierza być podkreślone na niebiesko dla mnie,
ale rzeczywiście, mogę teraz kliknij na to i voila. Jest to obraz.
I nie trzeba być zdjęcie, które może zostały powiązane
do innej losowej stronie w Internecie.
Mogę to zrobić, na przykład, z CS50, więc jeden ostatni przykład tutaj.
"To jest CS50" może mieć sens iść, href =
http://www.cs50.net blisko cytat, blisko kotwica.
Więc teraz, że jest nawet krótszy URL, i tym razem nie będziemy się na link do obrazka.
Jesteśmy natomiast dzieje się na link do innej strony.
Teraz mamy obraz tutaj.
Czuję się jak można zrobić trochę lepiej, niż tylko z linkami do obrazu.
Co zrobić, jeśli chcemy rzeczywiście ucieleśniają to w naszej własnej stronie internetowej?
>> Cóż, co mogę zrobić, o to, a nie odnośnik do tej grafiki,
pozwól mi zamiast wyciąć URL, a my się pozbyć tego hiperłącza i oczyścić to.
I idziemy na dół i pozbądź się tego.
Tak naprawdę nie potrzebujesz tych wszystkich zdań teraz, więc niech mi skrócić stronie trochę.
A potem tu pozwól mi iść do przodu w nowym akapicie
powiedzieć, że nie chcesz, aby tekst teraz, chcę obraz, którego źródłem będzie, że URL.
Obraz, podobnie jak koniec linii, jest albo nie lub nie.
Więc pozwól mi natychmiast zamknąć ten tag.
Pozwól mi iść dalej teraz i zamknąć ust, że jestem w środku,
i jeśli wszystko pójdzie dobrze z hello, world, jeśli przeładowanie teraz
I, rzeczywiście, patrz prawo wewnątrz własnej strony obrazu.
Więc teraz mamy znacznik obrazu, taga i tym podobne,
i na dokładkę, pozwól mi zrobić jedną rzecz, która jest często pomijanej
na stronach internetowych tych dni: Chcę zapewnić pewne tekst opisu dla tego obrazu
dla ludzi, którzy są na urządzeniu przenośnym
i dlatego nie może być w stanie pobrać ten plik bardzo szybko,
dla osób niewidomych i może nie być w stanie zobaczyć obraz
ale mogą one mieć czytnik ekranu, który może im powiedzieć, co ten obraz jest.
A do tego jest jeszcze inny atrybut dla znaczników obrazu
zwany alt, dla alternatywnego tekstu.
A co można zrobić tutaj jest powiedzieć: "To jest szybkie, brązowy lis.
Tak, że nawet jeśli człowiek nie może zobaczyć obraz na ekranie,
może on przynajmniej słyszeć, jak w niektórych oprogramowanie o
co faktycznie jest tam na ekranie.
>> To nie zmieni estetykę strony,
ale z pewnością jest to dobra praktyka dla użytkowników.
Dobra, zostawmy tą stronę w jego obecnej formie,
ale zobaczymy, jeśli nie możemy teraz wprowadzić
niektóre lepsze podejście do pisania tych stron,
lekcje, które będzie służyć nam także nasze strony coraz bardziej złożone.
To, czego nie zrobimy w ciągu najbliższych kilku tygodni
jest przejść przez wszystkie z wielu znaczników HTML kilkunastu, że istnieją.
Podobnie jak w zera już w tydzień 0, to prawdopodobnie nie wystarczy
dać ogólny przegląd niektórych pojęć,
szybkie zwiedzanie niektórych blokach to prawdopodobnie stanie,
całkiem wygodnie, aby przejść na własną rękę, do różnych puzzli.
I tak się stanie ponownie w HTML, najprawdopodobniej,
w której istnieje duży zasoby w sieci, że będziemy wskazywać na Państwa,
różne podręczniki, jeśli wolisz czytać podręcznik,
który przeprowadzi Cię przez wszystkie różne rzeczy można zrobić z HTML,
ale naprawdę, widzieliśmy do tej pory w HTML większość podstawowych pojęć.
Mamy pojęcie tagów otwierane, tagi zostały zamknięte.
Niektóre znaczniki, które są zarówno otwarte i zamknięte
w tym sensie, że są puste, nie powinny być z nich środka nic
jak znacznika obrazu lub przerwy w przewodzie, które są po prostu tam.
Przyglądaliśmy się także już w pojęciu atrybutu, jak alt lub źródła.
Zauważ, że te słowa mają tendencję, zgodnie z konwencją, być krótkie i zwięzłe.
>> Nie musimy decydować, co te rzeczy są nazywane,
ktoś kto wymyślił HTML wymyślił tych nazw.
Więc po prostu trzeba zacząć wiedzieć czy patrzeć, kiedy tylko ich potrzebujesz,
jakie imiona są dla tych znaczników i atrybutów.
W przypadku tych atrybutów, przypisuje ogólnie
zmodyfikować zachowanie pewnego znacznika.
W tym przypadku, źródło mówi atrybut obrazu znacznik
czym źródło obrazu należy.
Atrybut href opowiada tagu zakotwiczenia, co powinno być w rzeczywistości linkami do.
Ale w zakresie struktury strony, chociaż Facebook
i Google i jak wygląda kompletny bałagan
pod maską na pierwszy rzut oka, jeśli zaczniesz czytać przez niego
bardziej metodycznie, oni wszyscy idą to podstawowe, podstawowe struktury.
Ale możemy poprawić stylizację z tych rzeczy.
Więc pozwól mi iść do kilku przykładów, że przygotowane wcześniej.
Pozwólcie mi iść do przodu i skopiować je z innego folderu tutaj
i umieścić je w tym katalogu.
Z góry, co zrobiłem było przygotować kilka plików:
search0, search1, search2 i search3 i 4.
Pozwólcie mi iść do przodu i otworzyć pierwszy z tych plików,
i zobaczymy, jeśli nie możemy zacząć tworzyć własne wyszukiwarki.
Na górze tego pliku, jak to zwykle bywa w klasie, tylko kilka uwag.
W HTML, jednak środki, które pozwalają uruchomić komentarz
jest <- i to jesteś wewnątrz komentarza, multi-line komentarzy.
Kiedy będziesz gotowy, aby zatrzymać ten komentarz, możesz to zrobić ->.
Więc wszystko na górze w kolorze niebieskim jest tylko komentarz.
>> To jest moja deklaracja DOCTYPE, która ponownie
można po prostu skopiować i wkleić na wierze, na teraz.
To właśnie mówi przeglądarce, "Here Comes niektóre HTML 5".
Poniżej, na linii 14, to pierwszy z moich rzeczywistych tagów
i to po prostu mówi, jak poprzednio, oto niektóre HTML,
tutaj jest szefem mojej stronie, oto tytuł,
i odwrotnie, że jest to w tytule, to jest na głowicy.
Tutaj teraz jest ciało mojej stronie.
Więc kilka nowych znaczników h1 stoi teraz: dla pozycji 1.
Istnieje tradycja w HTML na wiele lat wstecz
o różnych rozmiarach z tekstu.
I ponownie w dniu, każdy oznacza, ogólnie, tak duży i pogrubienie.
Ale jest też h2, który jest duży, ale nie aż tak duże i odważne.
Jest h3, co jest raczej duży, ale nie aż tak i śmiały,
i tak dalej, aż w dół do h6.
Te dni, choć, H1, H2 i H3 są naprawdę oznaczało
mieć bardziej zrozumiały dla nich
przy czym h1 to naprawdę pozycja: nagłówek na stronie internetowej,
nagłówek kolumny lub coś takiego tekstu.
Więc już świadomie powiedział h1 CS50> szukaj h1
aby je określić, że jest to naprawdę pozycja, tytuł mojej strony.
Nie w tym sensie tytuł pasku tytułu
ale tytuł, że rzeczywiście widzą w samej witryny internetowej, w organizmie.
Teraz to, można się domyślić, co to jest
choć mamy kilka nowych kawałków składni.
Jest to forma. Tak naprawdę robi się ciekawie web
gdy strony pobierać dane od użytkowników.
W tej klasie, w problem ustawiony na programowaniu stron internetowych,
nie zamierzamy zrobić stronę internetową, per se,
z zawartości statycznej, który pokazuje zdjęcia, które zostały podjęte,
czy to jest moje CV, a rzeczy o mnie,
bo te rzeczy są stosunkowo łatwe do wprowadzenia razem.
Trudno, aby rzeczy piękne w sieci,
ale przynajmniej umieszczania treści jest dość trywialne.
Ale robi się naprawdę interesujące, kiedy ktoś może odwiedzić stronę internetową
i zapewniają wejście i mogą wypełniać formularze,
mogą sprawdzić się pola wyboru i może współdziałać z Twojej strony.
I rzeczywiście, prawdopodobnie każda strona Ci zależy
te dni, w szczegóły, jest w jakiś sposób interaktywny.
Facebook, Google, i tym podobne, które podjąć wejściowych użytkownika
i produkować dostosowane wyjście.
>> Zacznijmy więc zrobić to teraz. Niech teraz przejście
z tylko za pomocą znaczników HTML dla zawartości statycznej
bo zamiast mechanizm opłat dynamicznej zawartości.
I do tego celu, niech realizować własne wyszukiwarki.
Zróbmy to w następujący sposób. Oto tag formularza.
Atrybut action określa, że ​​gdy użytkownik wypełnia ten formularz
z klawiaturą, zostanie on przedłożony do tego adresu URL tutaj.
Więc jestem rodzajem oszustwa. To zajmie nam trochę dłużej
niż jedna klasa do wdrożenia całego wyszukiwarki,
więc musimy po prostu zrobić z przodu, że tak powiem.
Zrobimy część, która umożliwia wyszukiwanie użytkownika, a będziemy sortować Punt do Google
Najtrudniejsze znalezienia wyniki wyszukiwania,
ale konkretnie, zamierzam porozmawiać z serwera Google
przy użyciu jednej z dwóch metod bardzo popularne.
Jedna jest uzyskać, inny, że uda nam się w końcu zobaczyć, jest post,
choć istnieją inne, które są rzadziej używane.
Więc po prostu kojarzy się pomysł, chcę trochę treści, trochę wyniki wyszukiwania.
To, można być może wiecie co to robi.
To jest jakiś rodzaj wejścia, to w rzeczywistości będzie wyglądać polu tekstowym,
a nazwa tego wejścia, nazwa tej zmiennej, by tak rzec,
zostanie q do kwerendy przez konwencję.
I znów, Typ wejście to nie będzie pole;
nie będzie menu, to będzie to pole tekstowe
jak oznaczone tym atrybutem tutaj, a tym polu tekstowym,
jak koniec linii, jest albo czy nie.
Więc mamy pusty element z ukośnikiem wewnątrz tego tagu.
Potem mam zamiar umieścić podział wiersza, a można, być może, odgadnąć, co to będzie zrobić.
To jest inny rodzaj pola formularza.
>> Ten będzie używany do złożenia formularza.
Więc to będzie duży przycisk, który użytkownik może kliknąć, aby wysłać formularz,
i oznakowanie na tym przycisku będzie "CS50 Szukaj".
Zamknij formularz, blisko ciała, blisko HTML.
Zobaczmy, co mamy w postaci strony internetowej.
Więc pozwól mi iść do mojej przeglądarce,
puść mnie, jeszcze, na lokalnym komputerze.
To wciąż index.html, więc jeśli chcę zobaczyć ten plik o nazwie search0,
Można po prostu zrobić / search0.html wprowadzić -
i pierwszy z moich błędów.
Co się dzieje? I wyraźnie nie ma uprawnień
dostępu do tego pliku, z jakiegoś powodu.
Ale to dlatego, że, w przeciwieństwie do pracy zrobiliśmy do tej pory w C,
których programy piszesz są traktowane runable przez Ciebie,
wykonywalny przez Ciebie, to nie jest przypadek w internecie,
przy czym czasami może chcesz tworzyć pliki na serwerze,
ale nie chcesz cały świat, aby móc je zobaczyć.
Przeciwnie, chcemy świata, aby zobaczyć pliki
ale inni nie, tylko dla dobra firmy dotyczącej prywatności.
Tak więc jest to bardziej zasadzie opt-in, gdy robisz rzeczy w sieci.
A więc pozwól mi faktycznie wpisz ls tutaj
i zobaczyć pliki mam, ale przypominam, że jeśli zrobić ls-l na długo,
Wezmę dłuższy wpis, który daje mi trochę więcej szczegółów na temat tych plików
, które są obecnie bardzo, po raz pierwszy, odpowiedniego do nas.
Zauważ, że po prawej stronie są imiona moich plików,
i czas, w którym byli ostatnio zmienione lub skopiowane.
Numer ten tutaj jest, co? Czy pamiętasz?
Rozmiar w bajtach, jak duży jest to plik.
>> Tak więc wydaje się, że jakieś logo tutaj, że jest większy niż wszystkich pozostałych plików.
To, kim jestem, to jest to, co jestem i co grupa jestem w.
Ale potem, tu po lewej jest trochę tajemniczy sekwencji,
i rozmawialiśmy, jak sądzę, na chwilę o tym w przeszłości,
ale to ma do czynienia z uprawnieniami.
A nawet jeśli to trochę zamglone,
RW prawdopodobnie oznacza czytać i pisać.
Okazuje się, że te kreski oznaczają różne zestawy uprawnień dla różnych ludzi.
Wzór i jest zasadniczo w następujący sposób.
Kiedy widzisz sekwencję kresek tutaj, wyglądają następująco.
Jest kreska, to nie ma jeszcze trzy kreski,
Jest jeszcze kolejne trzy, to nie jest jeszcze trzy.
Pierwszym z nich jest albo myślnik lub jest to reklama w katalogu.
Tak, że jeden jest całkiem proste. Jeśli jest to folder, mówi d, w przeciwnym razie jest łącznik.
Jest kilka innych spraw, ale teraz musimy po prostu dbać o plikach i katalogach.
Te następne trzy kreski - a ja sztucznie wstawione spacje.
Były, oczywiście, nie tam, kiedy ich zobaczył chwilą.
Są właściciela pliku na uprawnienia,
i wycofanie się z sekundy temu, że został on czytać i pisać.
To dlatego, że ja, jako osoby, która utworzyła ten plik przed chwilą,
Ja, po prostu domyślnie na komputerze z systemem Linux,
mają zdolność do kontynuowania pisania i czytania tego pliku.
>> Więc system operacyjny po prostu daje mi RW automatycznie.
Środkowe te odnoszą się do mojej grupy, że studentów,
który jest rodzajem sensu na urządzeniu, bo jestem jedyną osobą korzystającą z urządzenia.
Więc niech mi tylko machać rękami na to teraz.
Ale te ostatnie są najbardziej istotne dla sieci Web.
To wszyscy na świecie, a fakt
że jest --- oznacza, że ​​nikt na świecie
ma wszelkie uprawnienia do tego pliku.
Oczywiście problem, więc trzeba to naprawić
by jakoś daje światu, co? Czytać i pisać?
To pewnie głupie, prawda? Nie chcę nikogo w internecie
, aby przejść do odwiedzenia mojej strony i jakoś zmienić ten plik,
chociaż tak naprawdę nie mógł z pliku HTML,
ale tylko w zasadzie, prawdopodobnie chcesz, żeby być w stanie go odczytać.
Co to znaczy, aby ją przeczytać? To nie znaczy, że będziemy dbać o rzeczywistej HTML,
ale przeglądarka musi być w stanie przetworzyć, że język znaczników,
od góry do dołu, od lewej do prawej.
Więc ktoś w sieci musi być w stanie go odczytać, więc minimalnie trzeba dać r.
Można to zrobić w kilka różnych sposobów, ale może
Najprostszym jest uruchomienie tego polecenia tutaj.
Chmod, tryb zmiany, a następnie + r więc wszyscy, każdy na świecie + czytać,
i nazwa pliku, search0.html.
>> Teraz, jeśli mogę zrobić ls-l znowu zauważyć, że plik został zmieniony,
i rzeczywiście, mam włączone r dla każdego.
Ja również włączeniu do mojej grupy, ale to jest w porządku,
bo gdybym zwrócił się w sprawie dla siebie, moja grupa jest podzbiorem tego.
Więc to jest w porządku. To po prostu oznacza, że ​​komputer poczynił on czytelny.
Teraz pozwól mi wrócić do mojej przeglądarce, kliknij przeładować.
Ah-ha. Mamy teraz CS50 Wyszukaj.
Mam powiększony trochę sztucznie - wyszukiwarka dość ohydne.
Ale zobaczymy, czy to rzeczywiście działa.
Po pierwsze, pozwól mi zrobić szybkie sprawdzenie kondycji, pozwól mi kontrolować kliknij i zobacz strony.
Zauważ, że w Chrome jesteśmy teraz widząc ten sam HTML, który sam stworzył.
Nie gubi się tutaj, choć. Nie mogę zacząć zmieniać kod tutaj,
bo przeglądarka ma tylko do odczytu widok tego kodu.
Przeglądarka właśnie poprosił lokalnego hosta do pliku o nazwie search0.html.
To jest teraz czysty przypadek, że urządzenie
dzieje się na tym samym komputerze, co mojej przeglądarce.
Może po prostu mieć, równoważnie, wpisałeś w www.facebook.com/search0.html,
i jeśli Facebook miał plik o nazwie, że chciałbym być następnie widząc ich HTML.
I, oczywiście, nie mogę zmienić plik, który wraca z Facebook, albo.
Więc teraz jesteśmy jakby zacierając granice.
Urządzenie jest zarówno serwer, służący do stron internetowych,
ale również klienta w tym sensie, że używam przeglądarki
faktycznie porozmawiać z tym serwerem.
Zobaczmy więc, czy moja wyszukiwarka Google działa.
Pozwól mi iść dalej i szukać Szybki, brązowy lis, wprowadź.
I voila, mam teraz własne wyszukiwarki.
>> Ale w jaki sposób to działa?
Trochę naciągane, ale - i teraz nie możesz zobaczyć, właśnie, część, która znajduje się interesujące.
Zauważ, co się dzieje.
Wskazówka URL. Okazuje się, że tę metodę,
nazywa dostać, jest super-proste.
Kiedy podasz w formularzu, że chcesz "dostać" Wyniki z jakiegoś serwera,
co to będzie zrobić, to wziąć cokolwiek wpisane w formularzu
i umieścić ją w adresie URL.
To będzie ujednolicenie sposobu pobiera umieścić w adresie URL w następujący sposób.
Zauważ, że jest to adres URL, który był moim wartość atrybutu akcji.
To miejsce, gdzie chciałem forma skończyć.
Ale wtedy zauważyć ten znak zapytania.
Jest to konwencja w sieci w której dostarczenie danych wejściowych użytkownika
na stronie internetowej, należy dołączyć do adresu URL znak zapytania,
i wtedy masz całą masę par klucz-wartość.
Nazwa klucza, inaczej znany jako parametr w sieci,
to masz znak równości, to masz wartość tego parametru.
Więc to jest w istocie nazwa zmiennej oraz wartość zmiennej,
Ale ci zmiennej nazwy i wartości pochodzą z formularza HTML.
Dlaczego plusy tam, jak myślisz?
Bo nie wpisać + w między moimi słowami.
[Student, niezrozumiały]
>> Tak, to jest właśnie dla odstępów. Szanse są, gdy widzieliście URL,
nigdy nie ma żadnych spacji w nim, choćby dlatego,
jeśli nie było, nie można było skopiować i wkleić
do IM lub do wiadomości e-mail, ponieważ byłoby to złamać.
Chcesz całość za jeden ciągły łańcuch znaków.
>> Więc przeglądarka jest wystarczająco inteligentny, aby zdać sobie sprawę, uh-uh.
Nie wystarczy umieścić spację tam. Pozwól mi zakodować przestrzeń w jakiś sposób standardowy.
Jednym z konwencji wykorzystać to mieć przeglądarkę
automatycznie umieścić + gdzie byś inaczej mieć miejsca.
Więc teraz, anons Google jest trochę łatwy w obsłudze.
I na pewno nie stworzył stronę internetową,
ale mają one oznakowane własne pole tekstowe
z tego, co właśnie, mam wpisane w.
Załóżmy, że chcę, aby szukać czegoś innego, jak leniwym psem.
Mogę tylko napisać to tutaj, re-search.
Zauważ, że adres URL zmienia się tutaj,
ale zauważ, wtedy faktycznie mogę wyszukać nic Chcę
tylko poprzez zrozumienie jak działają adresy URL.
Mogłem zrobić leniwy kot, wejść,
i zauważ, teraz dostaję bardzo leniwy - powinniśmy? Czuję, że powinienem.
Mam bardzo leniwego kota.
Dobrze. Jest to jedna z najgłupszych rzeczy, jakie zrobiłem.
Ale to jest leniwy kot.
Tak czy inaczej, co jest kluczem takeaway tutaj?
Teraz jesteśmy w rodzaju gry w świecie protokołu HTTP.
HTML jest właśnie to język znaczników, open tag, blisko tag,
, który mówi, jak przeglądarki do renderowania zawartości na stronie internetowej.
Ale po uruchomieniu przekazu danych w Internecie
między przeglądarką a serwerem, to gdzie ten protokół
znany jako HyperText Transfer Protocol przejmuje.
Jest to rodzaj ludzkiej konwencji, gdy Sam i uścisnęli sobie dłonie w poniedziałek,
rozpoczęcie połączenia, a następnie zamknięcie połączenia, sam pomysł tutaj.
Jak są wyniki Google wraca do mnie?
Jak jest przedłożenie forma idzie do Google?
Cóż, pamiętam z innego dnia, że ​​to, co się naprawdę dzieje
pod maską, gdy wniosek jest strona internetowa,
Twoja przeglądarka wysyła nieco-tajemnicze wiadomości jak
GET / HTTP/1.1 do domyślnej strony głównej.
>> Lub, w przypadku, w szczególności dlatego, że wymagane wcześniej
search0.html, to potem będzie nieco-cryptic wiadomość
że moja przeglądarka wysyła do urządzenia.
Lub, w tym przypadku Google, co się rzeczywiście wysłany
jest żądanie / search, i wtedy? q = leniwego kota, z plus tam.
Więc ta wiadomość, że ja, człowiek, nigdy nie piszę,
ale jest wysyłany przez moją przeglądarkę, to jest jak HTTP dzieje.
Odpowiada to po wytrząsanych naszych rąk.
To jest prośba, a serwer jest o wysłanie odpowiedzi.
Warto więc spojrzeć na to pod maską.
Jak poprzednio, możemy otworzyć tę specjalne pole w przeglądarce.
Zobacz stronę, sprawdź elementy.
Tak więc w ramach kontroli elementu, zauważysz, że co się stało w Chrome,
i IE i Firefox mają podobne mechanizmy,
mamy te narzędzia programistyczne dostępne dla nas.
Normalni ludzie nie używać tych kart.
Ale teraz, są zainteresowani tym, co się dzieje
pod maską na poziomie sieciowym.
Więc jeśli podciągnąć poziomie sieci tutaj
pozwól mi iść do przodu i rozwijać to okno,
otwórz ten wpis tutaj, i spojrzeć na nagłówki.
Więc co się dzieje, kiedy poprosić o plik z serwera WWW
to moja przeglądarka wysyła całą masę rzeczy.
I pozwól mi zobaczyć źródło. Więc pod nagłówki żądania,
i to jest właśnie Chrome pokazuje mi jakieś wyjście diagnostyczne,
coś w rodzaju jakiegoś debuggera,
zauważyć, że tego, co już podkreślono właśnie tu
Chrome wysyła do serwera w celu zażądania plik o nazwie search0.html.
To mówi serwerowi co myśli jego nazwa,
dzięki tej dziedzinie grubego gospodarza, to nie jest jakiś
dość ezoteryczne rzeczy tutaj, jak coś zrobić z dat i godzin,
coś zrobić z języków, że przeglądarka nie rozumie,
ale naprawdę ważne linie są te dwa pierwsze tutaj.
>> Co oznacza, że ​​serwer odpowie? Cóż, jeśli przewiń tutaj
i zobaczyć źródło tej rzeczy, zauważysz, że serwer
odpowiedziała wiadomości nieco tajemnicze, jak również, nie 304 modyfikowany.
To trochę dziwne, pozwól mi faktycznie spróbować to naprawić.
Pozwól, przytrzymaj Shift i kliknij załaduj tutaj
zmusić przeglądarkę do rzeczywiście zrobić ten wniosek po raz pierwszy.
Pozwól mi powiększyć, a my zobaczymy, że teraz odpowiedź serwera,
bo orzekł zmianę, jest 200 OK.
Więc prawdopodobnie nigdy nie widział numer 200
w ramach sieci, ale to, co liczb
ty czasami postrzegane niespodziewanie z serwera?
404, nie znaleziono pliku, 403, zakazane; 500, błąd serwera.
Więc to są te kody numeryczne, że świat używa w sieci
oznaczać błędy, podobnie jak funkcji C
mogą zwracać błędy i główny może powrócić kodów wyjścia.
200, choć rzadko można zobaczyć, ponieważ oznacza, że ​​wszystko jest dobrze.
I 304 prawdopodobnie nigdy nie zobaczyć, bo to, co jest to wyraźna?
Że nic nie ma - zobaczymy, czy możemy symulować to ponownie -
Och, teraz to nie współpracuje. 304 powiedział, modyfikowane,
więc dlaczego serwer nawet reagować?
Cóż, dla wydajności, serwer automatycznie dla Ciebie,
jeśli plik się nie zmienił, to nie będzie retransmisji całego pliku HTML.
To tylko poinformować przeglądarkę, że nie uległa zmianie.
Wystarczy skorzystać z kopii już masz.
Więc jest to pojęcie buforowanie w sieci
do wykonania, tak, aby nie tracić czasu i przepustowości odpadów
pobieranie plików ponownie i ponownie bez potrzeby.
>> Jednak ta strona, teraz, było super-proste,
i to tylko pokazał mi HTML, który wrócił.
Miejmy faktycznie używać kartę sieciową teraz zrobić wyszukiwania Google jak Quick Brown Fox.
Pozwól następnie kliknij CS50 wyszukiwania
i teraz, zauważył w dole tu cała masa rzeczy wróciły
bo kiedy odwiedzić prawdziwą stronę internetową jak Google.com,
mają obrazy, mają tekst, mają język zwany JavaScript nie.
Więc każdy wiersz w tej tabeli na dole
reprezentuje coś, że Google wypluł w odpowiedzi na moje pojedynczego żądania.
Jeden mi zależy, choć jest to pierwszy z nich.
A jeśli pójdę do poszukiwania, żądanie, kliknij przycisk Wyświetl źródło tutaj
zauważyć, że rzeczywiście tajemniczy komunikat, że moja przeglądarka wysłany
do Google właśnie te dwie linie tutaj
następnie jakiś tajemnej tu informacji, które będziemy ignorować teraz.
Ale zauważ też, co Chrome jest całkiem przydatny z,
to też pokazano mi ciąg kwerendy, który został wysłany w.
Tak więc, zamiast pokazać mi to, co było dosłownie wysłane,
gdybym go zobaczyć dekodowane, Chrome, tylko do celów diagnostycznych
dla programistów, takich jak my, to tylko pokazuje mi człowieka przyjazną wersję -
, że nie jest, jak się pisze lisa, najwyraźniej.
Chcę tylko zauważyć, to teraz - ale to pokazuje ci, co, zdaje się, wpisane.
Tymczasem odpowiedź, że wrócił z serwera jest znowu 200 OK.
Jednak w tej reakcji zawiera, oczywiście
jeśli faktycznie wyświetlić stronę w HTML -
Przepraszam, to jest trochę skrót klawiaturowy poszło na opak dziś.
>> Zajmę się tym później. Jeśli więc faktycznie wyświetlić stronę na źródło,
co mogę zrobić, klikając tu odpowiedzi,
to, co w rzeczywistości wypluć powrotem, oprócz tego tajemniczej 200 OK wiadomość z serwera.
Trochę tajemnicze, ale gdzie to wszystko się bierze?
Dobrze, zróbmy jedną rzecz tutaj. Innym nieco-tajemnicze polecenie,
Ale to jest rodzaj schludny, ponieważ ukazuje nam, co dokładnie dzieje się pod maską.
Więc jestem z powrotem na moim Mac tutaj, mam podłączony
poprzez program o nazwie SSH, Secure Shell, do innego serwera
ponieważ większość komputerów Harvardu blokować polecenia mamy zamiar uruchomić
bo jest to polecenie na niektórych serwerach nazywa traceroute
, który pozwala prześledzić trasę między punktami A i B,
i do tej pory byliśmy biorąc całkowicie za pewnik
że mogę wpisać w Google.com i jakoś uzyskać dane z powrotem
od połowy w całym kraju lub połowy, na całym świecie.
Z traceroute rzeczywiście możemy zanurkować głębiej
, jak działa Internet i zobaczyć, co się dzieje pod maską.
Więc idź naprzód i arbitralnie prześledzić trasę, powiedzmy, Stanford.edu,
który jest w całym kraju, i nacisnąć enter.
Polecenie to może być super-szybkie lub super-wolny,
ale co widzimy teraz, linia po linii,
jest każdy z etapów i chmielu między nami i Palo Alto lub Stanford,
których mają serwer.
Więc co każda z tych linii reprezentują bardziej konkretnie, chociaż?
Kawałek żargonu z Internetu? [Student, niezrozumiały]
>> Co to jest? [Student, niezrozumiały]
>> Och, więc nie są czasy, ale co każdy wiersz - co rozumiem przez hop?
>> Cóż, są takie rzeczy w Internecie, zwane routery.
I routery, jak sama nazwa wskazuje, informacje droga z punktu A do punktu B.
Ale istnieje kilka punktów poza A i B.
Jest c i d, e, f między wierszu 1,
co zdarza się mój adres IP komputera,
lub mój adres numeryczny, który jednoznacznie identyfikuje komputer,
i krok 15, który jest aktualnie szósty serwer WWW,
najwyraźniej, których jestem wywodząc z tego, lub w wersji 6 z ich serwera w Stanford.
Ale co to za miłe jest, możemy zobaczyć ścieżkę
że mój 0 i 1'S biorą z mojego komputera do Stanford.
Więc krok 1 jest moim własnym komputerze adres.
Każdy komputer w Internecie ma swój unikalny identyfikator, który wygląda tak.
Number.number.number.number.
Gdzieś na tym kampusie, prawdopodobnie w centrum nauki,
jest to router o nazwie Brama Core 2-te83, cokolwiek to znaczy,
więc jest to jeden z wielkich Harvardu routerów fantazyjnych, że trasy wiele ich ruchu.
Oto kolejny routerów Harvardu, ten jest Border Gateway,
Znaczenie granica to chyba na obrzeżach kampusu gdzieś.
Potem jest nox jeden, wiersz 4, który jest Northern Crossroads,
co jest dużym ISP, świadczący usługi internetowe,
że miejsca takie jak Harvard podłączyć do.
Ale wtedy robi się trochę interesujący zgodne 6.
Gdzie są moje bity nagle? Kansas.
Świat ma zwyczaj używania kodów lotniskowych w wielu tych rzeczy,
lub przynajmniej skrótów państw i miast,
więc wygląda na to, w zaledwie 60 ms,
pakiet informacji, 0 i 1 jest z mojego laptopa
ale na drodze do Kansas, i jeszcze raz, w 60 ms.
>> Ponadto, po Kansas, wzięli wycieczkę przez Houston, prawdopodobnie,
jak sugeruje nazwa tego serwera.
Tak, jak serwer w Internecie musi mieć adresu numerycznego,
może również, ewentualnie, są nieco bardziej przyjazny dla człowieka, że ​​adres wpadł ludzie.
Teraz, w kroku 8, nie wiemy, co to jest.
Czasami routery po prostu rodzaj cię ignorują,
i po prostu nie odpowiedzieć na pytania, tak, że jest w porządku.
Jeden po kroku 8 jest najwyraźniej gdzie? L.A.
Zauważ tylko 78 ms, co zajmuje nam ludzi jak 6 + godzin zrobić fizycznie,
bierze pakiety informacji w Internecie 78 ms podróżować tak daleko.
Krok 10 jest w LA, jak również, i krok 11 Wydaje się, że poszedł na północ, w górę w pobliżu Stanford.
To jest ich granica routera lub router granicy.
A kroki para w Stanford, że ignorują nas,
i wreszcie docieramy do serwera WWW w zaledwie 87 ms.
Teraz wszystkie te liczby, na marginesie,
tylko powiedzieć, jak długo trzeba czekać na dane, aby uzyskać ode mnie
do każdego z tych routerów, i to nie jest akumulacyjne.
Co Ten program jest najpierw wysyła zasadniczo do pierwszego routera.
Następnie jeden do drugiego routera, a następnie jednego do trzeciego routera
pomiar każdorazowo. Tak w teorii, te czasy będą rosły
lub przynajmniej bardzo blisko siebie,
, a nawet te, które są tutaj na kampusie są super małe.
Jak najszybciej zacząć chodzić w całym kraju, to ma danych
trochę dłużej, aby podróżować, bliżej 100 ms, lub dać.
Ale idziemy w innym kierunku teraz. Jak o Uniwersytecie Cambridge w Wielkiej Brytanii?
Pozwól, że zamiast biegać traceroute z www.cam dla Cambridge,
. Ac do akademika,. Uk, i nacisnąć enter tutaj.
To było cholernie szybko.
Moje dane dosłownie poszedł do Cambridge w Anglii, w tym ułamku sekundy czasu.
>> Zobaczmy więc ścieżkę, która zajęło.
Harvard, Harvard, Harvard, Crossroads Północne,
które jest ISP, a następnie jest Northern Crossroads, i Bam.
Co jest między etapami 6 i 7, router 6 i 7?
Ocean Atlantycki. A my wywodząc to z faktu, że
przechodzimy od 20 ms do 80 ms, o tutaj.
Więc coś zabrał 60 ms, lub dać, aby dostać się.
I to był chyba duży akwen.
Co się dzieje potem? Cóż, jesteśmy w Londynie,
tylko 88 ms później. More London, bardziej London,
nie wiem gdzie to jest, ale zakładamy, że jest to poza Londynem,
Cambridge tutaj, i wreszcie - dosłownie, University of Cambridge
. Something.net, a następnie, w końcu, w linii 16,
ich serwer jest najwyraźniej nazwie Scorpius
pod maską, chociaż wiemy jak www.
Kind of mind-blowing, myślę. Pierwszy raz, kiedy to zrobił, to całkowicie wiał mój umysł.
Niestety, ten rodzaj Harvard blokuje ruchu, zazwyczaj w sieci.
Więc nie można zrobić to bardzo łatwo.
Sobie sprawę, że, możliwe jest to tutaj.
Dobrze. Weźmy naszą 5-minutową przerwę tutaj. Wrócimy i zanurkować głębiej.
Więc jesteśmy z powrotem, a my trochę ambled o w kilku różnych kierunkach tutaj.
Warto więc podsumować dokładnie, co dzieje się tutaj.
Zaczęliśmy rozmowę mówi o tym języku zwanym HTML.
Ponownie, nie język programowania. To tylko język znaczników
który jest w dużej mierze o estetyce i strukturyzacji treści, w formie strony internetowej.
Ale HTML, zatem musi jakiś mechanizm
do podróżowania pomiędzy przeglądarką a serwerem.
HTML zatem rodzaj przejażdżki na górę innym języku,
a właściwie, protokół HTTP znane.
>> I HTTP, jak widzieliśmy go do tej pory,
jest trochę analogiczna do tej ludzkiej konwencji ściskając ręce.
Gdy przeglądarka chce żądanie strony z serwera,
wysyła on, że "get" żądania z przeglądarki do serwera,
a serwer odpowiada z numerem jak 200, wszystko jest w porządku,
jak HTML lub jakiś zły numer, jak 404, nie znaleziono pliku.
Ale tymczasem, HTTP Internet sam w sobie nie jest per se.
HTTP jest tylko obsługa, cechą Internetu
podobnie jak G czat to kolejny serwis, podobnie jak e-mail jest inna usługa.
Jest różne rzeczy, które możemy zrobić w Internecie.
HTTP jest to jedna z tych aplikacji.
Więc na początek - HTTP jest na szczycie czegoś innego
których nie wspomina po imieniu, może słyszeliście według nazwy, protokół TCP / IP.
Zatem historia po prostu powiedziano mi, że wszystko jest ok.
jak dane podróżuje z punktu A do punktu B.
I w tym przypadku, widzieliśmy na bardzo niskim poziomie
router routerach do routera,
Jak dane rzeczywiście przesyłane.
Ale po drodze, to będzie napotkać różne przeszkody.
Oprócz tych routerów, są rzeczy, zwane firewalle w Internecie,
Dane i tak, na przykład, że po prostu przekazuje
ode mnie do Stanford, ode mnie do Cambridge,
jest wysyłane do, na tym poziomie, coś o nazwie adresu IP.
Przekonaliśmy się o tym przed chwilą, i adres IP
tylko numeryczny adres w.x.y.z formularza
gdzie każdy z nich jest między, lub dać, 0 i 255,
choć nie można całkowicie wykorzystać wszystkie z tych liczb.
Ale każda z tych posiadaczy miejsce jest liczbą od 0 do 255.
Tak adres IP tych dni jest 32 bitów.
>> Teraz, to daje nam, jak wiele można adresy IP na świecie?
Około 4 mld euro, ponieważ za każdym razem liczymy w kompetencji 2
wszystko aż do 32 z czymś, co zwykle daje nam 4 miliardów.
Tak, że jest wiele adresów IP, ale można przeczytać,
lub można teraz zauważyć w prasie popularnej,
Push ku nowej wersji IP zwany IPv6.
Teraz używamy wersji 4.
Tam naprawdę nie było w wersji 5, po prostu prawo do 6 skoków.
Wersja 6 będzie korzystać 128 bitów dla adresów IP, które jest freaking ogromny.
Nie powinno zabraknąć od dłuższego czasu,
ale zaczęliśmy zabraknie wersji 4 adresów IP,
bo każdy z nas ma nie tylko takie rzeczy jak laptopów i komputerów stacjonarnych,
Wielu z nas ma telefon, wiele z nas ma inne urządzenia
jak TiVo i podobne które mają adresy IP się.
Harvard sam ma dziesiątki tysięcy komputerów.
Więc świat jest rzeczywiście zabraknie adresów IP, co najmniej z tej formy.
Tak więc w ciągu najbliższych kilku lat, będziesz widzieć adresy
na własnych komputerach prawdopodobnie powoli zmieniać
jak coraz więcej firm i uniwersytetów zacząć wspierać nowszej wersji.
Jednak adres IP nie jest wystarczająca do komputera na żądanie danych od B komputerowego.
Ponieważ komputer b może być serwer,
i serwer, jak już wspomniałem, może zrobić bukiety rzeczy.
Można go obsługiwać strony internetowe, może to być serwer pocztowy,
może być Skype serwera może być serwer Język G.
>> Wszystkie te różne usługi, które mogą być przewidziane na serwerze
mogą wszystkie, fizycznie, na tym samym urządzeniu.
Tak więc oprócz adresów IP,
Świat ma rzeczy zwane porty w Internecie.
Port jest tylko numer, więc nie jest to unikalny numer dla HTTP.
Jego numer to 80.
HTTP wykorzystuje również numer 443, ale bardziej szczegółowo, na HTTPS zaszyfrowanych.
Gdy zobaczysz s, do bezpiecznego, która jest przy użyciu innego numeru.
Istnieją inne numery, takie jak 25, używany do czegoś, co nazywa SMTP, inaczej znany jako e-mail.
Jest coś, co nazywa się 22 dla SSH,
i jest tam cała masa innych portów tam.
Teraz my, ludzie rzadko widują te numery.
Jednak po wpisaniu w adres jak http://www.facebook.com,
Przeglądarka jest potajemnie wkładając 80, bo jesteś za pomocą protokołu HTTP.
Jeśli zamiast tego typu HTTPS, to potajemnie wkładając 443.
I możemy trochę zobaczyć to ręcznie, jeśli podciągnąć się Brower
i przejdź do http://www.facebook.com:80.
Dlatego wyraźnie nie przytaczając tylko nazwę strony internetowej
ale port, że chcę rozmawiać, i nacisnąć enter.
Zauważ, że zniknie, ponieważ przeglądarka zakłada
oh, 80, nie jestem nawet będzie przeszkadzało pokazując, że do Ciebie.
Ale powodem jest to, że gdybym naprawdę chciał wysłać komuś e-mail,
Chciałbym naprawdę być wysłanie go do nich na porcie 25, że będąc SMTP.
Trochę w uproszczeniu, ale niektórzy z was mają przyjaciół
którzy faktycznie pracują na Facebooku, i oni, podobnie się serwery, które otrzymują e-mail.
>> Za każdym razem, wysłać e-mail, co gmail robi dla Ciebie
lub Outlook lub cokolwiek programu używasz,
To coś w rodzaju potajemnie wstawienie tego numeru, jak również, 25, w tym przypadku.
Jest to kombinacja adresu IP i numer, który jednoznacznie identyfikuje
komputer w Internecie i danej usługi na tym komputerze.
Teraz, oczywiście, większość z nas prawdopodobnie nigdy nie wpisany ręcznie adres IP.
Może masz w urządzeniu, ale w realnym świecie, nie tak dużo.
Dlaczego nie wpisać adresy IP w przeglądarkach?
Że to działa w rzeczywistości, możemy zobaczyć to, pozwól mi pokazać
jedno inne polecenia, które powinny pracować niemal wszędzie na terenie kampusu Uniwersytetu Harvarda na komputerze Mac lub PC.
Jest to polecenie nazywa nslookup, name lookup serwer.
Jeśli spojrzeć www.cnn.com, okazuje się, że ma CNN - oh, ciekawe.
CNN zaczęła używać Amazon Web Services.
Może wiesz z cloud computing, jednego Amazona z wielkich graczy na cloud computing.
Co właśnie nie było, powiedział: "Daj mi adres serwera WWW CNN"
ale okazuje się, że serwer WWW CNN jest zarządzane przez Amazon,
Amazon Web Services, to sugeruje.
I adres tego serwera jest to tutaj.
Więc nie jestem pewien, czy to będzie działać, bo nie używałem Amazon.
Ale spróbujmy; http://, adres IP, wprowadź i -
to będzie działać?
Tak. To będzie działać. Internet jest super-slow dzisiaj.
Ale w chwili, widać jakąś historię wiadomości.
Proszę bardzo. Bank of America jest pozwany. Dobrze.
>> To dlatego, że ten adres IP okazuje się przez synonimem www.cnn.com.
Oczywiście, to byłoby straszne marketing powiedzieć, odwiedź nas w internecie na 50.112.94.127.
Że nigdy nie pamiętam. Więc nawet te dni można przypomnieć rzeczy
jak 1-800-COLLECT lub mnemotechniki świat przyszedł z numerów telefonów.
Które przed telefonów komórkowych, były raczej trudne do zapamiętania
aż można po prostu wpisać go i zapomnieć o nim.
Tak więc w sieci, też ma tę konwencję nazw i adresów IP,
i tam są te rzeczy tam nazywa serwery DNS,
systemy domen serwery nazw, które przekładają adresów IP na nazwy i odwrotnie.
Więc to, co dzieje się pod maską.
W końcu mamy protokół TCP / IP, co jest to bardzo niski poziom protokołu
które, tak naprawdę, tylko dostaje 0 i 1 'przez Internet,
i czyni to poprzez wprowadzanie ich do wirtualnej kopercie
Jeśli będzie, i zapisu na zewnątrz obwiedni
IP adres przeznaczenia, jak również numer portu numeryczny
Świadczenie usługi na tym miejscu, że chce porozmawiać.
Tymczasem, na kopercie jest tam również coś znane jako adresu zwrotnego,
jaki jest Twój adres IP, tak, że gdy CNN dostaje pakiet informacji od Ciebie,
otwiera wirtualną kopertę, widzi, że chcesz, stronę domową,
wie ze strony nadawcy tego wirtualnego kopercie, do kogo wysłać z powrotem do HTML.
Warto więc spojrzeć na to w nieco bardziej szczegółowo.
To jest z firmy o nazwie Ericson, od kilku lat do tyłu.
Wzięli kilka wolności z jak Internet faktycznie działa,
ale maluje dużo bardziej wizualny obraz niż zwykły kredą tutaj.
Więc mam ci dać "nieco z Internetu."
>> [Narrator] Po raz pierwszy w historii,
ludzie i maszyny pracują razem, realizując marzenia.
Jednocząc siły, która nie zna granic geograficznych.
Bez względu na rasę, wyznanie lub kolor.
Nowa era, w którym komunikacja naprawdę łączy ludzi.
To
Dawn of the Net.
Chcesz wiedzieć, jak to działa? Kliknij tutaj, aby rozpocząć podróż do siatki.
Teraz, dokładnie to, co się stało po kliknięciu na ten link?
Początek przepływ informacji.
Informacja ta przemieszcza się w dół do własnego działu korespondencji osobistej
gdzie pakiety IP to Pan, Etykiety, i wysyła go na swej drodze.
Każdy pakiet jest ograniczony w swojej wielkości.
Pocztową musi zdecydować jak podzielić informacji
i jak się spakować.
Teraz pakiet potrzebuje etykietę zawierającą ważne informacje
jak adres nadawcy, adres odbiorcy, i typu pakietu jest.
Ponieważ ten konkretny pakiet wychodzi na Internet,
to otrzyma również adres serwera proxy,
która posiada specjalną funkcję, jak zobaczymy później.
Pakiet jest już wprowadzony na sieci lokalnej lub sieci LAN.
Sieć ta służy do połączenia wszystkich komputerów lokalnych "
routery, drukarki, etc, dla wymiany informacji w ramach fizycznych ścianach budynku.
LAN jest dość niekontrolowany miejsce, i, niestety,
wypadki mogą się zdarzyć.
Szosa LAN jest pełna wszelkiego rodzaju informacji.
Są to pakiety IP, Novell pakunki, AppleTalk pakiety.
Idą na ruchu, jak zwykle.
Lokalny router odczytuje adres i, jeśli to konieczne,
podnosi paczkę do innej sieci.
Ah, router. Symbol kontroli w świecie pozornie niezorganizowany.
[Router mamrocząc i mówić do siebie]
>> [Narrator] Tam jest, systematyczny, niedbały, metodyczne,
konserwatywny, a czasami nie do końca do prędkości.
Ale przynajmniej jest dokładnie, w przeważającej części.
Jak pakiety opuszczają router, one drogę do korporacyjnej sieci
i głowy dla przełącznika routera.
Nieco bardziej wydajne niż router, przełącznik Router odgrywa szybkie i luźne z pakietów IP,
zręcznie je wzdłuż trasy ich drodze.
"Pinball Wizard", w formacie cyfrowym, jeśli będzie.
[Switch Router mówić do siebie]
[Narrator] Jak pakiety docierają do miejsca przeznaczenia,
są one odbierane przez interfejs sieciowy,
gotowy do wysłania do następnego poziomu.
W tym przypadku proxy.
Proxy jest używany przez wiele firm jako swego rodzaju pośrednikami
w celu zmniejszenia obciążenia do internetu
oraz ze względów bezpieczeństwa, jak również.
Jak widać, pakiety są o różnych rozmiarach w zależności od ich treści.
Proxy otwiera paczkę i wygląda na adres strony internetowej lub adres URL.
W zależności od tego, czy adres jest dopuszczalne,
pakiet jest wysyłany do Internetu.
Istnieją jednak pewne adresy, które nie odpowiadają za zgodą pełnomocnika.
To znaczy, korporacyjnych lub zarządzania wytyczne.
Są doraźnym rozpatrywane.
Będziemy mieć nic z tego.
Dla tych, którzy czynią to, to na drodze ponownie.
>> Następna w kolejce, firewall.
Corporate firewall służy dwóm celom.
Zapobiega kilka raczej nieprzyjemnych rzeczy z internetu od najbliższych do intranetu,
i może również zapobiec poufnych informacji firmowych z wysyłaniu na Internet.
Raz przez firewall, router odbiera pakiet
i umieszcza go na znacznie węższym drogi, lub pasma, jak mówimy.
Oczywiście, droga nie jest wystarczająco szeroka, aby wziąć je wszystkie.
Teraz można się zastanawiać, co się dzieje z tymi wszystkimi pakietami, które nie czynią go po drodze.
Cóż, kiedy IP Pan nie otrzyma potwierdzenia
że pakiet został odebrany w terminie,
on po prostu wysyła pakiet zastępczy.
Jesteśmy teraz gotowi do wejścia w świat Internetu.
Pajęczyna połączonych sieci, które obejmują cały nasz glob.
Tutaj, routery i przełączniki ustalenia powiązań między sieciami.
Teraz Net jest zupełnie inne środowisko niż znajdziesz
w obrębie murów ochronnych sieci LAN.
Tu, to jest Dziki Zachód.
Dużo miejsca, wiele możliwości,
mnóstwo rzeczy do zwiedzania i miejsc do odwiedzenia.
Dzięki bardzo małej kontroli i regulacji,
nowe pomysły znaleźć podatny grunt naciskać na kopercie z ich możliwości.
Ale z powodu tej wolności pewne niebezpieczeństwa czają również.
Nigdy nie będziesz wiedzieć, kiedy spotkasz bał Ping of Death,
Specjalna wersja normalnego ping request
co jakiś idiota wymyślił bałagan niczego gospodarzy.
Ścieżka nasze pakiety wziąć może za pośrednictwem satelity,
linie telefoniczne, bezprzewodowe lub nawet transoceaniczna kablowych.
Oni nie zawsze najszybsze lub najkrótszej trasy możliwe,
ale będą się tam w końcu.
Może dlatego, że to jest czasami nazywane "World Wide Wait".
Ale kiedy wszystko działa sprawnie,
można obejść cały świat ponad pięć razy na każde skinienie, dosłownie.
I wszystkie z kosztów lokalnej lub mniej.
Pod koniec naszej podróży, znajdziemy inny firewall.
>> W zależności od punktu widzenia w pakiecie danych,
Firewall może być bastionem bezpieczeństwa lub przeciwnik bał.
Wszystko zależy od tego, na której stronie jesteś i jakie są twoje zamiary.
Zapora została zaprojektowana, aby wpuścić tylko tych pakietów, które spełniają jego kryteria.
Ten firewall działa na portach 80 i 25.
Wszystkie próby wejść przez inne porty są zamknięte dla biznesu.
Port 25 jest używany dla pakietów pocztowych
podczas gdy port 80 jest wejście dla pakietów z Internetu do serwera WWW.
Wewnątrz zapory pakiety są sprawdzane dokładniej.
Niektóre pakiety zrobić to łatwo przez odprawę celną,
podczas gdy inni po prostu wyglądać nieco wątpliwa.
Teraz oficer zapora nie jest łatwo oszukać,
np. gdy ten ping z pakietu śmierci próbuje zamaskować się jako normalnego pakietu ping.
[Oficer Firewall rozmawia pakietów]
[Narrator] Dla tych pakietów szczęście wystarczy, aby tak daleko,
podróż dobiega końca.
To tylko line up na interfejsie być wzięty do serwera WWW.
Obecnie, serwer może działać na wielu rzeczach,
z systemów mainframe do kamery internetowej do komputera na biurku.
Dlaczego nie twoja lodówka?
Przy właściwej instalacji, można dowiedzieć się, czy masz zadatki
dla Chicken Cacciatore, lub jeśli masz iść na zakupy.
Pamiętaj, że to świt Sieci.
Prawie wszystko jest możliwe.
Jeden po drugim, pakiety są odbierane,
otwarte i rozpakowane.
Zawarte w nich informacje, to jest prośba o udzielenie informacji,
jest wysyłana do aplikacji serwera WWW.
Pakiet sam w sobie jest ekologiczny,
gotowa do użytku kolejny, i wypełnione z żądanych informacji,
adresowane, i wysłał na jego drodze do ciebie.
Powrót przeszłości firewall, routery, a na drodze do Internetu.
Powrót za pośrednictwem korporacyjnej zapory
i na interfejsie,
gotowi dostarczyć swoją przeglądarkę internetową z informacjami, którego szukasz.
Oznacza to, że ten film.
Zadowolony z ich wysiłków, i zaufania do lepszego świata,
nasze pakiety danych zaufanych odjechać błogo do zachodu słońca z innego dnia,
znając pełni służyli swoim panom dobrze.
Teraz nie jest to szczęśliwe zakończenie jest?
[Malan] Dobra, wystarczy. Do zobaczenia w przyszłym tygodniu.
[CS50.TV]