[Powered by Google Translate] [Týden 9] [David J. Malan - Harvard University] [To je CS50. - CS50.TV] Dobrá. Vítejte zpět. To je CS50, a to je začátek týdne 9. Dnes jsme se zaměřili zejména na design, již v souvislosti s C ale v kontextu PHP a kouskem SQL a trochu JavaScriptu, zejména ke konci jak PSet 7 a také vaše konečný projekt. Ve skutečnosti, pokud jste v tomto bodě v konečné projektu kde pravděpodobně jako o hodinu nebo tak před vámi alespoň začala zamyslet do konečného projektu a myslíš si přejete spolupracovat s 1 nebo 2 spolužáky, pokud máte potíže s připojením s uvedenou spolužáky, neváhejte vyplnit formulář na cs50.net/partners/form. Je to jen zeptá, kdo jste, jaké projektu myslíš o tom, kde žijete jen pro logistických důvodů. A pak, pokud chcete sledovat v průběhu příštího týdne nebo tak tabulkového URL tam, pak můžete vidět jen pro čtení verze Google doc , ve kterém jsme shromažďování těchto informací. Takže pokud chcete pracovat s někým, a to všemi prostředky, neváhejte oslovit lidi prostřednictvím tohoto mechanismu. Ale většina lidí to práce sólo. To je naprosto v pořádku. Takže se domnívají, že toto je v žádném případě povinné. V pátek to byl jen já a několik z týmu tady, prázdné divadlo z větší části. Tam byly 3 turistů sedí tam, takže to bylo trochu trapné. O čem jsme mluvili byla databáze a mluvili jsme o PSet 7 trochu. A pokud jste náhodou chytit, že na videu ještě ne, to je v pořádku. Pokusím se definovat všechny pojmy, které bychom jinak považujeme za samozřejmé na základě přednášky páteční. 

Ale dnes se budeme snažit, aby vám do bodu ze dne nejen schopen udělat něco jako PSet 7 ale opravdu pochopit, co se děje na pod pokličku, zejména některé abstrakce, které jsme zavedeny do functions.php souboru aby vaše životy trochu jednodušší, ale tak, že si nakonec porozuměli tak, že když se školení kola sundat za pár týdnů můžete ještě přežít v reálném světě a dělat ty věci bez CS50 rámci pod vámi. Tento $ _SESSION, pro ty z vás, kteří jsou obeznámeni nebo kteří již zachytil na video v pátek, co SESSION, dejte nám to v PHP-založené webové aplikace? To je superglobal variabilní, což znamená, že je to podobné jako v duchu GET a POST a pár dalších, ale to, co je to za věc užitečná pro? 

Co je SESSION používá? Jo. [Student] přihlášení Je nám líto? [Student] přihlášení přihlášení Opravdu. V PSet 7 jsme pomocí tohoto SESSION superglobal usnadnit přihlášení A co je hezké o této superglobal je, že je asociativní pole. Asociativní pole, odvolání, je jen pole, ale jejichž indexů již nemusí být čísla jako 012. Mohou být čísla, nebo mohou být dokonce řetězce. A tak pokud jste se ponořila do PSet 7 ještě, mohou si vzpomenete, že jsme se ukládají klíč nazvaný ID uvnitř tohoto asociativní pole, jehož hodnota je něco jako 123 - bez ohledu na aktuálně přihlášeného ID uživatele je. Motivace je to, že i poté, co uživatel navštívil localhost nebo moje webové stránky obecněji a pak se přihlásíte, i v případě, že nejsou klikněte na odkaz, nebo se vrátit do svého webu po dobu 5 minut nebo dokonce hodinu, nebo dokonce denně, ale opustit svůj okno prohlížeče otevřené, prostřednictvím tohoto superglobal mohu pamatovat, že jsou přihlášeni 

Jinými slovy, mi umožňuje uložit mírně dlouhodobou co chci o uživateli. A můžete si ji opravdu jako ztělesnění nákupním košíku. Místa jako Amazon zřejmě vám dát věci do nákupního košíku, ale HTTP, protokol, který pohání web, je bez státní příslušnosti v tom smyslu, že při návštěvě webové stránky, z větší části nemáte nějakou konstantní připojení k síti mezi prohlížečem a serverem. Jakmile jste si stáhli HTML a obrázky ve formátu JPEG a GIF a všechno, připojení zmizí a vy prostě máte kopii HTML a kdoví co ještě ze serveru. Ale pokud server chce mít na paměti, něco o sobě, zatížení je na serveru skutečně zaznamenat, že informace. A tak jste programátor, kteří mají kontrolu nad serverem může dát nejvíce, co chcete v této superglobal asociativního pole a to tam bude příště uživatel přijde zpět, ať už je to minut nebo dokonce dní později, pokud zavřete své okno prohlížeče, na kterém místě SESSION zmizí. Takže je to pomíjivé skladování, je to non-perzistentní, a to znamenalo jít pryč jakmile uživatel zavře svůj prohlížeč - nejen, že karta, často na celý prohlížeč, čímž účinně přihlášení uživatele ven. Tak, jak je ta věc skutečně realizována? Pojďme se rychle podívat na jednoduchém příkladě jsme se podívali na pátek. Pro ty, kteří neznají, to bylo tak jednoduché, jak to. Toto je webová stránka, jejímž jediným smyslem života je mi kolikrát jsem navštívil tuto stránku. To je poprvé, co tady v pondělí, že jsem ji navštívil, tak to říká 0 krát. 

Ale kdybych začal načtení této stránky říká, že 1 čas, 2, 3, 4, 5, a to bude nakonec jen se udržet na čítání nahoru, nahoru, nahoru, nahoru, nahoru pro každou dobu jsem vlastně klepněte na tlačítko Obnovit na to. Tak, jak je to nefunguje? Nech mě jít dovnitř tohoto souboru s názvem counter.php. Horní část je všechny modré komentáře, ale zajímavá část je tady. Na řádku 13 nazýváme tuto funkci session_start, a to je doslova vše, co musíte udělat, pokud chcete mít přístup k tomu speciální superglobal s názvem $ _SESSION. To je to všechno možné, a uvidíme za chvíli, jak je to vůbec možné. V řádku 16 oznámení, co dělám. Pokud je klíč, tzv. pult - jinými slovy, hodnota indexu - "počítadlo" existuje uvnitř tohoto pole nazývá SESSION, pak to, co dělám s ní v souladu níže? Co je linka 18 dělá? 

[Neslyšitelné Student odpověď] Co je to? [Student] Ukládání hodnoty. Dobré. Je to ukládání hodnotu, která je v SESSION teď v nové místní dočasné proměnné, $ Counter ve všech malými písmeny. Všimněte si, že PHP už byl trochu líný zde. Všimněte si, nemáme žádnou zmínku o int nebo float nebo řetězec nebo něco takového protože PHP je slabě typovaný, kdy nemusíte specifikovat typ proměnné, a v tomto případě tady jsem to dokonce prohlásil to ještě. Jsem prohlásil, že uvnitř těchto složených závorek a na rozdíl od C, je to vlastně v pořádku. Bez ohledu na to, jak hluboce vnořené proměnné prohlášení je v PHP - uvnitř ortézy kudrnaté, uvnitř ortézy vlnité a jako - že bude v tomto okamžiku v době existují pro zbytek programu, k lepšímu nebo k horšímu. Tak to okamžitě stává globální jakmile jej definovat jako tady děláme. 

Jinak, když nemám zjistil, že tam je něco v SESSION superglobal, Jsem zřejmě inicializaci tuto proměnnou čítač na 0, čímž jen za předpokladu, že uživatel nikdy tu nebyla. A pak samozřejmě je zvyšování counter, jak? Já jsem aktualizaci hodnotu, která je uvnitř tohoto asociativního pole nastavením je rovna co čítač je v současné době + 1. Kdybych přejděte sem na HTML stránky, je to vlastně docela jednoduché. Jediné, co mám v těle této stránky je: "Vy jste navštívili tyto stránky tak-a-tak čas." A to je pojem PHP. Pokud tak učiníte <? =, To je ekvivalentní účinně jakou funkci? Je to opravdu odpovídá na něco jako printf, který jsme viděli mnohokrát v C, ačkoliv, jak možná víte již od spec v PSet 7, tisk je také funkce, která vytiskne pouze něco, to dělá ne vlastně používat formátovací kódy, a můžete skutečně říci, echo stejně. Jsou to všechno někdy tak trochu jinak, i když čistý efekt je nakonec stejný. Takže toto použití od rovnítka je jen jakýsi elegantní způsob, jak to udělat stručněji než byste jinak mohli. Takže to je vše, na tomto webu dělá. To vytiskne hodnotu čítače. Jak to všechno vlastně děje? Možná si vzpomínáte, týden nebo tak dávno jsme začali hledat pod pokličku na to, jak webová stránka funguje pomocí tohoto modulu kartu. 

Chrome má tento i ve verzi Mac, verze Windows, a dokonce i verze pro Linux, a Firefox a IE mají podobné mechanismy, jimiž jste tento vestavěný debugger uvnitř prohlížeče. Pojďme se podívat na následující. Máme spoustu karet zde, a připomínají, že jeden je vlevo Elements, a bez ohledu na to, jak godawful HTML a JavaScript je na stránce, Připomínám, že se Elements kartě můžete skutečně procházet HTML hierarchicky a pěkné a úhledně. Takže pokud se snažíte naučit z webové stránky, jako Google nebo Facebook nebo opravdu všechny webové stránky, si uvědomit, že jste pravděpodobně lépe při pohledu na zdrojový kód tímto způsobem, jak protichůdný k prohlížení surového zdroj, který může být zmatek, jak jsme viděli především na stránkách Google. Takže když jsem místo toho klikněte na kartě Síť tady, Podívejme se, co se děje, když jsem navštivte tuto stránku. Nejprve mi dovolte pročistit cache. Chystám se jít do nastavení v Chrome a pak jít do historie a pak Vymazat všechny údaje o prohlížení. Ty by mohly být použity k děláte pro jiné účely, [smích] ale když přijde do rozvojových webové stránky, je to skutečně užitečné - pokud se smějete víš. [Smích] Je to opravdu užitečné při rozvoji webových stránek, protože realita je věci, jako sušenky a podobné věci mezipaměti soubory HTML, cache soubory JavaScriptu může skutečně stát velkým bolesti hlavy, protože pokud z jakéhokoli důvodu prohlížeč rozhodne mezipaměti nějaký soubor, a přesto jste provedli změny tohoto souboru na serveru ale prohlížeč není opravdu uvědomil, že soubor byl změněn a proto není ve skutečnosti znovu stáhnout, i když klepnete na tlačítko Načíst znovu, jeden z nejvíce Surefire způsoby, jak jen se ujistěte, chyba není na vašem kódu, je to s chováním prohlížeče, je jít tady v prohlížeči a jen vymazat celou historii tak, aby tam žádný zmatek. 

A pak, pokud opravdu chcete být paranoidní, ukončete prohlížeč, restartujte jej, a ujistěte se, vše funguje podle očekávání. Takže ve zkratce, po vymazání mezipaměti je dobré, když dělá rozvoj. Takže tady máme na kartu Síť. I předtím navštívil místo 9 krát, ale nechte mě jít napřed nyní a klepněte na tlačítko Obnovit. A já jsem zpátky na 0. Pojďme skutečně vidět, jak je možné, že tento SESSION superglobal je prováděn. Jdu klikněte na 1 HTTP požadavku, který byl vyroben, a to ladění okna mi umožňuje podívat dovnitř toho. Tady vidím jen odpověď ze serveru, který není zajímavé. Viděl jsem to v libovolném počtu cest. Ale to, co je technicky zajímavé jsou záhlaví. Kdybych přejděte sem a zaměřit se na hlavičkách a klepněte na tlačítko Zobrazit zdroj, co budu vidět, je doslova požadavek HTTP že prostě šel z mého prohlížeče na server, GET je správné slovo a pak / counter.php bytí název souboru, HTTP/1.1 být jen verze HTTP že můj prohlížeč používá. Tato linka je zde trochu připomíná z prohlížeče na server, co název serveru je že chce mluvit. A pak zbytek je to někdy zajímavé, ale není relevantní právě teď. 

To je jen trochu zvědavosti. Cryptic ačkoli je tento řetězec je, kdykoli váš prohlížeč navštíví webovou stránku je informování server jaký prohlížeč používáte a jaký operační systém používáte a jakou verzi této smlouvy. Takže pokud jste se někdy nad tím, jak webové stránky, jako CNN a kdoví co ještě vědět, jaké jsou procenta uživatelů Mac na webu, uživatele PC, Uživatelům IE, Chrome uživatelé a podobné, je to proto, že všechny naše prohlížeče říkají každý web tam, co jsme. To nemusí nutně obsahovat osobní identifikační údaje, ale to přece říct, server, jaké jsou vaše IP adresa je a jaký prohlížeč a OS používáte. Tak to je, pokud je tato informace. Ale co je ještě zajímavější teď, když jde o těchto školeních je hlavička odpovědi. Dovolte mi, abych na příkaz Zobrazit zdrojový vedle odpovědi. Co je zajímavé, je zde několik věcí. 1, jsme se vrátili stavový kód 200. Nikdy jsme neviděli tento stavový kód, protože to znamená, že je vše v pořádku. To znamená, doslova v pořádku na rozdíl od něčeho jiného. Co je to číslo někdy vidět, že je to špatné? [Student] 404. 404, soubor nebyl nalezen, může 403 můžete být klopýtnutí na již, které je zakázáno, což znamená, že jste zapomněli na něco chmod, s největší pravděpodobností. A je tu banda dalších. 

Tady dole, to je trochu blázen. Opravdu jsem to napsal tento soubor pár minut před vložením do gedit. Proč tuto stránku vyprší v roce 1981 předtím, než tam opravdu Web? Co se to tam děje? 

[Neslyšitelné Student odezvy] Časové razítko. Ale proč? Je to poněkud svévolné, ale ve skutečnosti je to užitečné. Co to říká na svého prohlížeče je tento soubor PHP, kterou jste právě požádal již vypršela. Ve skutečnosti, to, že skončila před 30 lety. Ale co to vlastně znamená? To jen znamená, že příště uživatel navštíví tuto stránku, ať už překládce nebo zadáním adresy URL v adresním řádku, ujistěte se, že jste jít a přines novou kopii. To je jakýsi příklad mezipaměti mlátit, hloupý slovo, které znamená jen se snaží odradit prohlížeče od skutečně cache HTML je, že byl odeslán ze serveru takže se nebudete zasáhla znovu načíst a pak uvidíte stejnou verzi souboru. Vy vlastně chcete, aby server odeslat novou kopii. Takže skutečnost, že je to 1981 znamená to, že to je to, co je přístroj výběru jako libovolná data v minulosti. Ale skutečný šťavnaté linka je nyní tohle. Ještě předtím, než 50 pravděpodobně jste povědomě s cookies. Jak teď, zejména mezi těmi, méně pohodlné, nebo mezi, co je cookie ve vašem pochopení právě teď i když jsme o tom, aby se vaše chápání více technické? Co je to soubor cookie? Jo. [Student] Informace o uživateli, jako v případě, že jste napsali své uživatelské jméno nebo něco. 

Dobré. Je to informace o uživateli, ať už jste napsali ve svém uživatelské jméno již. Cookies jsou způsob, jak, kdy servery si pamatuji něco o uživateli. A co cookie je opravdu je textový soubor nebo některé posloupnost bajtů , který je zasazen server uvnitř vašeho prohlížeče, a uvnitř tohoto souboru nebo mezi těmito bajtů je nějaký identifikátor. Možná je to doslova vaše uživatelské jméno, ale často je to něco víc mystické vypadající podobné věci tady - bo8dal3ct a tak dále - je to opravdu velký alfanumerický řetězec to je opravdu jen chtěl být jedinečný identifikátor pro vás. Nebo si můžete myslet na to, jako jakýsi virtuální ruky razítko. Pokud půjdete do nějaké klubu, nebo zábavní park, na paměti, že jste skutečně zaplacená a pryč, dali malý červený štítek na ruce nějakého druhu, a že připomíná lidem na přepážce, že jste již zaplacené a můžete přijít a odejít, jak je libo. Cookies jsou trochu podobné v duchu na to. Poprvé jsem navštívil tuto stránku, jak jsem to udělal po odstranění mé cache, webový server, přístroj v tomto případě, dát razítko na ruce jehož jméno je PHPSESSID, session ID, jehož hodnota je to opravdu dlouhý alfanumerický řetězec. 

Takže to je teď trochu nápisem na mé straně, takže příště jsem narazil jiný nebo ručně navštivte tuto adresu URL v prohlížeči, můj prohlížeč z definice HTTP představí ruční razítko znovu a znovu a znovu. Takže i když je server nemusí nutně vědět, kdo jsem, se alespoň vědět, že jsem stejný uživatel nebo alespoň konkrétněji, stejný prohlížeč. A tak to je v konečném důsledku, jak je implementována SESSION superglobal. Server nemá tušení, kdo jste, když jste přehodnotily webové stránky pro druhé nebo třetí čas pokud předložíte tento ruční razítko. A jakmile si představit, že ruční razítko, webový server v podstatě jde do malé databáze vlastní a kontroly, v pořádku, já jsem právě viděl ruční razítko uživatelského bo8dal3ct a tak dále. Podívám se, jaké informace programátor uložena uvnitř superglobal o tomto uživatele, a pak mě ujistit, že tyto údaje jsou opět uvnitř SESSION superglobal tak, že programátor může znovu přístup k datům i když to bylo nastaveno několik minut nebo hodin před. Takže jinými slovy, sušenky, které dostal špatný rap na nějakou dobu z důvodu nejistoty v prohlížečích a je opravdu možné porušovat naše soukromí a to vše, oni vlastně mají skvělý nástroj, protože bez nich byste být neustále přihlášení do každé stránky, kterou navštívíte Facebook nebo každý Gmail e-mail přečíst, pokud prohlížeč nemá nějaký způsob, jak si pamatovat že jste již byl ověřen. 

Takže tímto způsobem se soubory cookie poslán zpět a dále přes drát. Další zvědavost sušenky, zejména zde, je to, že je to zcela v podobě prostého textu. Není šifrování děje vůbec, a opravdu jsem pomocí HTTP v tuto chvíli. Jeden z našich oblíbených momentů ve CS50, který je nyní před 2 lety, byl v době kolem nástroj s názvem Firesheep vyšel. To byl volný kus software, který byl vyroben bezpečnostní výzkumník jako budíček pro komunitu říci, jak otřesně prováděna některé autentizační mechanismy na webu byly. Takže na nějakou dobu, Facebook byl téměř úplně přes HTTP, HTTPS ne. A i když nemáte tušení, jak crypto pracuje, S je zabezpečený tak to znamená, že je alespoň nějaký šifrování zapojeny. Facebook se používá k zašifrování uživatelská jména a hesla, ale jakmile se podíval na své tropí nebo vaše zprávy nebo vaše zprávy krmivo, to vše bylo nešifrované. Tak byl Gmail do doby těsně rok nebo 2 před. Kdykoliv jste přihlášeni, ano, oni používají bezpečné šifrování, ale poté, že ne. A proč by to mohlo být? Proč ne jen používat kryptografii po celou dobu v případech užití, jako je tento? Co je to? Myslím, že jsem něco slyšel. [Student] Speed. Rychlost, ne? Existují způsoby, jak vyřešit tento problém. Ale pokud si to prostě o tom přemýšlet logicky, pokud zašifrovat něco, co musíte udělat, alespoň trochu více práce. V PSet 2, když jste zavedli Caesara nebo Vigenère nebo dokonce Crack, pouze tisk řetězec je poměrně snadné. Šifrování a pak tisk řetězec minimálně vyžaduje trochu více práce. 

 Za super populární webové stránky, jako Google a Facebook, Máte-li udělat více práce pro každého uživatele pro každou jednotlivou webové stránky, které navštívíte, že prostě trvá více procesorového času. A pokud potřebujete více času procesoru, možná budete potřebovat další servery, což znamená, že budete potřebovat více peněz. A tak na mnoho let to prostě opravdu není nejlepší praxe. Lidé by používat šifrování SSL pouze tehdy, když potřeboval. Ale dopadlo to, a jak tento chlapík s Firesheep z super clear, Když se kluci, kteří jsou v současné době na Facebooku teď - Ze zvědavosti, uvidíme, jestli budete Přiznáme se. Pokud jste na Facebooku teď v některých kartě, i když to není na popředí, je vaše URL HTTP nebo HTTPS? [Více] Studenti S. S? [Smích] Dobře. Jakékoliv HTTP? Jen 1? Dobře. Takže každý z nás může zaseknout ten chlap je Facebook účtu právě teď. Z velké části se to stalo ve výchozím nastavení zapnutá, alespoň v některých internetových stránkách. A dlouhý příběh krátký, pokud váš webový provoz není šifrována, Nejen, že HTML jít tam a zpět přes WiFis nešifrované, takže věci jako cookies, jděte tam a zpět po celém vzduchu bez jakékoli formy šifrování. Takže pokud máte jen trochu programování znalostmi nebo udělat něco Googling dovedností najít volné software, který to dělá, vše, co musíte udělat, je sedět v Starbucks nebo sedět na letišti, kde je obecně nešifrované WiFi a jen sledovat klíčová slova, jako Set-Cookie: PHPSESSID nebo protože pokud máte technický důvtipný jen dívat WiFi pro všechny bity, které proudí v celém vzduchu pro tento vzorek, pak můžete říct, že ten chlap je PHPSESSID se stane, že bo8dal a tak dále. A pak znovu, pokud jste dostatečně technicky zdatné, nebo mají ten správný nástroj, pak můžete jen překonfigurovat svůj prohlížeč, kdo prezentaci, aby příruční razítko na Facebook.com, a Facebook je jen tak předpokládat, že jste ten chlap protože všechno, co vím, je, není, kdo jste, ale že máte tento jedinečný identifikátor. Takže pokud budete krást, že jedinečný identifikátor a předložit jej na webový server, jako vaše vlastní, že se právě chystá ukázat vám, že osoby novinek nebo taková osoba tyto zprávy nebo tropí. 

A já bych Google nyní, jak aktivovat HTTPS pro Facebook možná. Ale je to opravdu tak jednoduché. A tak Facebook a Google a podobné dostali opravdu dobrý na to, ale dávat pozor o to více pro všechny webové stránky, které navštívíte, které nepoužívají protokol HTTP a mít nějakou citlivých informací o nich, ať už je to finanční nebo osobní nebo podobně. Pokud se nejste použití tohoto nástroje můžete dost možná cookie líbí to být velmi snadno ukradena a pak se propracovali, a to je přesně to, co Firesheep udělal. Nemusel jsi být programátor. Vše, co musel udělat, bylo se připojení k internetu, stáhnout bezplatný nástroj, a co to udělá, je přihlášení se a pak by to ukážu Facebook názvy ze dne všichni Sanders, v tomto konkrétním demonstrace, kolem vás a vše, co musel udělat, bylo klikněte na jméno a software automatizovaný proces z šňupání, že cookie a předložila ji Facebooku jako své vlastní, a voila, jste přihlášeni Tak tohle je další z těch "nedělej to" oficiálně. Pokud máte vlastní domácí síť a chcete pohrát, všemi prostředky, ale uvědomte si, to dělá přes čáru na univerzitním prostředí. 

Ale cílem je zde opravdu zdůraznit to, jak to udělat ale jak se bránit proti těmto druhům věcí. A triviální řešení zde, i když to samo o sobě je vadný, je opravdu snížit používání jiných stránek, které nejsou pomocí HTTPS neustále. Takže lokalit, jako je Facebook a Google mají stále políčka kde se můžete přihlásit do takovéhle věci, a měly banky let se o to z obdobných důvodů. Takže jen tak trochu strach faktorem, pokud můžeme. Ale to je to v kostce. To je, jak server, pamatuje, kdo jste. A jakmile si vzpomenout, kdo jste, můžete si vzpomenout na něco o vás že programátor má uloženy uvnitř tohoto zvláštního superglobal názvem $ _SESSION. A pro PSet 7 jsme používat triviálně jen pamatovat si int, totiž jedinečné ID uživatele, který se přihlásil, takže víme, že jsem tam byl předtím. Jakékoliv dotazy pak na zasedání nebo sušenky nebo jako? Firesheep nefunguje tak dobře už, a vy budete muset dát počítač do zvláštního promiskuitním režimu takže jste vlastně posloucháte za provoz vedle sebe. Takže pokud jste v současné době stahování Firesheep, uvědomit, že to není zas až tak jednoduché jak to kdysi bylo prokázat. Dobrá. A nedělají to v Sanderse. To udělat doma. Databáze. Jedna z věcí, které jsme udělali v PSet 7 velmi uváženě byla bychom vám ukázkovou databázi tabulku pro uživatele, který má některá uživatelská ID, Některé uživatelská jména, a některé zašifrované hesla v něm. A jak uvidíte, pokud jste tak již neučinili, budete muset změnit v tabulce trochu. Budeš muset přidat nějaké cache každého uživatele v této tabulce, a budete muset přidat další tabulky historie, portfolia stůl, nebo snad říkat něco jiného. Ale pokud jde o přemýšlení o tom, jak to udělat, pojďme otevřít tento nástroj které jsme použili v pátek, ale pokud neznámé, přístroj je dodáván s nástrojem tzv. phpMyAdmin, který je shodou okolností napsaný v PHP, ale jeho účel v životě, co jsem se přihlásit zde jharvard s karmínové, je mi uživatelsky přívětivý způsob prohlížení a změnit svůj databázi. 

Databáze, která Běžím na zařízení se nazývá MySQL. To je velmi populární, a to je svobodný open source databáze, která je nádherně snadné použití, zejména s předním končí takhle. Co tento nástroj umožňuje, abych to udělal, například, je poke kolem stolu. Nech mě jít dál a dělat to. V pátek jsme vytvořili tabulku s názvem Studenti, kteří bylo super jednoduchý. Měl 3 sloupce - id, jméno, e-maily a - a já ručně vložil pár řádků jako David a Mike v tomto konkrétním případě. Pojďme si to trochu dále, a předpokládejme, že chceme pamatovat více než jen jméno a e-mail o uživateli. Dovolte mi, abych klikněte struktura tady nahoře. A opět, Pset vás provede potřebnými kroky zde, takže se nemusíte obávat, pokud něco z toho je trochu rychlé. Pak budu klikněte na zde. Chystám se přidat nějaké počet sloupců po e-mailu protože chci přidat něco jako dům. Zapomněl jsem nahrávat studenta domu. Dovolte mi, abych klepněte na tlačítko Přejít, a nyní máme tento formulář, který bohužel je trochu zeširoka zleva doprava, ale budu volat název tohoto pole domu, a pak typu I nyní vybrat. Takže pojďme se stručně promluvit o různých typech v MySQL protože vzhledem k tomu, PHP je slabě typovaný a tak nějak hraje velmi jednoduché a volné s typy, v databázi, zejména, že je to super důležité, aby skutečně používat psaní ve svůj prospěch protože jedna z věcí, MySQL a další databáze motorů může udělat pro vás je zajistit, aby nechcete dát falešné údaje do databáze. To je jakási volná kontroly chyb k dispozici. 

Pro domu jsme samozřejmě nechceme, aby to bylo int, což je 32-bitová hodnota v MySQL. Udělali jsme krátce pohovořil v pátek o varchar, což je zkratka pro proměnnou délkou char. Co je to? To vám umožní určit, že chcete to být řetězec nějakého druhu. Nemáte opravdu věděli předem, jak dlouho to je, takže budeme libovolně říci, dům Název může mít 255 znaků, ale mohli jste jít s 32, 64 - libovolný počet skutečně. Ale výhodou použití varchar přes pole s názvem char je to, co? Jen intuitivně, když přejděte sem, zjistíte, že je to char a tam je varchar. Varchar je proměnná délka char; char je pevné délky char. Takže pouze na základě této definice, co je výhoda nebo nevýhoda každé z nich? Jinými slovy, kdo se zajímá o rozlišování, nebo proč by vám záleží? 

Jo. [Student] Varchar má větší flexibilitu, ale zabere více paměti. Dobré. Varchar zabírá více - Pojďme se podívat,. Nejsem si jistý, jestli jsem slyšel toto právo. Můžete říct, že ještě jednou? [Student] Řekl jsem varchar má pravděpodobně větší flexibilitu, ale zabere více paměti. Zajímavé. Dobře. Varchar pravděpodobně vám dává větší flexibilitu, ale zabere více paměti. Ten nemusí být nutně pravda. Záleží na kontextu, ale pojďme se vrátit k tomu. 

[Neslyšitelné Student odpověď] Přesně tak. Je to vlastně případ, že char bude obvykle využívají více paměti protože char, stejně jako v C, je jako řetězec, je to pole znaků. Takže pokud řeknete char pole délky 255, Databáze je doslova bude vám 255 znaků. A pokud dům skončí být Mather a 6 znaků celkem, ztrácíte nad 200 znaků. 

Takže varchar efektivně používá pouze tolik znaků, jak je nezbytné až do maximální částky. Ale cena, kterou zaplatíte, je skutečně výkon, potenciálně. Pokud předem víte, že všechny vaše řetězců se bude 8 znaků - Například předpokládejme, že budete potřebovat hesla délky 8 - vzhůru použití char pole na příležitosti, i když ne často, je stanovit pevnou délku něco jako heslo protože nyní databáze může být ještě chytřejší. Pokud se ví, že každý char pole, každý řetězec ve sloupci je stejné délky, dostanete zpět funkci náhodného přístupu. Můžete skákat kolem mezi různými znakovými oblastech v databázové tabulce protože si v databázi jako řádcích a sloupcích. Takže pokud každý z řetězců je stejné délky, víte, že první z nich je na bajtu 0, další je na bajtu 8 a pak 16 a pak 24 a tak dále. Takže pokud jsou všechny řetězce jsou stejné délky, můžete skákat kolem mnohem efektivněji. Tak, že může být výhodou, pokud jde o výkon, ale obvykle nemáte luxus ví předem, takže varchar je způsob, jak jít. Tady je další detail, že i Facebook běžel do nakonec. Ints jsou skvělé, a jsme trochu používat je ve výchozím nastavení kdykoliv chceme číslo, ale je to jen 32 bitů. 

A i když Facebook není úplně mít 4000000000 uživatelů nyní, tam určitě někteří lidé tam venku s více účty nebo účty, které byly otevřeny, a pak zavřela, a tak Facebook sám jsem přesvědčen, že před několika lety musela přechodu z int na, jak je výstižně nazývá, bigint, která je jen 64 bitů místo. Takže i to je konstrukční rozhodnutí. Ty by se úžasně štěstí, když vaše poslední projekt změní startup, má 4 miliardy 1 uživatelé, dávat nebo brát, v takovém případě použití Ints může být poněkud krátkozraké. Ale ve skutečnosti, váš uživatelé tabulka je pravděpodobně v pořádku s ints. Ale na něco takového PSet 7, jako je vaše tabulky historie, můžete mít tisíce, miliony uživatelů, pokud se vyvíjejí do etrade.com. Takže vzhledem k tomu, možná nemáte více než 4 miliardy uživatelů, tito uživatelé máte může mít více než 4 miliard transakcí v průběhu času - nakupuje a prodává, a věci v jejich historii. Takže pokud si předvídat - opět se jedná o správnou problémy mají, pokud máte to mnohem údaje - pokud si předvídat dat přesahující velikost int, jít s něčím, jako je bigint je směr není dost často přijata designérů protože lidé postava, která se nebude problém, ale je to tak snadné vybrat něco větší, než je. Desetinná jsme použili v PSet 7, který stanoví pevnou přesnost takže se můžete vyhnout problémy týkající se plováky a dvoulůžkových a reals a podobně. 

A pak je tu několik dalších oborů zde. Budeme mávat rukama na ně do jisté míry. Ale data, časy mají předepsaný formát v MySQL, a výhodou ukládání dat jako data a ne varchars Znamená to, že databáze je skutečně přeformátovat je do různých formátů, zda je formát USA nebo evropský formát nebo jako - však budete chtít - mnohem efektivněji, než kdyby to byl jen nějaký obecný varchar. A pak je tu nějaký jiný binární, varbinary, kuličky. Jedná se o binární velké objekty, a můžete také uložit binární data stejně jako geometrických dat v databázi. Ale pro nás budeme obvykle záleží ints a varchars a jako. Pojďme dokončit tento příklad s domem. Dům Budu libovolně říci bude 255 znaků. Pak výchozí hodnota, kterou mohl udělat. Mohli bychom ve výchozím nastavení aby všichni v Mather domě, například. To je, jak můžeme určit, že databáze by měly zajistit, že někdo má vždy hodnotu. Ale nechám to být. Ve skutečnosti, pro lidi, kteří žijí mimo kampus, a ne v domě, možná jsem vlastně chcete určit, že výchozí hodnota pro dům je NULL, a pak jsem třeba zaškrtnout a řekněte databáze je to v pořádku, pokud uživatel dům je NULL. 

I v tomto případě je další obranný mechanismus můžete zavést takže ani nemusíte dát ji do svého PHP kódu nutně. Databáze bude zajištěno, že věci jsou, nebo nejsou NULL. A pak konečně, Atributy. Žádný z nich jsou opravdu důležité. Binární, nesignováno - žádná z nich jsou relevantní pro varchar. Index. Ví někdo, nebo si pamatovat, nebo mají hádat o tom, co index něco jako dům? I to je vlastně důležité a poměrně snadno konstrukční rozhodnutí. Pro ty, kteří ještě neviděli, v pátek jsme hovořili krátce o primárních klíčů. V databázové tabulky, primární klíč je pole nebo sloupce , který jednoznačně identifikuje řádků v tabulce. Takže v aktuální tabulce máme ID, máme jména a e-maily. Který z nich je nejlepším kandidátem být primární klíč, jehož úkolem je jednoznačně identifikovat řádky? Pravděpodobně ID. Pravděpodobně bychom mohli také použít to, co když? Možná bys mohl použít e-mail, protože v teorii, že je to jedinečná pokud lidé sdílejí e-mailových účtů. Skutečnost je však taková, že pokud používáte číselné ID, jako 1234, to je jen 32 bitů, zatímco e-mailová adresa může být tento mnoho bytů nebo tento mnoho bytů. Takže pokud jde o účinnost jednoznačných identifikačních kódů, to bývá dobrým zvykem stačí použít int i když máte nějaký řetězec kandidáta, který byste mohli pravděpodobně používat. 

Pro něco jako dům, nemělo by to být primární klíč protože pak pouze 1 osoba mohla žít v Mather a 1 osoba v Currier a podobně. Stejně by to nemělo být jedinečné. Rozdíl mezi primární a unikátní je, že v případě, že si aktuální tabulky ID by být primární, ale e-mail není primární z důvodu jsme právě zmínil - výkon - ale to by mělo být stále jedinečný. Takže můžete stále vynutit jedinečnost, aniž by nárok že je to super důležité primární pole. Ale tohle je docela užitečné: Index. Pokud víte předem za Vaši závěrečného projektu, pro PSet 7, nebo obecně, že toto pole dům se bude něco, co hledat na pozemku pomocí select klíčového slova, nebo něco jiného, pak můžete preventivně říct databáze do práce své kouzlo a ujistěte se, že vytvoří v paměti žádné efektní datové struktury nezbytné urychlení vyhledávání založené na domě. Možná to bude používat hash tabulku, možná to bude používat propojeného seznamu. Ve skutečnosti, to inklinuje používat strom, často struktura se nazývá B-strom - není binární strom, ale B-strom - což je velmi široký strom které jste mohli vidět ve třídě, jako CS124, datové struktury třídy. Ale v krátké, nemusíte se bát, že při použití inteligentní databázového softwaru. Stačí si jen říct to, "Index toto pole, takže můžu vyhledávat na něj efektivněji." 

Necháte-li toto vypnete a pokusíte se hledat pro každého v databázi, která žije v Mather, bude přešla do lineární hledání. A pokud máš 6000 undergrads všechny žijící v nějakém domě, budete prohledávat celou tabulku najít Matherites, vzhledem k tomu, když řeknete Index, doufejme, že to bude něco podobného na logaritmické vyhledávání najít ty druhy studentů. To je jen funkcionalita zdarma zapnout, i když to přijde za cenu nějakého množství prostoru. Konečně, auto-increment, toto pole AI, který jen znamená, že pokud je to int, a nechcete se starat, aby zvýšit sami pokaždé, když je nový uživatel, zkontrolujte, zda, a každý uživatel, který se vkládá automaticky získá nové ID. Pojďme klepněte na tlačítko Uložit, a teď pojďme najít chybu s tímto designem. Pokud bych jít do Procházet, upozornění, že jak Mike a můj dům je NULL. Mohu použít phpMyAdmin editovat ručně. Můžu jít sem a zadejte Mather a stiskněte Enter, a nyní všimnete tabulky se liší. Ale nevšiml jsem mohl dělat něco jiného stejně. Davidova ID je 1, takže phpMyAdmin je opět jen administrativní nástroj; to není něco, co vaši uživatelé vůbec bude vidět. Takže když jsem místo toho klikněte na kartě SQL up horní - a znovu, bude Pset 7 představí vám více z těchto dotazů - Mohu ručně spustit SQL Structured Query Language příkaz UPDATE uživatelé SET dům = 'PfoHo' WHERE id = 1. Tyto SQL dotazy jsou pěkně dost, dost čitelné zleva doprava. Aktualizace tabulky uživatelů, nastavte pole s názvem dům PfoHo kde ID uživatele je 1. Nebo bych mohl udělat i kde email = 'malan@harvard.edu'. Tak dlouho, jak který jednoznačně identifikuje mě, to by mohlo fungovat stejně. Ale ID inklinuje být vyšší výkon, tak se pojďme udělat. Pojďme klepněte na tlačítko Přejít. Dobře, lecture.users neexistuje. Jaký je můj chyba? Co je to vlastně tabulka zde nazývají? Říká se studenti jen proto, že je to to, co jsme udělali tady vlevo nahoře. Říká se tomu studenti, ne uživatelů. Takže klikněte na tlačítko Přejít teď. 1 řádek ovlivněny. Dotaz trvalo 0.01 sekund. Kdybych klepněte na tlačítko Procházet teď, teď Malan žije v PfoHo. Takže to je další chuť SQL, ale Pset vás provede trochu víc. 

Tam je hloupá rozhodnutí, už jsem tady. Řekl bych, že tato databáze design je neefektivní protože čím více lidí, které jsem přidat do tabulky Studenti, více z nás začnu přidávat, více TFS jsem začít přidávat, budeme začít vidět, co propouštění v této tabulce? 

Jo. [Student] Když viděl, že je to u studentů, jsme použili stejný [neslyšitelné] Totéž - Right, přesně. Takže pokud 400 lidí žije v Mather, dávat nebo brát, nakonec tato tabulka bude mít 400 řádky, které říkají, že "Mather," "Mather," "Mather," "Mather," "Mather." Ztrácíme všech těchto bytů, a je tu pár takeaways tam. 1, je tu šílený koutek případ, kdy pokud někdo zaplatí hodně peněz a přejmenovává Mather, nyní musíme změnit celý náš databázové tabulky. To se to nestane často, ačkoli PfoHo bylo jednou nazvané North dům před 15 lety, tak se to stane. Ale to není všechno, že přesvědčivé. Přesvědčivější než rohovou případě, jako je to potřebují aktualizovat data ve velkém pro databázi je důvod, proč jste skladování Mather znovu a znovu a znovu a znovu? To je hodně znaků, 6 znaků. Nemůžeme dělat ještě lépe, než to, že zejména pro Pforzheimer? Jistě můžeme dělat lépe, než že mnoho znaků. Proč ne jen přiřadit jedinečný identifikátor s každým domem a obchod, který pro každého uživatele? Tak pojďme to zkusit. Spíše než jen používat studenti tabulku, nechte mě jít do mé přednášky databázi tady vlevo nahoře. Všimněte si, že říká, že vytvořit tabulku. Dovolte mi, abych vytvořit novou tabulku s názvem domů. Počet sloupců bude 2. Enter. Teď mám 2 pole. Jdu volat toto jméno, a to bude varchar délky 255, 

ale to je docela svévolné. Dovolte mi, abych to tady konvencí. Takže dát ID sem. Dejme každý dům jedinečný identifikátor. Dejme každého domu jméno. Pojďme upřesnit, že identifikátor bude unsigned jen podle konvence používat pouze kladná čísla. Pojďme dál a dát to auto-inkrementace pole pro teď. A my potřebujeme něco jiného? Pojďme dál a klepněte na tlačítko Uložit. Teď mám druhou tabulku. Všimněte si, jak je stranou to je trochu záhadné SQL příkaz že byste museli zadat ručně, pokud nepoužíváte, nástroje pro správu, jako je phpMyAdmin. Takže další důvod, proč je užíváme. Je to nádherně užitečné druh pedagogicky, protože můžete klikněte kolem a zjistit, jak věci fungují, jen o kopírování a vkládání, co phpMyAdmin udělal. Ale tabulka Vytvořit příkaz je to, co se právě vykonán, a tady je můj stůl. Nech mě jít napřed se a využívejte syrové SQL, spíše než zjednodušovat klepnutím na kartu Vložení. Dovolte mi, abych se INSERT INTO domů, a já řeknu jméno domu bude mít hodnotu "Mather". To je všechno. Tato syntaxe je trochu záhadný. To je název pole, které chceme vložit. Jsou to hodnoty, které chcete vložit do těchto polí. Dovolte mi, abych klepněte na tlačítko Přejít. 1 vkládá řádek trvalo 0.02 sekund. Dovolte mi, abych na tlačítko Procházet teď. 

Všimněte si, když jsem klepněte na tlačítko Procházet, tam je Mather, jehož ID je prostřednictvím automatizace číslo 1. Dovolte mi, abych to ještě jednu. Nech mě jít do záložce SQL. INSERT INTO domů. Název domu bude mít hodnotu PfoHo a tak dále. Přejít. A můžu to dělat znovu a znovu a znovu. Nebo pokud jste nudit pomocí phpMyAdmin, stačí použít kartu Vložení a nebudou se muset zadat surového SQL. Stačí si jen bouchnout to rychleji na psacím stroji, například, Currier, Enter, a teď, když jsme klepněte na tlačítko Procházet, tam je Currier s ID 3 let. Tak tohle je to, co máme na mysli auto-přírůstku. Ale teď musíme něco spravit u studentů. V studenti, co by se datový typ domu pole nyní? Mělo by být int, ne? Takže cílem je vytknout, jinak známý jako normalizovat, tabulky takže nemáme ukládat informace redundantně v některém z mých tabulek. A opět, cesta my jsme byli na tu se říct Mather, Mather, Mather, Mather, PfoHo, PfoHo, PfoHo, PfoHo, což je velmi nadbytečná pokud jde o plýtvání z znaků. Tak nech mě jít napřed a změnit tím, že kliknutím struktury, a nech mě jít napřed a zaškrtnout dům pole, klepněte na tlačítko Změnit, a teď budu měnit to být int. 255 již není relevantní. Nech mě jít dál a říct, že je to v pořádku, pokud je to ještě NULL. Uložit. Nyní tabulka studenti byla změněna úspěšně, a všimněte si, opět dům je int. Jak stranou, ignorovat číslo v závorkách, pokud jde o ints. 

To je pro starší důvodů. Zpět v den, kdy jste neměli GUI, můžete místo toho musel příkazového řádku prostředí, na 10 a 11 uvedené kolik znaků jste měl ukázat v terminálovém okně skutečně zobrazit pole. To nemá nic společného s bitovou délkou skutečného pole, takže prostě budeme ignorovat, že pro tuto chvíli. Teď musím jít do této tabulky. A pokud David žije v Mather, by sněmovna neměla být 0, která je výchozí int hodnota nejblíže NULL. Měl by žít v domě 1. Řekněme libovolně říci, že Mike žije v PfoHo, takže dům číslo 2. Teď můj stůl vypadá trochu záhadný. Ale zvážit efektivitu. Já jsem teď s použitím pouze 32 bitů pro identifikaci dům, což znamená, že je pouze 1 kanonické definice mého domu Mather a PfoHo a to v domech tabulce. Takže pokud chci teď vrátit tyto tabulky, myslím, že to tímto způsobem. Tady mám studenti stůl, a na pravé straně je tu tato čísla, 1 a 2. 1 je Mather, 2 je PfoHo. Máme ty stejná čísla v této druhé tabulce, která se nazývá domů, 1 a 2, a 3 pro ty 3 domy. Co teď chceme udělat, je mít možnost v kódu, PHP a SQL, se trochu vrátit tyto tabulky, kde pokud jsou studenti, a to jsou domy, chceme nějak zkombinovat tak, že 1 linie s 1, 2 řádky s 2, a tak, abychom mohli zjistit, kde David a kde Mike a kde všichni ostatní bydlí. Chcete-li to provést, můžeme provést SQL dotaz podobný následujícímu. SELECT * FROM studenti JOIN domy ON - A teď, co pole chceme připojit na? Takže students.house = houses.id. 

Trochu záhadné, ale tato část znamená doslova vytvořit novou dočasnou tabulku to je výsledek spojení studentů a domy. A jak se chcete spojit špičky mých prstů tady? Nastavte studentů dům pole rovnou domů "číslo pole. A když jsem teď klepněte na tlačítko Přejít, vrátím přesně to, co jsem doufal, že se. David je v Mather, Mike je v PfoHo, a vidím také jedinečné identifikátory. Ale jde o to, teď mám kompletní tabulku. A tak takeaway zde pro PSet 7 nebo opravdu pro konečného projektu: Pokud zjistíte, že jste ukládání každý kus informace redundantně, ať už je to dům, možná je to město, stát, a ZIP kde ZIP obvykle, ale ne vždy být použit jako jednoznačný identifikátor, jdou přes cvičení mentálně a pak s něčím, jako je phpMyAdmin factoringu, že společná data, protože zejména jako vaše webové stránky dostane více dobře použít a více populární, je to, jak se ujistit, že je vše v super rychlý, tím, že databáze tolik rad jak na jedinečnost jak je to možné. To bylo hodně. Nějaké otázky? Dobrá. Pojďme se 5-minut přestávku tam a přeskupit. Dobrá. Následující je příkladem toho, že byl použit před několika lety, když jsem se CS161, který je operační systémy třídy na koleji který je známý pro bytí úžasné, ale šílený množství práce, a zaměřuje se opravdu na některé low-level problémy, které vznikají v operačních systémech a také i na světě databází. 

Příběh, který byl řekl můj profesor, Margo Seltzer, že rok byl takto. Předpokládejme, že máte malý kolejní lednička pro vás a vaše spolubydlící a oba vás opravdu rád mléko. Takže jsi přišel domů ze třídy jeden den, váš spolubydlící ještě není tam, otevřete ledničku, a vy si uvědomíte, "Oh sakra, jsme z mléka." Takže zavřete ledničku, jdete přes ulici k CVS a dostat do stále dlouhé fronty na nákup nějaké mléko v CVS. Mezitím, váš spolubydlící přijde domů ze své třídy, přichází do místnosti, otevře lednice opravdu chtějí trochu mléka, otevře ledničku a, "Sakra, bez mléka." Tak on nebo ona se zavře ledničku, vyjde ze dveří, a jde do ABP nebo někde jinde, než CVS, kde si nebudete narazit do sebe jít trochu mléka. Samozřejmě o několik minut později, a to jak z vás dostat zpátky domů a nyní máte dvakrát tolik mléka, jak jste vlastně chtěli. A je mléko, teď to půjde špatně, protože se vám líbí mléko ale nemám rád mléko, takže teď máte příliš mnoho mléka, takže to bude ochlazovat. To je hrozný, hrozný stav. Co by mohlo vyřešit tuto prekérní situaci, pokud jste byli první spolubydlící doma? Ano. [Student] Měl jsi nechal vzkaz. [Smích] Dobré. Měl jsi nechal vzkaz. Měl jste dát Post-it poznámku nebo jako říkat, "Gone mléka," a pak se váš spolubydlící koncepčně by byl uzamčen skutečně dělat to. Nebo můžete jít 1 krok dále. Dalo by se doslova zamknout lednici s nějakým visací zámek, a nyní váš spolubydlící bude doslova pod zámkem z ledničky. Pokud bychom zobecnit zpět do programování, můžete téměř myslet na lednici jako nějakou proměnnou nebo struct, nějaký druh nádoby pro informaci. Problém zásadně zde je, že oba z vás bylo umožněno nahlížet do nebo číst stav tohoto datové struktury, ale považoval to v různých časech, a přesto oba jste se rozhodli v závislosti na stavu světa si ty různé okamžiky v čase. Takže kdybyste zamkli ledničku, by jste alespoň zabránit své spolubydlící od mít been schopni zkontrolovat stav světa, tak on nebo ona nemohla z téhož rozhodnutí. Takže databází, jak se ukázalo, mají tento problém neustále. 

Pojďme se podívat, jestli se nám podaří postavit scénář. Předpokládejme, že jste něco jako špatný člověk, a jdete do Bank of America nebo jeden z dalších míst na náměstí, které mají pár bankomatů bok po boku, a nějak jste přišel na to, jak duplikovat ATM kartu - není všechno tak těžké. Je to jen magnetický proužek. A tak to, co chcete, aby se pokusili udělat, je hrát tuto hru přičemž dáte 1 kartu do 1 stroje, další kartu do jiného zařízení, a vy v podstatě chcete zkusit vybrat peníze najednou, protože si představit, že příběh je takto. Stroj na levé straně má svůj kartu a PIN, a pak řekl: "Dej mi 100 dolarů." ATM je naprogramován tak, aby nejprve udělat select ve své databázi nebo ekvivalent - bez ohledu na databáze je to s použitím - pro zobrazení to mít uživatel alespoň $ 100 v jeho účtu? Pokud ano, pak vyplivněte $ 100 a odečteme 100 dolarů z jejich bilancí. Ale samozřejmě, pokud je více strojů zde nebo více způsoby kontroly stav tohoto světa, bank vault, vidět, kolik peněz máte, Předpokládám, že jen náhodou stroj na levé a pravé jak položit tuto otázku na zhruba stejném okamžiku. 

A to určitě stát. Bankomaty jsou počítače v těchto dnech. Takže pokud stroj na levé straně říká: "Ano, máte alespoň 100 dolarů," Mezitím stroj na pravé straně říká: "Ano, máte alespoň 100 dolarů," pak oba přistoupit k dokončení své programy a vlastně vyplivnout 100 dolarů a říkají, "Dříve jste museli 200 dolarů." "Dovolte mi, abych aktualizovat proměnnou nyní 100 dolarů vlevo na účtu." Ale pokud oba mají kontrolovat zůstatek na účtu a zjistil, že je to 200 dolarů a oba pak si to spočítejte a říct 200-100, stroje mají potenciálně vyplivnout na dvě $ 100 účty v každém stroji, ale už jen aktualizovali částku zůstatek na účtu je 100 dolarů. Jinými slovy, jste vyřazeno $ 200, ale protože kontrolovány na stav světa současně a pak se rozhodli na základě této hodnoty, oni by nemohli dělat matematiku nakonec správně. Takže v bankovním situaci příliš si opravdu chcete mít nějaký blokování tak, že jakmile jste zkontrolovali stav některé proměnné že je opravdu důležité, stejně jako zůstatek účtu, nedovolte, aby někdo jiný rozhodovat se na základě, že až budete hotovi, dělá svou věc, kde v tomto případě jsou ATM na levé straně. Lock všichni ostatní ven. Můžete si skutečně dosáhnout tohoto efektu v několika různými způsoby. 

Nejjednodušší způsob, jak v MySQL je řada SQL, které jsme vám dali v problému nastavené specifikaci, která vypadá přesně takhle. Vložit do tabulky - jak se to jmenuje - id, symbol, a podíl, počet akcií, následující hodnoty, například. Pokud jste nečetli spec ještě, je to příklad na to, jak se vám jít o nákup 10 akcí tohoto Penny doručení prezidenta Skroob, jehož ID uživatele se stane, že číslo 7? To říká, že INSERT INTO tabulka následující id, symbol, a počet akcií 7., "DVN.V", a 10. Ale - ale, ale, ale - druhý řádek je důležitý. ON duplicitní klíč UPDATE akcií = akcie + VALUES (akcie). Takže zcela mystická vypadající na první pohled. Ale fakt, že tento dotaz SQL, i když se zalomí na 2 řádky, je 1 dlouhý dotaz, to znamená, že je atomová v tom smyslu, že tento dotaz bude buď proveden dohromady nebo vůbec ne. A podle definice MySQL, to je, jak se provádí tento dotaz. To je samozřejmě v příručce zaručeně provést všechny najednou, nebo vůbec ne. Motivace pro to je následující. Pokud v tomto případě se snaží koupit 10 akcí na skladě, je to trochu ze stejného příběhu jako mléko, je to docela stejný příběh jako ATM. 

Pokud uděláte chybu, která není pomocí této syntaxe ale výběr z databáze vidět, kolik akcií této penny zásob nemá prezident Skroob mají, a předpokládám, že má 10 akcí, a pak některé zlomek vteřiny později si pak dělat příkazu UPDATE, což je další příkaz v SQL, který říká, že jít dopředu a přidat 10 dalších akcií Do své současné 10 tak, aby v ideálním případě celková je 20, Problém je, že v dnešních databázových systémů a protože v dnešních počítačích máte více procesorů, více jader - Jinými slovy, mohou počítače doslova dělat více věcí najednou - není zaručeno, že váš SELECT a vaše UPDATE v tomto případě Budou se dít zády k sobě. Tak špatný scénář by uděláte SELECT vidět, kolik akcií této populace penny nemá Skroob mají, a pak už jen náhodou se provádí další databázový dotaz - Možná, že její Skroob v jiném okně prohlížeče se snaží koupit 10 akcí v jiném okně úplně, podobně jako ATM - a předpokládám, že další dotaz dostane mezi SELECT a UPDATE. To by mohl být případ, že Skroob nyní ztrácí určitý počet akcií , protože jiný proces zjišťuje stav svého světa, nebo se dostane více akcií, než by měl mít. Nebudeme zacházet do podrobností, co přesně tyto konkrétní dějové linie by být, ale jde o to, pokud máte ke kontrole proměnné hodnoty a pak učinit rozhodnutí, v případě, že je riziko, někdo jiný něco mezi těmito 2 prohlášení, jako je tomu v systémech s více procesory, v vícejádrových systémů, počítače s možností dělat více věcí najednou, může špatné věci se stávají jako bankovní účty byly odepsány nesprávně, nákup dvakrát tolik mléka, nebo v tomto případě nesprávné počet podílů. Ale je tu jednodušší způsob, jak přemýšlet o tom. 

Ukazuje se, že SQL podporuje také, pokud si nastavit tabulku správně, něco jako transakce, které bych si dovolil tvrdit, je vlastně ještě srozumitelnější než to, ale není to 1-liner, takže je to vlastně trochu více zapojit. Tam je doslova prohlášení v SQL názvem START TRANSACTION. Stejně jako tam SELECT, UPDATE, INSERT, DELETE, a JOIN a spoustu dalších, tam jsou klíčová slova jako START TRANSAKCE. A co potom dělat v rámci PSet 7 - nemusíte udělat pro PSet 7, je to výslovně popřel jako není nutné, ale pro konečné projektů to může být užitečné - Pokud zavoláte dotaz na START transakce a pak další dotaz a pak další dotaz a pak další, další a další, tyto dotazy nebude ve skutečnosti být provedena, dokud nezavoláte SQL příkaz COMMIT, na kterém místě, ať už je to 2 prohlášení nebo 20 prohlášení, budou všichni být provedeny najednou, což znamená, že nikdo jiný nemůže náhodně koupit příliš mnoho mléka nebo debetní příliš mnoho peněz nebo koupit příliš mnoho akcií, protože všechny vaše dotazy bude provádět zády k sobě, aby se zády k sobě. A to je super důležité, zvláště když děláte něco takového. Toto je libovolný příklad, který říká, že pojďme aktualizovat bankovní účet nastavením vyvážení rovnající se zůstatku - 1000 dolarů, kde číslo účtu je 2. A pak druhý příkaz je nyní pojďme vklad, že 1000 dolarů do někoho jiného bankovní účet, jehož číslo účtu je 1. 

Jinými slovy, je to dokonalý příklad, kde chcete, aby se ujistil že obě tato prohlášení stane, nebo vůbec ne protože jinak zákazník se chystá přišroubováním a budete mít své peníze a neuloží ji jinde, nebo banka se chystá přišroubovat kam se chystáte uložit peníze ale ve skutečnosti odečteme z účtu uživatele. Takže chcete oba provést společně. Tak vstupuje do světa transakcí. Tak to je něco, co mít na zadní části své mysli, ani ne tak pro účely jen konečný projekt, ale pokud chcete, aby vaše konečné projekt někam, pokud chcete spustit nějakou společnost kolem něj, Chcete-li vyřešit nějakém studentském skupiny problém na akademické půdě a skutečně živé, aktivní webové stránky, jsou druh jemné chyb, které mohou vzniknout pokud nemáte dost promýšlet, co se může stát, pokud 2 lidé se snaží získat přístup k internetové stránky na adrese doslova ve stejném okamžiku v čase, přičemž by jejich dotazy jinak si prolíná. 

Připraveno pro některé JavaScript, ukázku jejich? Tohle je naše poslední jazyk pro semestru. Dobrá. Naštěstí, JavaScript vypadá velmi, velmi, velmi podobný 2 jazyků, C a PHP, jsme udělali tak daleko. Není JavaScript ve PSet 7, ale je to velmi užitečný nástroj pokud jde dělat webové závěrečných prací, nebo opravdu jen webové programování obecně. Tak rychlý přehled něčím, co nazývají DOM. Zde je super jednoduchý webové stránky, která opravdu jen říká ahoj, svět a to jak v názvu, a v těle. Jak odsazení bylo naznačuje nějakou dobu, tam je opravdu hierarchie na webové stránky. Mohl bych nakreslit stejný fragment HTML jako strom, vzpomínal na naše diskuse o datových struktur v C, takto. Mám nějaké speciální kořenový uzel uzel dokumentu, a uvidíme, na analogový tohoto v JavaScriptu za chvíli. První dítě a jediné dítě, které je v tomto případě HTML tag. Tam je žádný přímý mapování DOCTYPE. To je zvláštní věc, a tak jsme měli prostě ignorovat, pokud jde o tuto DOM, Tento Document Object Model stromu. Všimněte si, že tag HTML, které jsem líčil svévolně jako obdélník, má 2 děti: hlava a tělo. 

Ty jsou podobně kreslen jako obdélníky. Je smysluplné obrazově, že hlava je na levé straně těla. Důsledkem je, že hlava je na prvním místě ve stromu. Takže je to vlastně objednání do stromu při kreslení to takhle, i když tvary a kdoví co ještě jsou libovolné. Vedoucí mezitím má jedno dítě s názvem název, a název vlastně má jeho vlastní dítě, které je "hello, world", které jsem záměrně kreslil jako ovál zde, aby to trochu odlišné od obdélníku. Tyto obdélníky jsou prvky, vzhledem k tomu, ahoj, svět je opravdu textový uzel. Takže je to uzel ve stromu, ale je to jiný typ uzlu tak jsem vytáhl ho libovolně jinak. Podobně se tělo mít dítě s názvem hello, world i, tak odlišný uzel, i když jsou shodou okolností stejný text, ale já jsem vypracována to pomocí stejného tvaru. Takže koho to zajímá? No, co je hezké o HTML, je, že nemá tuto hierarchickou povahu. A co je hezké o JavaScriptu a zejména knihoven, které jsou volně k dispozici a populární jako jQuery, můžete procházet stromovou strukturu tak úžasně snadné. Každá z věcí jsme dělali v C s ukazateli a posuvu stromy a recursing na uzlech vlevo dítě pravé dítě, najednou můžeme nějak brát za samozřejmost jako úžasně poučné, ne-li trochu frustrující ale zdaleka ne efektivní způsob, jak jít o programování. A tak s těmito jazycích vyšší úrovně, jako je JavaScript budeme moci přejít tento strom mnohem více intuitivně. 

A skutečně syntaxe bude docela povědomě. Pokud jste nikdy neviděli JavaScript předtím, je to opravdu pěkný odkaz od Mozilly lidí, že lidé, kteří, aby Firefox, takže se klidně procházet, že na vaše pohodlí. Co najdete - a tyto snímky jsou totožné s tím, co jsme druhý den - podobně, je pryč hlavní. Takže když napíšete program v JavaScriptu, není hlavní funkce. Stačí začít psát kód. Ale klíčový rozdíl mezi JavaScript a C a PHP je to, že vzhledem k tomu, C a PHP dosud byly provedeny na straně serveru spotřebičem v tomto případě, nebo obecněji serveru, JavaScript záměrné je obvykle provádí pomocí prohlížeče. Jinými slovy, můžete si napsat kód JavaScriptu, protože se chystáme, na serveru v zařízení, ale jej zahrnout mezi HTML, mezi vaše CSS, mezi svými GIF a PNG vaše a vašich obrázků ve formátu JPEG tak, že když uživatel navštíví webovou stránku, pokud používáte JavaScript, že kód JavaScript pochází ze serveru do prohlížeče, a to je prohlížeč, který skutečně spustí jej. Takže to má důsledky pro smysluplné i duševního vlastnictví. Je to trochu hloupé dokonce přemýšlet o tom, chrání vaše IP, pokud jde o kód JavaScript protože podle povahy jazyka dostane byl proveden obvykle straně prohlížeče. 

Můžete poplést to, což znamená, že může to vypadat blázen a ošklivý bez mezery, hrozné názvy proměnných, aby bylo těžší pro lidi ukrást vaše IP, ale klíč je, že se provádí straně prohlížeče. I když jako stranou JavaScript lze použít straně serveru, nejčastější případ použití právě teď je ještě na prohlížeči. A tady je to, co vypadá. Zde je if-else if-else, stejně jako C, stejně jako PHP. Zde je booleovský výraz, když jste "nebo" 2 věci dohromady. Zde je, když se "a" 2 věci dohromady. Zde je switch, který je podobný PHP v tom, že si můžete přepnout na různé typy hodnot. Smyčky podobně mají pro smyčky, která sem jsou strukturovány stejným způsobem s tím, co jsme viděli předtím. Zatímco smyčky, jsme dostali udělat while. Proměnné, někdy tak trochu jinak. Ty deklarovat proměnné, jako to děláte v PHP a C, ale stejně je JavaScript slabě zadali. Neurčíte int nebo float nebo provázek nebo něco podobného, ​​že obvykle. Můžete zadat var. Nemusíte specifikovat var, ale to má důsledky, pokud nechcete. Obvykle, pokud vynecháte var, omylem vytvořit globální proměnnou místo místních. Takže mi dovolte navrhnout, aby si téměř vždy jen říct, var a pak název proměnné. Není to typ, je to jen var pro proměnnou. To by byl příklad, ať už je to 123 nebo "hello, world". Pole jsou přítomny a syntakticky podobný PHP. Řeknu var čísla a pak jsem použít hranaté závorky znovu deklarovat proměnnou jehož typ je pole, které má tyto konkrétní čísla v něm oddělené čárkami. A pak konečně, to je pouze jeden, že skutečně vypadá jinak. Připomeňme, že v PHP bychom zavedli asociativní pole pro studenta jako Zamyla by mohl vypadat takhle, kde je proměnná nazývá student. Hranaté závorky znamenají, tady je pole. 

Skutečnost, že nejsem pomocí číselných indexů, ale řetězce - id, dům, a jméno - Znamená to, že se jedná o asociativní pole, a tyto šipky s rovnítkem a šikmé konzole Znamená to, že klíč je "id", je hodnota 1; Klíčem k úspěchu je "dům", je hodnota Winthrop House; Klíčem k úspěchu je "název", je hodnota Zamyla Chan. Takže tam je 3 klíče uvnitř tohoto asociativního pole, z nichž každý má svou vlastní hodnotu. Viděli jsme, že v PSet 7, nebo brzy bude, v JavaScriptu stejný nápad, ale bude to vypadat takto. Tak var student - no dolaru a žádná zmínka o typu ještě, ale var - rovná a potom otevřete složené závorky, protože v JavaScriptu, když máte klíč hodnota páry, ve skutečnosti používáte něco jako objekt. A ti z vás, kteří se transportéry nebo jako by připomenout objekty z Java nebo podobné jazyky. JavaScript není Java, především. Jednalo se o úmyslné lety návrhu rozhodnutí před ukrást něco jiného, ​​že byla populární, jeho jméno, i když nemá žádnou zásadní vztah k Java sám. JavaScript má objekty, a vytvořit jim prostřednictvím notace ortézy kudrnaté. Objekty v JavaScriptu jsou do značné míry odpovídá asociativní pole v PHP pokud jde o ukládání dat uvnitř nich. 

Ale ještě silněji v JavaScriptu můžete přiřadit velmi snadno funkce uvnitř objektu, a když si to udělat v jiných jazycích, je to docela běžné paradigma, jak uvidíme. Stručně řečeno, tento objekt reprezentuje studenta, který je zvláště Zamyla, a je to podobné jako koncepčně, jen syntakticky odlišné od tohoto. Pojďme vlastně používat JavaScript v souboru. Ukazuje se, že je to skript tag. Viděli jsme styl značku a my jsme viděli další HTML tagy. Skript tag vlastně bude obsahovat nějaký kód JavaScript. Nech mě jít do zařízení, kde máme nějaký zdrojový kód pre-made. Nemám zanecháno to ještě na webových stránkách, ale budu dělat, že po třídě. Pojďme otevřít tuhle, blink.html. Zpět v roce 1990, tam byl doslova HTML tag nazývá blikají tag, a toto byl jeden z nejvíce nádherně nadměrně značky na internetu kdy byste navštívit nějaký 1990 ve stylu webové stránky a začít vidět textu blikat tě takhle, výsledky markýz tagu, který textu bude takhle. Jeden z mála okamžiků, kdy se svět skutečně dohodnutých na webovém standardu, všichni plošně zabil blikání značku před několika lety. Ale můžeme vzkřísit s JavaScriptem jako demonstraci síly máte když můžete napsat program uvnitř webové stránky. Nejprve se přeskočit nové věci a soustředit se pouze na starý. 

Zde je staré věci v tomto příkladu. Mám tag HTML, hlavu značku, a titul tag. Pak mám tag body zde div, který odvolání je jen obdélníkový rozdělení stránky že jsem dostal jedinečnou ID libovolně z "pozdrav", aby, Jen tak jsem si způsob, jak jednoznačně odkazuje na to, že má některé velmi jednoduchý text: ahoj, svět. Nyní mi dovolte rolovat nahoru na začátek tohoto souboru a zjistit, co je nového. První věc, která je nová až nahoru, je skript tag, a uvnitř oznámení tag script jsem deklaroval funkci. Chcete-li deklarovat funkci v JavaScriptu, dost podobný PHP, budete doslova napsat Funkce potom na název funkce, závorka, a možná některé argumenty, pokud to trvá nějaký. Pak jsem dostal můj složená závorka jako obvykle, a teď máme nějaký mírně nového kódu, ale uvidíme, co to znamená. Tak var div, to prostě znamená, dát mi proměnnou s názvem div. Mohl jsem to nazval foo, ale já jsem chtěl, aby to nazvat div z důvodů, které budou zřejmé v druhé. Pak to dopadá v JavaScriptu - a to je JavaScript kód vložený v mé webové stránky - je zvláštní globální proměnná druhů tzv. dokument. JavaScript je ve skutečnosti objektově orientovaný jazyk. Nebudeme zacházet do detailů v 50, co to znamená, ale teď vím, že objekt je skoro jako struct. Stejně jako jsme viděli při cestě zpět v jednom z prvních problému sety kde jsme dát hodně informací v struct, Podobně je dokumentovat zvláštní struct, který je dodáván s prohlížečem, přichází s libovolnou webovou stránku. Není to něco, co jsem vytvořil. Uvnitř tohoto dokumentu struktury, i když budete mít nejen data ale také mají funkce. 

A kdykoliv budete mít funkci uvnitř struktury, uvnitř objektu, je to tzv. metoda. Ale je to to samé. Metoda je funkce, která jen tak se stane, že je uvnitř něco jiného. Takže to znamená, že tato speciální globální proměnné s názvem dokumentu je funkce nazvaná getElementById, že doslova dělá, že. To se vám element z DOM, Document Object Model strom, jehož ID je v tomto případě pozdrav. Jinými slovy, celou tu dobu jsme strávili na datových strukturách přichází do hry. Tento obraz DOM, který jsme měli před chvílí, i když stránka je trochu jiný, kdybych měl div na tomto obrázku, co document.getElementById by se vrátil ke mně by účinně se ukazatel k obdélníku ve stromu, odkaz na obdélník ve stromu. Takže to, co to znamená ve skutečnosti zavolejte na jedno z těchto funkcí. V tomto případě je to opět div. Není to subjekt nebo titul. Tak se podívejme, co jsem pak dělat s touto div teď, že jsem si to v této proměnné nazvané div. Ukázalo se, že s JavaScriptem máte možnost doladit CSS vaší stránky dynamicky. Až teď, všechny CSS jsme kdy udělali, i když omezený, je ve stylu atributy, nebo kde jinde jsme dát CSS? Tak nějak jsem zkažený, že jeden. Ve stylu značky v horní části souboru. Nebo třetí místo byl v? 

Externí soubor, něco. Css. Takže to jsou ty 3 místa jsme udělali CSS tak daleko, ale úlovek je, že jsme pevně dáno, že všechno. Rozhodli jste se, jak si ponořila do PSet 7, rozhodli jsme se před přednášet to, co naše CSS bude. Ale pokud chcete změnit svůj CSS, můžete skutečně udělat Jakmile budete mít skutečný programovací jazyk. CSS, HTML - není programovací jazyky. JavaScript je. Tak to dopadá, že jakmile máte jeden z těch obdélníků ze stromu volal DOM, to má sám nějaké data v ní. Takže div, že jsem popadl ze stromu má to, co budeme říkat vlastnost uvnitř něj volal styl, a vlastnost stylu má sám vlastnost nazvanou viditelnost. Já bych si toho až při pohledu do uživatelovo CSS příručce. Ukazuje se, že je viditelnost CSS vlastnost, která dělá to, co říká. To je něco viditelné či nikoliv, viditelné nebo ne. A jak to děláte, že je to. Ptám se programově, pokud viditelnost tohoto div se skrývá, co mám změnit to? Viditelné. Jinak, pokud viditelnost této stránce není skrytá, logicky jsem si, aby to skryté. Nemám ponětí, proč je to viditelné a skryté a nejsou viditelné a neviditelné. To byl špatný tvar rozhodnutí na cestě. Ale to jsou opravdu protiklady v CSS: k prohlédnutí a skryté. To vše dělá je, znamená to změnit CSS mého souboru zapnutí a vypnutí, zapnutí a vypnutí pro daný div. Ale znovu, to je funkce nazvaná blikají. Když je blikání funkce se nazývá? Ukazuje se, že je tu ještě zvláštní globální proměnná tzv. okno, svým duchem podobat dokumentu, ale vzhledem k tomu, že dokument odkazuje na své webové stránky, jako strom DOM, HTML jsi poslal ze serveru, Okno se odkazuje na chrom kolem něj, do adresního řádku, v záhlaví, a všechny ty věci kolem své webové stránky. 

A ukázalo se, že objekt window má speciální funkci uvnitř něj volal setInterval že dělá to, co říká. Bude-li nastavit interval - v tomto případě každých 500 milisekund - a hádat, co to bude dělat každých 500 milisekund? Bude to provést tuto funkci blikání. A co to tu pěkné, že jsme mohli udělat to v C, i když jsme nikdy neudělal. C má něco, co nazývá ukazatelů funkcí, kde si můžete projít funkce kolem jako argumenty. Podobně v JavaScriptu můžete předat název funkce do jiné funkce. A upozornění, co dělám. Já to nedělám. Pokud jsem závorky po mrknutí, znamenalo by to volání blikat funkce. Kdybych jejich zrušení, to znamená, že je zde blikání funkce takže setInterval dá říkat každých 500 milisekund. Takže konečný výsledek, otřesné ačkoli to je, je to, že když půjdu do localhost a jít do blink.html, Nyní mám tuto událost znovu a znovu. A když jsem vlastně Zkontrolujte prvek, uvidíme, jestli můžeme vidět. Dovolte mi, abych Zkontrolujte prvek, dovolte mi, abych přejděte dolů jen trochu, dovolte mi, abych si vybrat Elements sem, a všimněte si DOM vnitřek inspektora Chrome. Je to doslova mění tam a zpět každých 500 milisekund. Pokud půjdeme do našeho přítele Nate, pokud jste se někdy nad tím, jak to funguje, podobný nápad s intervalem, ale Nate je vlastně dělat velmi účinné využití barvy v tomto konkrétním případě zde. Takže co víc můžeme vlastně dělat s tím? Pojďme otevřít další příklad a zkusit něco že je programově ještě užitečnější, než dělat věci blikat. Nech mě jít do našeho formuláře adresáře dnes a jít do form0. To bylo nejošklivější možné formulář, který jsem mohl přijít s, a dovolte mi, abych vám ukázat, jak vypadá v prohlížeči. 

Nech mě jít do localhost / formulářů, a to je form0. To je super ošklivé HTML formulář, který má několik polí pro e-mail, na heslo, heslo, a pak se trochu zaškrtávací políčko, aby se dohodly na některých pojmů a podmínek. Háček je, jestli jsem navštívit tento formulář a já nechci, aby vám svou e-mailovou adresu, Nechci, aby se dohodly na podmínkách možná, mohu klepněte na tlačítko Zaregistrovat a to umožňuje mě stejně. To se stává, aby se podrobil stupidní souboru PHP s názvem dump.php. Vše, co to udělá, je vytisknout obsah $ _GET jen pro diagnostické účely. To bylo to, co bylo předloženo uživatelem právě teď. Předpokládejme však, že chceme skutečně ověřit uživatele odeslání formuláře. Nech mě jít do verze 1. To je form1.html. Vypadá to esteticky stejně jako špatné, ale všimněte si, jak je to fantazie. Kdybych na tlačítko Registrovat bez spolupráce, jsem si zařval na. "Musíte zadat vaši e-mailovou adresu." Dobrá. Tak zkusím to. Tak malan@harvard.edu. Nepotřebuji heslo. Registrace. "Musíte zadat heslo." Dobrá. Tak jsem se zadat heslo Crimson. Registrace. "Hesla se neshodují." Musím teď psát crimson zde. Omylem jsem četl, že. Registrace. "Vy musíte souhlasit s podmínkami." Dobrá. Souhlasím tam. Registrace. A teď to ukazuje mi diagnostický výstup támhle. 

Takže to, co se právě stalo? Jsme měli tuto schopnost ověřit odesílání formuláře. Ve skutečnosti, pokud jste ponořit do PSet 7, je tu omluvit funkce že je to docela snadné křičet na uživatele s hlášením na obrazovce. Já používám trochu jiný mechanismus, záznam funkce, která není funkce, která je se usmál na, protože to dělá velmi ošklivé uživatelské zprávy. Ale podívejme se, co tady dělám. To je form1.html, a všimněte si, že mám nějaký docela známý syntaxi: tělo tag, tag formuláře, akce atribut, metoda atribut. Ale nevšiml jsem stejně moje forma jedinečné ID pro pohodlí. Pak jsem dostal e-mail pole, jehož typ je text, pole pro heslo, jehož typ je heslo, potvrzení pole, jehož typ je heslo, a pak checkbox, jehož jméno je smlouva tady, typ checkbox. A pak mám tlačítko Odeslat. Povšimněme si ale na vrcholu, co víc mám. Za prvé, je tu další použití skriptu značky. Pokud máte nějaký kód JavaScriptu v jiném souboru, stejně jako s CSS můžete zahrnout. A vy, že se skript zdroje, a pak zjistíte jsem připojení zřejmě na googleapis.com na velmi dlouhé cestě, ale jehož jméno končí v jquery.min pro minimum. js. jQuery je super populární knihovna pro JavaScript, který prostě dělá JavaScript všechny uživatelsky přívětivější k použití. Je to skutečně stalo de facto standardem. Takže i když to, co jste asi vidět není čistá JavaScript samo o sobě, to je knihovna na vrcholu JavaScriptu podobně jako na CS50 knihovny vrstva na vrcholu low-level kód C, realita je téměř každý na internetu používá. Takže se nejedná o školení kola. To je jen nejlepší praxe v těchto dnech. Nyní všimnete níže, že je můj vlastní scénář tag, a všimněte si, co jsem tady udělal. Ukazuje se, že jQuery dělá něco trochu fantazie. JavaScript má dolary, ale oni jsou bezvýznamní. 

Jsou jako písmeno A nebo B nebo C. jQuery je prostě přijala konvenci nebo druhu položil požadavek na skutečnost, že $ bude jejich speciální symbol. Takže jakmile vložíte tento globální JavaScript soubor tady s skriptu značky, máte přístup k speciálním globální proměnné, která se jmenuje $. Je to více vhodně volal jQuery, ale to nevypadá zdaleka tak sexy jako $. Ale $ nemá žádný zvláštní význam. V PHP to mělo zvláštní význam. Musel jsi mít před proměnné. To je jen sexy věc, kterou přijal. Co se to tady děje? Všimněte si, jsem kolem na jQuery funkce mou globální proměnné dokumentu a pak volám. připraven. Co jQuery podstatě dělá, je, že vám umožní vzít nějaké vanilkové JavaScriptu věci jako objektu dokumentu, objekt window, a pokud si předat ho do jQuery funkce - a znovu, aby bylo jasno, to je funkce nazvaná jQuery - to, co dělá, je, že se vrátí k vám speciální verzi dokumentu , který má více funkcí, s ním spojené. Takže v surovém JavaScript není k dispozici žádný funkce, ale pokud předáte dokument jQuery funkce jako první, se vrátí do Vás speciální verzi objektu dokumentu že má více fantazie funkcí. A to je důvod, proč lidé rádi. Je to prostě dělá věci jednodušší udělat, jak jsme o tom vidět. Takže co tento řádek kódu znamená? Tento řádek kódu zde znamená, že když je dokument připraven - jinými slovy, jakmile prohlížeč přečtení tohoto souboru shora dolů - jděte do toho a spustit následující funkce. Co je opravdu zajímavé v JavaScriptu - a PHP je to stejně - je anonymní funkce. V JavaScriptu můžete deklarovat funkce, které nemají jméno, ale oni přece mají tělo. Všimněte si, co se tu děje. 

To je funkce nazvaná připravený, a znamená to, provést následující kdy se celá webová stránka je připravena, když je to všechno bylo číst v ze serveru. Co chcete udělat? Chci spustit kus kódu. Všimněte si, že nechceme, aby spuštění tohoto kódu hned. Pokud jsem vynechal to, znamenalo by to okamžitě začít provádění těchto řádků kódu. Ale skutečnost, že říkám ne, ne, ne, zabalit to v anonymní funkce, jako je tato prostředky nespustit ji dosud; říkat to nakonec. Viděli jsme to před chvílí v našem předchozím příkladu formuláře. Jakou funkci jsme zavolat nakonec, 500 milisekund později? Blink. Takže stejný nápad. Opět platí, že i když to vypadá trochu divně, vezměte prozatím o víře že prohlásit anonymní funkce, která říká se nakonec, stačí napsat function () { Takže, jaký kód se budeme provádět nakonec? Následující. To také vypadá trochu nový, ale to znamená, tady je jQuery funkce, a to je nyní zkratka. Tento úryvek HTML v dolní části obrazovky, samozřejmě má nějaký strom zastoupení. To není to. Tato stránka je mnohem zajímavější než tento Hello, World například. Ale tam je nějaký strom, který odpovídá tomuto HTML. Bylo by bolest v krku muset realizovat nějaký rekurzivní funkce začít na kořenový uzel a pak najít uzel, jehož ID je registrace. Takže to, co dělá jQuery super snadné pro nás je doslova to. Nestyď se a dostat mě, co div, nebo jakékoli podobě, bez ohledu na HTML element má ID registrace. Toto je ekvivalent k document.getElementById ("registrace"). 

Proč lidé jako jQuery? Vzhledem k tomu, že je to kratší psát. Ale to je vše, co je. Je to stejná myšlenka. Dejte mi tag, jehož ID je registrace. A když se nám, že tag, který se stane být forma,, jděte do toho a spuštění tohoto kódu. Takže pojďme se jeden pohled nyní na to, jak si vedeme formuláře ověření. Syntaxe je sice záhadné na první, ale to, co se děje? Pokud tento řádek kódu je pravda, budu křičet na uživateli, aby jeho nebo její e-mailovou adresu. Takže to, co je tento řádek kódu? $ Znamená jQuery. Teď si toho všimnout. To je něco jako CSS. Pokud jste se ponořila do CSS ještě, budete vědět, že to znamená, že prvek, jehož ID je registrace. Prostor znamená najít dítě nebo potomek registraci, jehož jméno je na vstupu. A pak se ta věc v hranatých závorkách je trochu filtr. A i když to vypadá tajemná, to jen znamená jít do formuláře, jehož ID je registrace, přejít na vnitřní vstupní prvek toho, jehož jméno je e-mail, a pak se jeho hodnotu, bez ohledu na jeho hodnotu se stane, že - asdf jestli je to všechno, co jsem na psacím stroji nebo malan@harvard.edu jestli to, co jsem napsal. Takže, pokud je hodnota formuláře emailovou pole == nic, řvát na uživatele. Nebo jestliže je hodnota v poli hesla == nic, řvát na uživatele. 

Nebo jestliže je hodnota v poli hesla není rovnat hodnotě pole pro potvrzení, který byl jiný prvek formuláře, řvát na uživatele. A pak konečně - a to taky má nějakou novou syntaxi vlastní, ale jakmile jste viděli, že je to alespoň trochu rozumné - else if formulář, jehož ID je registrace má vstupní prvek, jehož jméno je smlouva a je kontrolována, jděte do toho a řvát na uživatele. Tak jsem úplně přiznat, je to naprosto ohromující na první pohled. Je to hodně nové syntaxi. Ale všichni jQuery se řídí těmito druhy vzorů. A upřímně, já ani nevěděl, to existoval ještě před několika minutami. I Googled, "Jak byste zkontrolovat, zda je zaškrtnuto políčko v jQuery?" a to je syntaxe, protože tam je různé způsoby, jak to udělat s aktuálním zdrojovém kódu JavaScript. Tak jako první stránka problému Set 7 zdůrazňuje, Pset 7 je velmi cvičení v bootstrappingu sami kde jsme za předpokladu, doufejme, koncepční rámec, se kterým se vypořádat s PSet. 

Ale jak je tomu často v případě web design, je to na vás opravdu hrabat kolem, začlenil úryvky kódu a příklady z webu tak dlouho, jak budete citovat je Podle podmínek na tomto prvním listu, a uvědomit si, že učení HTML, CSS, JavaScript, a dokonce i SQL je opravdu chtěl být tento at-home cvičení, jak jsme začali brát tyto vzdělávací kola off. A uvědomit si, taky je tu mnohem více věcí, které můžete dělat s prohlížečem. Uvnitř většiny z těchto prvků existují i ​​jiné věci, tzv. obslužné rutiny. A i když jsme se podíval na ty tzv. onsubmit a onready, můžete dělat věci, jako OnKeyDown, OnKeyUp, rád, když se uživatel dotkne klíč, můžete poslouchat, že i klávesu nahoru. Gmail má klávesové zkratky. Jak Google implementovat klávesové zkratky, jako je C pro psaní? Oni naslouchat událostem, jak se jim říká, jako onkeypress nebo OnKeyUp a OnKeyDown. Pokud jste někdy vznášel myši nad nějakým menu a najednou, máte to, objeví nabídka nebo grafiku mění barvu, jak to dělají? Spíše než poslouchat onready nebo OnSubmit, můžete poslouchat onmouseover nebo onmouseout. 

Takže ve zkratce, s těmito velmi jednoduché základy, které jsme začali, abyste nepoškrábali povrch dnes a budeme potápět v návaznosti na středu, budete mít stále více, pravomoc provádět spoustu věcí, které jste již zvyklí. Takže pojďme nekončí, a my budeme pokračovat v tomto středu. 

[CS50.TV]