[Musika sa pag-play] David MALAN: Ito ang CS 50, at ito ay ang simula ng linggo siyam. At kung ano ang naisip namin na gusto naming gawin ngayon ay hindi isara lang ang kabanatang ito sa huling linggo materyal na kung saan namin na nakatutok sa server web programming side na may PHP at SQL, ang ilang mga database ng mga bagay-bagay. Susubukan naming makipag-usap tungkol sa isang kaunting seguridad ngayon at pagkatapos ay paglipat sa isang client side programming wika na kilala bilang ang JavaScript. Ngunit una, ang ilang pagkuha. Maaari mong isipin na sa Miyerkules, ako magse-set out magsulat ng isang website na kinuha sa pag-input ng user sa pamamagitan ng isang HTML na bumubuo na pagkatapos ay naka-imbak na pangalan ng input ng user, telepono numero, at cellphone carrier sa database. At pagkatapos ay nagkaroon ako ng isang maliit na command linya ng script na nakasulat sa PHP na dapat na umulit sa ibabaw ng hilera sa database at nagpapadala ng mga text message. Sa kabila ng ilang, ng ilang mga pagtatangkang, namin Hindi makakuha ng mga na pagtatrabaho sa pagtatapos. Kaya ginugol ko ang buong linggo nagtatrabaho sa na code upang makakuha amin lagpas sa puntong kung saan iniwan namin off, kung saan lahat ng Nakatanggap ako sa pagtatapos ng Miyerkules ay ang text message mula Margo bilang struggled ko, sinundan sa pamamagitan ng isang text message mula sa isa pang kamag-aaral, nakuha mo ang David. Sinusundan ng isang ito, kamangha-mangha nakasisigla. Iningatan dumalo, napaka heartening. Halos nakuha ko ito hanggang then-- at iyon ang tala Natapos namin sa Miyerkules. At pagkatapos ay aktwal na marahil ang aking mga paboritong, ng ilang sandali mamaya, ito ay dumating sa. Mapahamak Live Stream. Kaya ngayon, ayusin namin ito sa isang mabilis tumingin sa kung ano ang iyong ginawa ko dahil. Kaya lahat ng code na ito ay magagamit online mula sa huling linggo, linggo walong, source code. At makikita mo na nagpunta ako sa pamamagitan ng, at talagang ako nalinis up ng mga bagay ng kaunti. Ipinakilala ako ng ilang iba pang mga mga tampok ng isang database SQL. Halimbawa, sa halip na gumawa lamang ng carrier ng var pansamantalang trabaho sa pag-iisip ko ginawa ko sa mabilisang noong nakaraang linggo. Sa halip ko tinukoy ito bilang kung ano ang tinatawag na isang enum. At maaaring nakita ang ilan sa inyo bilang namin nagalugad C. Enum ay talagang isang tampok ng C kung saan maaari kang magbilang ang maramihang mga constants at magtalaga ng mga ito sa awtomatikong mga halaga, tulad ng isa, dalawa, tatlo, apat nang hindi na kinakailangang numero na hard code. Kaya sumusuporta sa SQL ang parehong, kung saan kung mayroon kang isang patlang ng database na lamang nais na kunin sa isa sa may hangganan mga halaga, maaari mong literal na tumukoy ito bilang ko pa tapos doon para sa apat sikat na US cellphone carrier. Kaya ginawa ko na. At ginawa ko ang isang bilang ng mga pagbabago tulad ng na rin, ang pinakamahalaga ay upang makakuha ng pagtatrabaho ng email dahil pagpapabalik, ang programang ito umaasa sa kung aling mga Sa pangkalahatan ay tinatawag na isang email sa SMS gateway, na kung saan ay lamang isang magarbong paraan ng pagsabi na ang Verizon, at AT & T, at iba pang mga tao ay sumusuporta sa server, kung saan kung natatanggap nito e-mail, nag-convert nito ito sa SMS at ipapadala ang isang teksto mensahe sa telepono ng isang tao. Kaya kung ginawa ko ito nang tama, dito ay isang bago at pinahusay na form na pagpunta sa makipag-usap sa bago at pinahusay na code, na Maaari mong i-play sa online. At ito ay inaasahang gumawa ng aking pugak ng telepono sa isang sandali lamang. Kaya unang, pupunta ako mag-type sa aking pangalan. Pangalawa, hindi ako pupunta upang gawin ito ngayon. Pupunta ako sa ko Siyasatin ang Elemento. At ito lamang ang maliit na bagay kaya gagawin ko hindi lumikha ng mga oras ng post na produksyon gumana tulad ng ginawa ko huling beses. Mayroong ngayon ang aking numero ng telepono. Magtatagal ako pumili ng Verizon. At dito, ni i-on ang mikropono ipaalam dito, at naglalayong ito sa aking telepono dito. Pupunta ako sa i-click ang Magrehistro, na dapat sana ay ilagay ito sa database. Ngayon Pupunta ako sa pumunta sa programa command line, na pagpapabalik ay tinawag na tuldok slash teksto, at krus ang mga daliri. Narito pumunta namin. [PHONE DINGS] [Palakpakan] David MALAN: Kaya mas masaya kaysa this-- ito ay masaya, siyempre, kung nakukuha ko ito. Ngunit ito ay mas masaya, naisip ko, kung namin Nilikha ang isa sa mga sandali ng pelikula kung saan tulad ng isang bagay na talagang masama ang nangyari sa mundo, at tulad ng lahat ng mga tao NSA cellphones simulan beeping may mga text message inaalerto mo ang mga ito sa katotohanan. Kaya naisip ko na nais naming subukan upang muling likhain ang parehong dito, kung saan hindi gumagamit ng isang database, Ko sa halip nang maaga nagsulat ng isang program na ganito ang hitsura. Ito ay isang index.php-- at ko bang ilagay ang code na ito sa online bilang well-- na tila lamang-render form.php, gamit ang isang MVC style tularan na namin makipag-usap tungkol sa nang mas detalyado sa hanay ng problema pitong. Form na iyon ay medyo simple. Nangyayari ito na sumailalim sa isang file na tinatawag na here.php sa pamamagitan ng post. At tila ito ng pagpunta sa magtanong para sa isang pangalan, at numero ng telepono, at pagkatapos ay sa pamamagitan ng tinatawag na Piliin ang menu na ito, pagpunta sa magbibigay sa iyo ng hindi bababa sa apat sikat na US cellphone carrier, at pagkatapos ay i-daan sa iyo upang epektibong tumagal ng pagdalo sa pamamagitan ng pag-click dito. At dito, samantala, ay pagpunta sa hiramin ang ilan sa mga code mula sa huling panahon. At kung sagapin mo lamang ito, makikita mo na mayroong ang maramihang mga error checking. Ngunit ang kagandahan sa dulo ay ang hindi kami ay sumusulat sa isang database ngayon. Pinananatili namin ito simple at lamang sa pagpapadala sana ng text message sa pamamagitan ng pagpapaandar na ako nagsulat sa nakalipas na ilang araw tawag Teksto, na kung saan ay sa Paggana sa. php, na kung saan ay muli na magagamit online. Kaya kung nais mong makibahagi sa ito. Hindi namin pagpunta sa ay nag-iimbak ng anumang bagay. Pumunta sa URL na ito dito sa real time. Huwag itong isumite ngayon, ngunit sabihin makita kung maaari kaming magkaroon ng isa sa mga pelikula sandali kung saan cellphone ng lahat Nagsisimula beeping, sana lamang isang beses sa taong ito hindi tulad noong 2011 kung saan ito nagpunta horribly pilipit. At sa sandaling kang pumunta sa address na iyon, dapat mong makita ang isang napaka-simpleng form na kung mayroon kang isang pangalan, isang cell phone numero, at isang cellphone carrier na Tumutugma ang listahan doon, pumunta Magpatuloy at punan ang form. Ngunit huwag pindutin ang isumite pa lamang. Ang form pupuntahan ganito ang hitsura. Sige at i-type sa iyong pangalan, numero ng telepono. Oop, ang isang tao ang nangyayari maaga ang curve. Ito ay ang OK. OK, lahat ng tao ay napuno ang form. Ito ay dapat gumana sa isang telepono, masyadong, kung gusto mo. Ang lahat ng mga karapatan, sa iyong mga marka, makakuha ng set, pumunta. Pindutin ang Narito. Ano? Hindi. Sumusumpa ako sa Diyos, sinubukan kong ito nang maraming beses ngayon. Nakakuha ka ito? [INTERPOSING boses] David MALAN: OK, error ng gumagamit marahil. Iyon ang dalawa. Ito ay nagtrabaho para sa dalawang out sa isang ilang daang, tatlo, apat. OK, na mabuti. Apat na out ng limang para sa kawastuhan kung paano tungkol. Kaya kung ano lamang ang nangyari? Kaya siguro, nang hindi nakikita ang iyong screen, kung ano ang maaaring na-errored? Ito ay marahil na namin lamang sinusubukan mong gumawa ng masyadong maraming mga koneksyon sa server ng mail Harvard ang lahat sa -sabay mula sa parehong IP address. Lang ako sa paghula dahil ako ang hindi may luxury ng pagsubok ang code na ito sa ilang mga 300 mga tao nang maaga ngunit sa ngayon mapagtanto na na hindi bababa sa dapat nakuha ng trabaho tapos oras na ito. Ang lahat ng mga karapatan, kaya kung bakit ay ang lahat ng higit pa dyermeyn sa kung ano ang nangyayari sa? Well una, isang mabilis ilang mga anunsyo. Kaya isa, kung gusto mo bang sumali sa Chang, at Nick, at iba pa sa tanghalian ito Biyernes, gawin RSVP sa karaniwan URL doon. Kung ikaw ay nag-iisip ng pagtuon in o paggawa ng pangalawang sa CS, kung ikaw ay isang sopomor, o presman, o kahit na junior o senior sa puntong ito at maaari pa ring kurutin sa mga kurso, Napag-alaman na ang engineering paaralan ay nag-iipon para sa libreng Ben at Ice cream at payo Jerry ni ito Miyerkules sa ilang sandali pagkatapos ng klase sa 4:00 sa CS gusali sa Maxwell Dworkin. Kung ito ay masyadong mabilis sa screen, pumunta lamang sa cs50.harvard.edu para sa isang link sa kaganapan Facebook kung saan maaari kang makakita ng higit pang mga detalye. Samantala, naisip ko na gusto kong itama isa iba pang mga bagay ko goofed sa Miyerkules. Ino-out ID Markahan na sa Facebook ay hindi tatlo. Ito ay apat. Ino-out siya ay mayroong higit pagsubok mga account sa isipin ko. Ngunit kung ano ang nadama tulad ng pagkakataon gawin ay makuha ang isang URL na katulad nito. Kaya ito ay lumiliko out na mayroong isang Facebook API, application programming interface, kung saan ay isang mekanismo kung saan mo ay maaaring humiling ng data sa programa sa Facebook at makabalik machine nababasa impormasyon, hindi sa mga web page ngunit lamang ang mga raw na teksto, isang bagay na tinatawag na JavaScript Bagay pagtatanda. At sa katunayan, kung bibisitahin ko ito URL, at mag-zoom in, sa pamamagitan ng default, ito ay Mark sa publiko -access ang impormasyon. At ang mga kawili-wiling mga detalye dito lamang na ang kanyang ID ay sa katunayan, bilang apat, na aking natanto sa lalong madaling ginawa ko ito. Magagawa mo ito sa iyong sarili kung alam mo ang iyong username Facebook kung magkaroon ng isa sa iyo. -Type ito lamang up tuktok doon. At wala sa mga ito ay pribado. Ako ginagawa lang ito kahit na sa mode na incognito. Kaya hindi ako kahit nakalog-in. At nakakakita ka na ako sa malas ay gumagamit numero ng 6454 sa Facebook, na hindi Masyadong maganda ang mga araw na ito. Kaya sa papaano mang paraan, makikita mo rin ang karagdagang impormasyon doon. At ang mga kapaki-pakinabang na aspeto ng na na maaaring isulat ang iyong sariling software na kahit papaano Sumasama data tulad nito sa iyong sariling application. Maaari mong bigyang kapangyarihan ang mga gumagamit sa -log in sa iyong website, hindi gamit ang kanilang sariling mga pasadyang username at password ngunit marahil ang kanilang mga pag-login sa Facebook at makakuha ng impormasyon kahit na tungkol sa kanilang mga kaibigan, kung aprubahan nila dito, o pareho. Kaya tandaan na CS50, masyadong, May ilan sa kanyang sariling mga API, isa para sa data kurso catalog, ilang para sa mga hugs sa dining halls, ang lahat ng mga mga gusali at lokasyon sa campus na mayroon kami ng isang API para sa pati na rin na maaari mong i-query ang kaparehong at makakuha ng bumalik tekstuwal data na maaari mong isama sa isang PHP, o JavaScript, o kahit na, kahit na mas karaniwang, isang C batay huling proyekto. Sa katunayan maaga para sa pangwakas na proyekto ang ilang mga milestone. Nakakuha ka ng isang email mula sa amin sa ibang mga araw. Napag-alaman na ang panukala ay dahil ito darating na Lunes. Ito ay hindi kinakailangan na may-bisang, ngunit kailangang matanggap ang iyong Fellows pagtuturo bago sa pag-apruba sa paggawa ng anumang mga pagbabago pagkatapos. At pagkatapos ay magpatuloy ang bilang ng iba pang milestone. Kaya upang mang-ulol sa iyo, masyadong, na may ilang mga posibilidad, mayroon kaming ng grupo ng mga mga kulay na ilaw na mga bombilya. At ang ilan sa iyo guys ay mayroon na ngayong ilang ng mga ito sa iyong dorm room pati na rin. At sila ay masyadong magkaroon ng isang API. Kaya isipin ang mga binary na mga bombilya linggo nakalipas na Dan Bradley at Ansel Puding na nilikha para sa amin. Ginagamit ang mga ito ng isang software interface upang ang liwanag bombilya, na sa sandaling ito naka-plug in sa koryente at pagkatapos ay sa pamamagitan ng wireless na ay konektado sa isang maliit na bagay tinatawag na Bridge down na dito, tulad ng isang maliit na router pagmamay-ari sa partikular na aparato. Ngunit ito ay lumiliko out kung alam ko kung paano magpadala ng mga mensahe HTTP, bilang namin ang lahat ng gawin ngayon, Maaari ba akong magpadala ng isang mensahe tulad nito sa ang ilaw bombilya upang i-on o i-off ito o gawin ang anumang bilang ng mga iba pang mga pagpapaandar dito. Pansinin na hindi ito makuha, hindi ito mag-post. Mayroong isa pa na tinatawag na ilagay. Mayroong talaga ng ilang iba pang mga naturang pandiwa. Ngunit mapansin mayroong isang path doon, iwa API, iwa bagong developer, iwa liwanag, iwa isa, iwa estado. Iyon ay tila lamang ang path na ang kumpanya, Philips, nagpasya na mayroon ka upang pindutin ang sa isang HTTP na kahilingan kung gusto mong baguhin ang estado ng bombilya ng paggamit ng HTTP 1.1. Pagkatapos mapansin ang blangkong linya. At pagkatapos ay sa wakas kung ano ang hitsura tulad ng uri ng isang hanay ng mga uri, ito muli ay pagpunta sa ay tinatawag na JavaScript Bagay pagtatanda, o Jason. At kung ano ang iyong nakikita dito ay ang may tatlong pangunahing mga pares ng halaga. Isa key ay tinatawag na sa. At ang halaga nito sa malas ay magiging totoo. Liwanag ay 128, na ay ilang mga uri ng int. At pagkatapos ng panahon ng paglipat ay zero, na tila kung gaano katagal ito ng pagpunta sa gawin upang i-on bagay na ito. Kaya ngayon ay off ang ilaw bombilya. Ngunit kung gagawin ko eksaktong this-- ipaalam sa akin pumunta sa isang maliit na impostor sheet na-set up Dan sa advance-- at pupuntahan ko upang magpatuloy at kopyahin ang sumusunod na command. Mabaluktot, pati na ang ilan sa iyo maaaring gleaned sa CS50 Talakayin ay isang utility tulad ng Telnet tulad na maaari mong gayahin ang mga kahilingan ng HTTP, partikular na naglalagay. Maaari ba akong magpadala ng data na ito, partikular kung ano ang namin lamang Nakita ng ilang sandali ang nakalipas partikular na sa URL na ito sa paglipas dito. At pagkatapos ay kulutin ay pagpunta upang pangasiwaan ang lahat ng mga kinakailangang mga header at pag-parse ng doon. Kaya lahat Mayroon akong gawin ay kopyahin ito sa pindutin ang isang terminal na window at pagkatapos ay pindutin ang Enter. At ang liwanag bombilya napupunta sa. At ito ay ang lahat ng pagpunta sa pamamagitan ng aking computer wireless kahit papaano pababa sa tulay, na pagkatapos ay pakikipag-usap sa ito ilaw bombilya. Ang maaari kong gawin ibang bagay. Maaari ba akong gumawa ng bagay na ito pumunta pula para sa mga halimbawa. Maaari halimbawa ba akong gumawa bagay na ito pumunta berde. Ang maaari kong gawin itong pumunta asul. At mapapansin sa bawat isa sa mga pagkakataon, ang lahat na ako sa pagbabago ay ang tinatawag na halaga sa kulay talagang bigyan ito ng kulay. Kaya hayaan mo akong ilagay ang isang ito sa pati na rin. Ngayon ay asul. At maaari mong gawin kahit na may interes ng pumunta sa berdeng mga bagay where-- ipaalam. At maaari kong gawin ito ng Siyempre gamit ang aking sariling mga code. Ngunit kahit ang mismong API Sinusuportahan ng funky mga pagpapatakbo tulad nito, na kung saan ay ngayon mag-abala amin para sa susunod na 30 segundo. Kaya na isang lasa ng kung ano ang maaari kang gawin sa isang API, ang isang ito na kinasasangkutan ilaw na mga bombilya. Tandaan na CS50 ay may ilang pares ng Google Glass kung ikaw ay i-pansing isang bagay sa kahabaan mga linya, Arduino Unos, na mga maliliit na maliit na mga computer, mahalagang, sa isang maliit na circuit board na maaari mong kumonekta wire at iba pang mga bagay sa at aktwal na kontrol ang iyong tunay na kapaligiran mundo. At pagkatapos ay may ilang ng bagong mga laruan na mayroon kami. Isa ito literal lamang dumating ang iba pang mga araw sa pamamagitan ng koreo, ang isang Myo gasa. At naisip ko na ito ay isang paraan upang makakuha ka nasasabik tungkol sa mga proyekto na maaari mong gamitin sa ito hardware gagawin maging upang i-play ang maikling clip na ginagamit nila upang mang-ulol mga tao na ngayon kami ay naninirahan sa hinaharap. [Musika sa pag-play] David MALAN: Kaya sa loob lamang ng ilang linggo, mo Masyadong maaaring maging na cool na sa CS50 patas. Ang isa pang device na namin Mayroon ng grupo ng mga na kami ay masaya na pautang out para sa mga proyekto ay tinatawag na isang motion controller. Ito ay isang maliit na USB device kumunekta ka sa isang computer na Binibigyang-daan sa iyo upang makipag-ugnayan sa iyong laptop, Mac o PC, na waring kayo ay nagkaroon tulad ng isang Xbox Kinect at aktwal na gumawa ng pisikal na galaw ng marami tulad ng nakikita natin sa pangitain ng hinaharap. [Musika sa pag-play] David MALAN: Kaya kahit kung mayroon kang kung paano walang ideya ang isang bagay tulad na maaaring posibleng mai-imbento o trabaho sa isang antas ng hardware, hindi mahalaga. Kahit na pagkatapos lamang ng ilang mga buwan ng CS50, at ng pang-unawa ng programming mas pangkalahatang paraan, at web programming higit pa kamakailan lamang, at pagkatapos din API, at HTTP, magkakaroon ka ng access sa pamamagitan ng software na API kung nais na humiram ng isa sa mga mga aparato upang aktwal na makipag-usap sa ito at hindi kailangang mag-alala tungkol sa ang nakapailalim na pagpapatupad mga detalye, na kung saan ay ganap na pare-pareho na may ganitong pagkaunawa ng layering isang abstraction na hindi namin nakita sa buong semestre. Kaya din sa ibabaw ng katapusan ng linggo, Nakita ng ilang mga piraso ng balita. Pumunta sa unang, pumunta sa seminar kung nais na matuto ng isang bagay higit pa sa anumang bilang ng mga paksa. Tingnan ang URL doon. At ang isang ito ay ipinadala sa sa akin sa pamamagitan ng Chang, na alam mo na, kung sino ang pag-print ng aming hukbo ng mga elepante. At ito ay isang headline tulad ng sumusunod. Ako ay terrified ng aking bagong TV. Bakit ako natakot upang i-ito bagay sa iyo at nais masyadong. Kaya kami ngayon sa ituro sa semestre, Masyadong, kung saan kahit na mayroon kang ang slightest ng pag-unawa ng kung paano gumagana ang web, at HTTP, at seguridad, mga bagay na tulad nito dapat na magsimula sa mahuli ang iyong mata. Ngunit din, makikita mo maunawaan kung ang mga bagay ay o hindi aktwal na mga banta. Kaya kinuha ko ng ilang mga sipi mula sa artikulong ito dito. At ang kuwento ay ang mga sumusunod. Ako ngayon ang may-ari ng isang bagong matalinong TV, na pangako upang makapaghatid ng streaming nilalaman multimedia, mga laro, app, social media, at internet -browse, oh at TV masyadong. Ang tanging problema ay na ako ngayon natatakot na gamitin ito, sinasabi ng may-akda. Gusto mo, masyadong, kung basahin mo sa pamamagitan ng ang patakaran sa privacy ng 46 pahina para sa iyong TV. Ang halaga ng data na ito Kinokolekta ng bagay ay pagsuray. -Log nito kung saan, kailan, paano, at para sa kung gaano katagal mong gamitin ang TV. Ito Nagtatakda tracking cookies, bilang na tinalakay namin, at beacon idinisenyo upang matukoy kapag mayroon kang tiningnan partikular na nilalaman o isang partikular na mensaheng e-mail kung nais mong suriin ng email sa iyong TV. Itinatala nito ang app na gamitin, ang mga website na iyong binibisita, at kung paano ka nakikipag-ugnayan sa nilalaman, paggawa ng lahat ng iyon sa pamamagitan ng iyong smart TV. Mayroon din, creepier yet-- na aking addition-- ay isang built in camera may facial recognition. Ang layunin ay upang magbigay galaw control para sa TV at daan sa iyo upang mag-log in sa personalized na account gamit ang iyong mukha. Sa nakabaligtad, mga imahe -save sa TV sa halip na na-upload sa isang corporate server. Sa downside, sa internet koneksyon ay gumagawa ang buong TV mahina laban sa mga hacker na na nagpakita ng kakayahan gumawa ng kumpletong kontrol ng machine. Higit pang mga troubling, na parang na hindi sapat na smart, ay ang mikropono. Ipinagmamalaki ng TV ng boses Ang tampok na pagkilala na nagbibigay-daan sa mga manonood upang makontrol ang screen na may mga utos ng boses. Ngunit ang serbisyo ay may isang halip nagbabala babala. Mangyaring magkaroon ng kamalayan na kung ang ang iyong mga pasalitang salita isama personal o iba pang sensitibong impormasyon, na ang impormasyon Magiging kabilang sa mga data nakunan at ipapadala sa isang ikatlong partido. Nakuha ko na? Huwag sabihin ng personal o sensitibong mga bagay-bagay sa harap ng iyong TV. Kaya ito ay talagang para sa real. At ito ay mahirap hindi upang makita kung pumunta sa Best Buy o ang katulad para sa TV mga araw na ito. Ang mga ito ay na smart lahat sa ilang mga paraan. At sila ay nakakakuha ng mas matalinong at creepier. At sila lang ang naka-pagkolekta ng data sa mga paraan na na-usapan natin ang tungkol at pagkatapos ay pag-upload ito sa pamamagitan ng HTTP o ilang iba pang mga protocol sa ilang mga server. Kaya ito ay ng isang masaya artikulo sa mga online na website dito, na usapan tungkol sa isang partikular na bug o maling code na maaaring aktwal na namin itali sa talakayan huling linggong ito. Kaya ito ang ulo ay bilang susunod, pupunta ang kuwento dito, Magbiro Breckman nagtrabaho para sa isang kumpanya na dumarating sa isang kontrata upang bumuo ng isang pamamahala ng nilalaman system, o CMS habang ang mga ito ay tinatawag na, para sa isang medyo malaking website ng pamahalaan. Karamihan sa mga proyekto kasangkot pagbuo ng sistema ng pamamahala ng nilalaman upang ang mga empleyado ay magiging magagawang upang bumuo at mapanatili ang ang kailanman ang pagbabago nilalaman para sa kanilang mga site. Mga bagay nagpunta mahusay para sa ng ilang araw pagkatapos ng pagpunta live na. Ngunit sa araw na anim, mga bagay nangyaring hindi kaya mahusay. Ang lahat ng mga nilalaman sa website ay ganap vanished. At lahat ng mga pahina na humantong sa default, mangyaring ipasok ang nilalaman ng web page. Oops. Magbiro ay tinawag sa siyasatin at napansin na ang isa partikular na mapanggulo Nagkaroon panlabas na IP address nawala sa at tinanggal ang lahat ng ang nilalaman sa system. Ang IP address ay hindi nabibilang sa ilang ibang bansa hacker nakatungo sa pagsira kapaki-pakinabang impormasyon ng pamahalaan. Malutas ito sa googlebot.com, Sariling web sa pag-crawl ng spider ng Google. Oops. Pagkatapos ng isang bit ng pananaliksik at scrambling sa paligid upang makahanap ng noncorrupt backup, Natagpuan magbiro ang problema. Ay kinopya ng isang user at -paste ang ilang nilalaman mula sa isa pahina papunta sa isa pa, kabilang ang I-edit ang isang Hyperlink i-edit ang nilalaman sa pahina. Karaniwan ito ay hindi magiging isang isyung ito dahil sa isang labas ng user gagawin kailangan magpasok ng isang pangalan at password, ngunit ang CMS pagpapatotoo system, ang sistema ng pag-login, Hindi isinasaalang-alang ng sopistikadong Pag-hack mga diskarte ng Google Spider. Oops. Bilang ito ay lumiliko out, ang Google Spider ay hindi gumagamit ng cookies, na nangangahulugan na maaari itong madaling-bypass ang isang tseke para sa ay naka-log sa hanay ng cookie upang maging totoo. Hindi rin bigyang-pansin JavaScript, na gagawin nang normal -prompt at i-redirect ang mga user na hindi naka-log in. Gayunpaman ito ay sundin ang bawat hyperlink sa bawat pahina nahahanap nito, kabilang ang mga may Tanggalin ang Pahina sa pamagat. Oops. Kaya kung ano ang ibig sabihin nito sa higit pa teknikal ngunit medyo naa-access termino? Ibig sabihin lamang nito na ang sa kanilang website, Nagkaroon sila ng mga URL ay hindi hindi tulad ng isang ito na maaari mong makita sa set problema pitong. Pagpapabalik sa problema magtakda ng pitong o alam sa problema magtakda ng pitong na kayo ay hinamon, bukod sa iba pang mga bagay, magbenta ng mga stock sa ngalan ng user. Ngunit ang pagpapatupad ng tampok na iyon sa pamamagitan ng paraan ng sa pamamagitan ng mga hyperlink sa iyong mga user interface, marahil hindi ang smartest ideya dahil kung ang iyong site ay sa paanuman naa-access alinman sa pamamagitan ng isang tao sino ang nag-click sa paligid o bumili ng bot gaya ng Google o ng Spider habang ang mga ito ay tinatawag na ito lamang pag-crawl sa web sinusubukang i-index web bilang isang search engine, maaari nilang napaka-madali hit sa pamamagitan makakuha ng ganitong uri ng URL. At iyon ang pagtakbo katumbas ng, sa kasong ito, pagbebenta ng lahat ng mga pagbabahagi ng Google. Ngayon lantaran, ito ay ganap na tanga na ang CMS gamit na ang JavaScript at cookies upang ipatupad ang kanyang sistema sa pag-login at hindi mahusay na bahagi ng server, bilang mo guys gawin at ito ay mangyayari sa PSet 7-- mayroong isang login.php file-- palagi, lagi, laging seguridad ay dapat na tapos na sa gilid ng server, hindi sa gilid ng client dahil, bilang na ito Iminumungkahi ng artikulo at maaari mo ang iyong sarili makita sa isang punto, ito ay walang kuwenta para sa isang gumagamit, mabuti o masama, upang i-off lamang ng JavaScript hindi banggitin ang mga cookies. Kaya na ay ang iyong pang-araw araw WTF. May isang nang higit pa, na lamang ang uri ng nakakatakot, kaya makikita ko banggitin ito kung lamang bilang isang aralin buhay. Sa tuwing ginagamit mo ang isang application tinatawag na tulad ng Snapchat o mga katulad na nagsasabing ang mga larawang ito tatagal lamang para sa limang segundo, sampung segundo, o watnat. Ang mga ito ay ephemeral Iyon ay talagang hindi ito ang kaso. Tulad ng walang paraan, digital, upang ipatupad ng ilang mga paraan ng video, o larawan, o tekstuwal pagbabahagi ng naturang na ang isang tatanggap sa kabilang dulo Hindi maaaring kahit papaano i-save ang data. Sa karamihan ng mga musmos na paraan, ang isang tao Maaaring magtagal ang kanilang mga telepono. At ang mga ito ay may 10 segundo window habang tumitingin sa ilang iglap upang kumuha lamang ng ilang mga iba pang mga telepono at larawan nito, nang walang alinlangan. Kaya maaari mong mapanatili ang isang bagay digital na paraan. Ang ilan sa iyo kung paano gumawa ng mga screenshot sa iyong telepono. Sa katunayan, kung hindi mo alam ito, Napag-alaman na hindi bababa sa Snapchat, at sa tingin ko iba pang application mga araw na ito, hindi bababa sa sabihin sa iyo kung ang Ang tatanggap ay talagang kinuha ng isang screenshot ng iyong imahe. Ngunit mas masahol pa, ito ang snappening, bilang isang tao likha ito kamakailan, kung saan ang ilang 100,000 snaps ay inilabas sa kung ano ang tinatawag na isang torrent ng file sa iba't-ibang mga website sa huli. At ang mga nakapaloob ang maramihang ng mga pribadong mensahe at mga post. Ito ay lumiliko ang karamihan sa mga ito kaaya-aya, kaya hindi kung ano ang maaari mong asahan. Ngunit dahil ang mga tao ay nagkaroon ng gumamit ng isang third party website, pag-log in gamit ang kanilang Snapchat username at password at pagkatapos ay nagse-save ang lahat ng kanilang snaps sa mga third party na website. At ito ay ang third party website na-hack, na nangangahulugang lamang isang tao naisip kung paano upang makakuha ng lahat ng mga 100,000 plus ng mga larawan sa kanilang sariling hard drive para sa kasunod na pagbabahagi. Nang tapat, narito Masyadong, ito ay pag-uuri ng tanga na Snapchat ay ipinatupad sa paraan na isang third party na maaaring ayusin ng punto ng pagtawid ang data at na ito ay hindi nakatali sa iyong sariling application na tumatakbo sa telepono. Subalit, dito, Napag-alaman na ang mga mga bagay na hindi dapat mahuli sa iyo sa pamamagitan ng sorpresa, o hindi bababa sa dapat na mayroong maging isang aralin buhay in dito. Kung gusto mo ng teknikal na mga detalye, pumunta sa URL na iyon doon na nasa slide ngayon. Ang lahat ng mga karapatan, anumang mga katanungan sa mga aralin sa buhay ngayon sa CS? I-off na. Anumang bagay sa lahat? Anumang bagay sa lahat? Mayroon akong ng maraming mga tao ng pagsusuri kanilang Snapchat o isang bagay na ngayon. Ang lahat ng mga karapatan, kaya SQL, Naka-istrakturang Wika Query. Ni-wrap ito Hayaan. At din, kahit na lang kami scratching sa ibabaw ng mga ito wika, bibigyan ka namin ng sapat ng wika sa anyo ng mga PSet 7 sa gayon maaari mong matugunan ang ilang mga walang kinikilingan karaniwang mga pag-andar. Ngunit Napagtanto mayroong ilang mga bagay na hindi namin nangangailangan ng sa iyo, ngunit sila ay magiging mahalaga ay panghuling proyekto at tiyak na dumating sa paggawa ng aktwal na mga website na may mga aktwal na user ay desisyon disenyo na ito. Ito ay lumiliko out na sa isang MySQL database, mo Mayroon bunches ng mga pagpipilian tulad ng ang mga uri ng data para sa iyong mga haligi at iba pang mga bagay, ngunit mayroon ka ring ang pagpili ng isang tinatawag na imbakan engine para sa lahat ng iyong data, ang uri ng file system, kung pamilyar ka, para sa lahat ng iyong data. Ano ang format ng huli ay itong naka-imbak sa? At ang pinaka-karaniwang, marahil, ay naging MyiSAM at InnoDB, teknikal na termino na makikita pinapahalagahan namin ang tungkol lamang sa lawak ng isa na may at isa ay walang ang mga sumusunod na tampok na ito. Ipagpalagay na mayroon kang medyo dorm refrigerator. At ipagpalagay mo na at ang iyong kasama sa kuwarto, na ibahagi ang refrigerator, ay talagang hibang na hibang ng sabihin nating gatas. At ito ay, sa katunayan, kung paano ang kuwento ay Sinabi sa akin na paraan pabalik sa araw noong kinuha ko ang isang kurso tinatawag CS 161 Mga Operating System, na katulad explores paksang ito. Kaya mayroon mo ang refrigerator. Naubusan ka na ng gatas. At dumating ka sa bahay, ang iyong mga kasama sa kuwarto ni pa rin sa klase o anumang, at nagpasya kang pupuntahan ko pumunta out at makakuha ng ilang gatas. Kaya isinara mo ang refrigerator, pagkulong ang dorm room, pumunta sa tapat ng kalye sa CVS o kung saan man, at makakuha ng sa linya upang bumili ng ilang gatas. Samantala, ang iyong kasama sa kuwarto ay nakakakuha ng bahay mula sa klase, nakakakuha papunta sa dorm room, nagbukas ang refrigerator, napagtanto rin ooph, hindi namin out sa gatas. Kaya siya isinara ang refrigerator at pagkatapos ay mangyayari upang pumunta sa iba pang CVS, na kung saan ang mangyayari sa maging Isang bloke ang layo mula sa iba pang CVS sa plaza, at nakakakuha sa linya doon upang makakuha ng ilang gatas. Ngayon, siyempre, ang ilang mga minuto sa ibang pagkakataon, pareho kayong makabalik, at ang pinakamasama sa lahat ng mga posibleng kinalabasan ay nangyari. Pareho ka ng gatas. At hindi mo talaga tulad ng gatas na magkano. Kaya isa sa mga ito ay lamang pagpunta sa maasim sa ilang mga punto. Kaya ngayon mayroon kang isang labis na halaga ng gatas sa refrigerator dahil ang lahat bakit? [Hindi marinig] David MALAN: Oo, hindi mo ginawa kahit papaano makipag-ugnayan sa isa't isa na ikaw ay pagkuha ng gatas. Kaya sa pinakasimpleng ng mga paraan sa mundo ng tao, kung paano maaari mong maiwasan ang mga nakakatawa Ang sitwasyong mangyari tulad na nagtatapos up ka lamang sa isa. I-text ang mga ito, oo mabuti. Ngunit paano pa? Post-ito Liss. David MALAN: Isang Post-ito tala. Anumang paraan ng komunikasyon na nagsasabi sa iyong mga kasama sa kuwarto huwag pumunta sa refrigerator para sa gatas. Pupunta ako sa pumunta magtustos na muli sa aking sarili. Kaya kahit papaano ay kailangan mo upang i-lock sa mapagkukunan na ito. Sa gayon ay maaari kaming magsagawa ng this-- aming makakaya uri ng sanhi ng kapahamakan ang kuwento at maging isang CS kuwento kung saan sa tingin ng ito bilang tulad lamang ng variable, na kung saan ay pag-iimbak ng ilang mga halaga. At ngayon, ang halaga ng gatas ay zero, na kung saan hindi mo nais ang iyong kasama sa kuwarto upang siyasatin variable na at pagkatapos ay gumawa ng sa kanya o ang kanyang sarili ng desisyon batay sa katayuan ng variable na kung ikaw ay nasa proseso ng pagbabago ng estado ng variable na iyon. Kaya ang isa sa mga linya ng SQL na namin magbibigay sa iyo sa PSet 7 detalye ay ang isang ito dito. At hindi namin gumastos ng malaking tagal ng oras ng pakikipag-usap tungkol dito. Ngunit ito ay lumiliko out, kung sinusubukan upang bumili ng ilang mga stock sa CS50 pananalapi na mayroon ka ilang pagbabahagi ng, mo Nais na magawang gawin ang isang numero ng mga bagay na agad na magkakasama. Gusto mong magagawang epektibo, sa isang mataas na antas, suriin ang lahat ng karapatan, kung gusto ko upang bumili ng higit pang pagbabahagi ng Libre, ang malaking halaga ng stock namin makipag-usap tungkol sa spec, Gusto kong unang check kung gaano karaming mga pagbabahagi Mayroon akong. At ipagpalagay na ito ay limang. At ipagpalagay na nais kong bumili ng 10 higit pa, ako sa huli Nais na magkaroon ng 15 pagbabahagi ng stock. Kaya ko bang hilingin sa dalawang mga tanong. Ano ang estado ng variable? Ano ang estado ng mga hilera? Gaano karaming mga pagbabahagi kasalukuyan akong magkaroon? Pagkatapos mo nais na magpatuloy at i-update ito. Kaya iyon ang analog sa gatas sa na tingnan ang sunud-sunod, at pagkatapos ay nais mong i-update ito dahil kung gusto mong bumili ng 10 pagbabahagi, hindi mo nais na baguhin ang hilera upang 10, mo nais na baguhin ito sa 5 kasama ang 10 o, siyempre, 15. Ang linya ng code nagsisiguro na ang mga dalawang pangkonseptong ideya mangyari nang sama-sama o hindi sa lahat. Walang sinuman, kabilang ang ilang iba pang mga gumagamit sino ang nag-log in ka sa parehong website, Maaari kahit papaano ay makakagambala ang checking ng row at ang pag-update ng hilera, ang piliin ang at ang update kung habilin sa iyo. At ang syntax ay hindi sobrang halata, ngunit ito isang linya, ang haba ay ito ay, Sinisiguro nito na ang dalawang mga pagpapatakbo ng mga suriin ang variable o tingnan ang hilera at i-update ang hilera mangyari atomically. Oh dito pumunta kami muli. Ang text message sa aking telepono. Kaya ipaalam gumawa ng ito sa isang kaunti pa kongkreto. Ipagpalagay na ikaw ay hindi pagpapatupad ng isang refrigerator, at hindi ka naka-pagpapatupad PSet 7 ngunit isang aktwal na bangko, o isang ATM, ang isang Automated teller Machine, kung saan mo kahit papaano nais na magagawang magbigay ng kapangyarihan mga user upang maglipat ng pera mula sa isang account patungo sa isa pa. OK, mag-hang sa. Pupunta ako upang i-mute ito ngayon, salamat sa iyo. Kaya gusto naming ilipat ang pera mula sa isang numero ng account sa ibang account numero, partikular na $ 100. Kaya ito ay uri ng isang arbitrary Halimbawa, kung saan ka, ang ATM, Maaaring gusto upang magsagawa ng dalawang SQL mga query, ibawas mula sa isang account, at magdagdag sa mga iba pang account. Ngunit nais mong tiyakin na ang mga dalawang linya ng parehong mangyari o hindi sa lahat. Hindi mo gusto ang isang bagay nagsisimula nagambala. Ikaw ay hindi ilang mga smart masamang tao kahit papaano ay nakatayo sa Bank of America na may dalawang mga ATM sa harap sa kanya at kahit papaano uri ng pag-type sa utos sa parehong panahon, sana ay sinusubukan na ibawas $ 200 sa halip ng $ 100 at lamang pagkakaroon ng $ 100 kredito ang. Sa maikli, gusto mo ito sa kumilos nang eksakto tulad ng iyong inaasahan. At ang paraan ng ginagawa mo ito sa SQL database ay balutin mo ito sa kung ano ang na tinatawag na isang transaksyon. Literal sa SQL, maaari mong tawagin CS50 ni query function na may quote magpanipi ng pagsisimula transaksyon. Pagkatapos ay maaari kang magsagawa ng anumang numero ng ng kasunod na mga query SQL, ngunit wala sa kanila ang tumagal Epekto sa mga database hanggang sa tawagan ka query quote magpanipi gumawa, kung muli gamit ang PHP. At sa ganitong paraan, maaari mong matiyak na ang kahit kung mayroon kang 1,000 mga gumagamit sa lahat ng naaabot ang iyong database sa parehong oras, SQL ay nangangako na ang mga dalawang mga query ay magiging ipinatupad sa isang karapatan pagkatapos ng iba pang mga. Kaya hindi ka humantong sa may labis sa gatas o ang maling halaga, sa huli, ng pera. Kaya panatilihin ito sa isip, Hindi kaya magkano para sa PSet 7 ngunit para sa huling proyekto kung ikaw talaga sinusubukan mong maglipat ng data sa paligid sa kabuuan ng talahanayan bilang maaari kang dito. Ngunit marahil kahit na mas simple at mas halata na maunawaan na may isang halimbawa ay ang isang ito dito. At may isang taong nag-email sa amin ang tungkol sa ito lamang ang iba pang mga araw kapag nakita niya isang bagay na katulad sa online. Kaya sa aking kaalaman, ang pin ng system Hindi mahina sa pag-atake na ito. At wala akong mga ideya kung ito ang ginagamit ng kahit na ang database ng SQL sa ilalim ng hood. Ngunit gamitin natin ito para sabihin ang alang-alang ng talakayan. Narito ang screen na Harvard tao ay may posibilidad upang makita kung kailan pag-log in gamit ang kanilang Numero ng Harvard ID at ang kanilang pin. At ipagpalagay na ang pin sistema ay ipinatupad sa PHP at may MySQL database, ang code na ang isang tao Maaaring nakasulat na taon na ang nakaraan ay maaaring magmukhang ito. Una, ipinahahayag ng variable na tinatawag na username. At kumuha lamang na mula sa ang POST superglobal. Pagkatapos ay kumuha ng isa pang variable tinatawag password at gawin ang parehong. At pagkatapos ay isagawa lamang ang haba ng query dito, piliin ang bituin mula sa mga user kung saan username ay katumbas sa takda at password ay katumbas ng tulad at tulad. Pansinin na ang kulot brace ginamit ko na dito ang ibig sabihin lamang sa PHP, pumunta Magpatuloy at kapalit ang halaga ng mga dalawang variable doon. Ang mga ito ay hindi mahigpit na kinakailangan, ngunit sila ay may posibilidad upang maiwasan ang banayad na mga syntax error. Kaya lubos na ito ay mukhang tama sa unang tingin. At ito ay. Maaari mong ipatupad ang mga pin sistema sa ganitong paraan. Ngunit ipagpalagay na ang isang super matalino at mga nakakahamak na mag-aaral -input na ito bilang kanyang pin. Kaya inalis ko na ang mga bullet palatandaan dito sa kunwaring up, at talagang ako nagsiwalat kung ano ang maaaring maging siya type. At ito ay isang maliit na kakaiba. Ngunit kung ano ang jumps out sa iyo sa potensyal na nakakaligalig tungkol sa pag-input ng user, kahit na wala kang mga ideya kung ano ang isang SQL iniksyon-atake ay nangangahulugan. Bakit ang hitsura ng isang maliit na hindi kapani-paniwala? Ano iyon? [Hindi marinig] David MALAN: Ang o ay isang maliit na kahina-hinala. Sa katunayan, iyon ay isang keyword mula sa SQL. Kaya na hindi maghudyat na rin. Ang katotohanan na mayroong lahat ng mga solong panipi there-- sa katunayan, ang isa sa mga pinakamadaling mga paraan upang buksan ang ilang mga database ay sa pamamagitan ng pag-type sa isang pangalan tulad ng O'Reilly na may isang kudlit sa loob nito dahil kung ang tao na nagsulat ang code sa likod ng mga eksena Hindi isinasaalang-alang na mayroong Maaaring maging single quote sa isang user input, at siya ay gumagamit ng solong panipi sa kanilang mga code, Maaari itong mangyari masamang bagay. Sa katunayan, mas malala pa, isaalang-alang na ito. Kung ito ay muli ang code na ang isang tao sa Harvard taon nakalipas na sinulat para sa pin system, mapapansin kung ano ang tungkol upang makakuha ng substituted para sa username at password kung type ng user muli sa skroob bilang kanilang username at pagkatapos ay isa, dalawa, tatlo, apat, limang, quote o quote magpanipi isang equals Ilagay sa mga sipi isa. At mapansin kung ano ang key dito ay ang gumagamit ay hindi Nagsimula ang kanilang password o kanilang pin na may quote. At hindi nila natapos na ito may quote dahil siya ay sa pag-aakala na kung ang programmer ay hindi kaya matalim, ang mga ito ay pagpunta sa may mga solong panipi sa kanilang mga code. Kaya narito ang code. At ang pagpapalit na maaaring mangyari ngayon ay ito. At ko na nakasalungguhit kung ano ang gumagamit ay nai-type sa. Kaya bago, pagkatapos. At mapansin kung ano ang nang mahinahon nakakaligalig ngayon tungkol sa mga karapatan kalahati ng SQL code? Ito ay isang maliit na mas kumplikado, tinatanggap na, kaysa sa query sa nasaksihan namin. Ngunit hindi ito maaari marahil maging isang magandang bagay kung ikaw ay sinasabi piliin ang star, na kung saan ay piliin ang lahat mula sa talahanayan ng gumagamit kung saan username ay katumbas ng skroob at ay katumbas ng password ng isa, dalawa, tatlo, apat, lima o isa ay katumbas ng isa. Ano ang lohikal na implikasyon ng na huling sugnay na siguro? Laging lamang Ito ay totoo. At dahil uri ng namin nahulaan o may korte out sa pamamagitan ng pagsubok at error na ang mga programmer na nagsulat ang code na ito ang hindi asahan ang isang tao ng tao o hindi magandang -type sa solong panipi pati na rin, maaari naming syntactically kumpletuhin ang SQL query na may isang bagay na walang kabuluhan ngunit isang bagay na syntactically hindi tama ay na laging sinusuri sa true. Kaya kung ang code na ito ay ginagamit upang sagutin ang tanong totoo o hindi dapat ang gumagamit na ito ay pinapayagan upang pumasa, ang sagot ay palaging tila pagpunta para maging totoo dahil ito ay palaging pagpunta upang pumili ng isang bagay mula sa database dahil ang isa sa kurso palaging katumbas ng isa. Kaya ano ang solusyon? Well sa PSet 7, kami talaga maiwasan ang lahat ng sama-sama. Bigyan ka namin ng isang function query, at kami Hinihikayat ka upang gamitin ang mga tandang pananong bilang placeholder, katulad sa espiritu sa printf ni% s, ngunit kung ano ang key ng tungkol sa mga tandang pananong dito ay kung aktwal mong basahin ang functions.php, kung saan ang aming function ng query ay ipinatupad, mga tandang pananong ay nakatakas, kung saan ang anumang bagay potensyal na mapanganib tulad ng isang solong panipi naka sa isang nakatakas solong quote. Kaya ito ay kung ano ang talaga nangyayari kung gamitin ang CS50 ng query function na o anumang bilang ng third party libreng library na gawin ang parehong. Hindi ba mahalaga sa kasong ito, sa berde, kung ang gumagamit ay nai-type sa isang solong quote dahil ang query -andar na aming sinulat ni ay pagpunta sa magdagdag ng backslash bago anumang naturang mga mapanganib na quote. Kaya ito ay hindi, sa katunayan, magiging legit. Ito ay tulad ng pag-type sa isang nakatutuwang naghahanap password na, siyempre, hindi pupunta maging skroob ng aktwal na password. Kaya ang takeaway para sa CS50 ay isa, walang pasubali laging gumamit ng isang bagay tulad ng query function na CS50 ni o ang kalakip na library, na kung saan ang mangyayari sa tawagin PDO. Ngunit hindi kailanman, hindi kailanman, Hindi magawa ng code tulad ng ito walang escaping o pagkayod bilang sinasabi nila ang iyong input. At magpo ka sa isang punto marahil matagpuan ang ilang mga website na katulad nito. Sa katunayan, parang ito upang maging ang kaso tulad ng sa airport at hotel sa lugar kung saan mayroon silang libreng Wi-Fi access na mayroon kang mag-login upang, mga website na ito ay palaging horribly ipinatupad. At kaya isang uri ng kasiyahan sa bahay ehersisyo, Hindi para sa nakakahamak na mga layunin o higit pa ng isang masaya sa kalsada mag-ehersisyo, ay i-type lamang isang kudlit, ang isang solong quote, sa isang form sa ilang mga website at tingnan kung ano ang mangyayari. At kung ang server nag-crash o nagbibigay sa ka ng ilang mga uri ng error na mensahe, maaaring napaka rin itong maging na may isang taong hindi inaasahang ito. At pagkatapos ay dapat mong alertuhin ang tamang awtoridad at magpatuloy walang karagdagang. Kaya ngayon mo guys dapat sana ay Nauunawaan ng kaunti pang Geek katatawanan dito. [Tawa] David MALAN: Alam mo ikaw ay isang Geek. Para sa susunod na ilang taon, ikaw ay matandaan na kaunti Bobby Tables ay dahil sa cartoon dito. Kaya panatilihin na sa isip bilang namin paglipat ng konteksto ng isang huling pagkakataon ngayon sa JavaScript. Na ginugol namin medyo maliit oras sa syntax ng PHP dahil ito ay talagang sobrang pareho sa C. At mabuti sapat, JavaScript masyadong ay sobrang pareho sa syntax ng C pati na rin namin makita sa lamang ng ilang sandali at bilang kami ay tingnan sa ibang pagkakataon sa linggong ito sa partikular na. Ano ang maaari mong gawin sa mga wikang ito, bagaman, ay ang lahat ng mga mas malakas na, lalo na sa mga API. Ngunit una ng mabilis na paglilibot. Kaya isa, sa JavaScript, mayroong walang pangunahing pag-andar, kung saan ay mabait. Tulad ng sa PHP, maaari mong isulat lang code. Inaasahan Kundisyon na katulad nito. At Boolean expression maaari ganito ang hitsura o katulad nito. Lilipat umiiral, at sila ay ay maaaring magmukhang ito. Inaasahan apat na mga loop na katulad nito. Habang loop ganito ang hitsura. Gawin panahon hitsura ito. At pagkatapos ay array hitsura ito, na halos kapareho sa PHP. Ngunit mapansin, na sa JavaScript ka Ipinahahayag ng variable na hindi sa isang dolyar -sign, hindi sa isang uri ng data ngunit literal sa pamamagitan ng pagsasabi var para sa variable na bago ito. Ito ay masyadong maluwag na-type sa na ito ay may mga uri, ngunit hindi mo tahasang ipinapahayag sa kanila. At pagkatapos ay isang string, para sa Halimbawa, maaaring tumingin tulad nito, na string na tinatawag na mga sa kasong ito. At pagkatapos ay isang bagay. At makikita ang mga namin makita ang higit pang bago ang haba. At ang isang bagay ay marahil ang isa sa mga pinakakaraniwang nakikita kaayusan data sa isang JavaScript na batay sa programa dahil pinapayagan nito mong iugnay arbitrary key pares ng halaga lamang tulad ng nag-uugnay array PHP ni at tulad lamang ng iyong sariling hash talahanayan o subukan ang bilang namin ipinatupad ilang linggo likod. Kaya sabihin aktwal na makita kung ano ang maaari naming gawin sa JavaScript. At sa partikular, ito ay laundry listahan ng mga tampok na mga browser mayroon na -daan sa amin upang Hook ng JavaScript sa isang website sa mga sumusunod na paraan. JavaScript ay madalas na ginagamit bilang isang client side scripting wika. Hindi ito pinagsama-sama. Ito masyadong ay binigyang-kahulugan. Ngunit hindi tulad ng PHP, na kung saan ay tumatakbo sa server, sa web server, o malalim sa loob ng kliyente, JavaScript ay naiiba sa na ito karaniwang tumatakbo sa browser. Kaya ang anumang code ng JavaScript na simulan mo ang pagsulat para sa PSet 8, o ang iyong huling proyekto, o sa tunay na mundo ay karaniwang nangyayari i-save sa server, walang pasubali sa isang tuldok HTML o tuldok JS para sa JavaScript na file. Ngunit ang browser ay pagpunta upang i-download na JavaScript code sa iyong sariling halimbawa ng Chrome, o IE, o Firefox, o anumang. At ang code ay talagang pagpunta upang makakuha ng isagawa sa loob ng iyong sariling mga browser. Lamang upang gawin ang higit pang real, tingnan natin ito sa kongkreto form. Wala kaming ideya kung ano ang ginagawa ang code na ito walang tunay na pagbabasa sa pamamagitan nito. Ngunit hayaan mo akong pumunta sa Facebook.com nang hindi nagla-log in. Hayaan akong pumunta sa Siyasatin ang Elemento at pumunta sa, sabihin nating, Network at I-reload ang pahina. At kami see-- ipaalam sa akin ilipat I-reload ang Page upang makakuha ng lahat ng mga kahilingan sa bagong. At ang pinakaunang file nakikita ko ang CSS, CSS. Narito ang unang JavaScript na file, at mayroon akong walang ideya kung ano ang gumagana, ngunit dito ay ilan sa mga code ng JavaScript na humihimok sa Facebook. Ito ay hindi kahit na talagang na inilalantad upang mag-zoom in. Ito ay pa rin tulad ng walang saysay. Ngunit makikita mo ang kahit pababa sa ibaba, mayroong kahit na higit pa sa mga file na ito ang JavaScript. Oops. Yan ang ping. Sabihin bumaba ng kaunti higit, higit, higit pa. Mayroong isa. Mayroong isa. Mayroong isa. Kaya kahit Facebook, sa likod ng eksena, ay nakasulat sa bahagi sa PHP at sariling bersyon noon Facebook ni, mayroong isang malaking halaga ng JavaScript. Sa katunayan, alinman sa mga -chat mo sa Facebook, alinman sa mga update sa mismong linya timeline na nangyari sa real time, sa lahat ng na ay hinimok sa pamamagitan ng JavaScript. Oo? Madla: Hindi ako sigurado kung ito ang Facebook, ngunit naisip ko na binuo Facebook kanilang sariling mga in-house na wika code? David MALAN: ginawa nila. Kaya na ang dahilan kung bakit sinasabi ko ang isang pag-iiba ng Na tinatawag na PHP Hip Hop na sila talaga Idinagdag tampok sa naturang na kapag Markahan unang ipinatupad Facebook, ito ay nakasulat sa PHP. At na uri ng nanatili ang uri ng front end ng wika na ginagamit nila para sa mas ng kanilang mga coding, ngunit ito Hindi pa ng isang wika na mga antas ay partikular na mahusay sa bilyon-bilyong ng mga tao. At kaya naidagdag na nila ang kanilang mga sarili pagpapabuti sa likod ng mga eksena. At ginagamit nila ang anumang bilang ng iba pang mga wika para sa iba't ibang piraso ng ang kanilang imprastraktura. Kaya oo, ito ay isang pag-iiba ng kung ano ang namin sa ngayon ng PHP. Kaya ipaalam sa tumagal ng isang hitsura sa isang pares ng mga halimbawa ng kung paano namin maaaring gamitin ang JavaScript dito. Sa source code ngayon, mayroon kaming isang bungkos ng mga file,, ang unang na kung saan hayaan na tinatawag na DOM zero. Kaya DOM zero ang hitsura tulad ng sumusunod. Hayaan akong pumunta sa direktoryong ito at buksan up domzero.html, sa itaas ng na may isang uri ng doc pagpapahayag, na sinasabi dito ay ang HTML 5. At ngayon narito ang isang HTML na tag. Narito ang head tag. At narito ang kung ano ang bago ngayon. Ngayon Mayroon kaming isang script tag sa loob ng ulo ng pahina. At ito tila gumagana napakaliit, ngunit abiso na tinukoy mo akong script, isang JavaScript. At bilang isang bukod, dahil ito ay isang karaniwang maling kuru-kuro, JavaScript ay ganap na walang ang gagawin sa Java, ang wika na ang ilan sa iyo maaari na natutunan sa APCS. Ito ay higit pa sa isang marketing bagay sa anumang bagay, riding ang coattails ng Java taon na ang nakakaraan. Ngunit ang JavaScript, walang kinalaman sa Java, katulad lamang, at annoyingly, confusingly na may pangalang. Kaya dito ay kung paano mo ipinapahayag ng isang function sa JavaScript, literal nating pag-andar, pagkatapos ay ang pangalan ng function, pagkatapos ay anumang argumento maaaring tumagal, gusto lang sa PHP. Ino-out sa JavaScript, isa sa mga pinaka nakakainis na mga pag-andar na umiiral ang Alert. Ito ay isang maliit na window magpa-pop up at alertuhan ka sa ilang piraso ng impormasyon. Sa pangkalahatan ito ay frowned sa. Ngunit gagamitin namin ito bilang aming unang exercise dito. Pansinin ang ilang mga tampok ng JavaScript. Single quote at double quote hindi tunay na mahalaga ngayon. Single quotes at double quote maaaring interchanged, samantalang sa C, mayroon kang gamitin ang double quote para sa mga string, at mayroon kang dalawang single quote para sa karakter. Sa JavaScript mundo, maraming tao, karamihan ng mga tao gamitin ang solong panipi sa paligid ng mga string dahil lang sa ito ay isang pangkakanyahan bagay. Ngunit ano ang plus operator dito, na hindi pa namin nakikita dati? Madla: pagdudugtong. David MALAN: pagdudugtong. Kaya C ay hindi kahit na mayroon ito. May tuldok operator PHP, na ginagawa ito. May plus operator JavaScript, na confusingly ay tulad ng Java. Ngayon kung ano ang nangyayari sa dito? Kaya narito ang kung saan ang pangunahing -unawa ng na larawan threw up kami ng ilang mga araw na nakalipas ay sa pag-play. Tandaan kapag nagkaroon kami ng simple bersyon ng isang HTML page-- Sinabi lang ito, kumusta mundo. At pagkatapos ay iginuhit namin ng isang puno sa kanan, na ay nagkaroon ng isang bungkos ng mga parihaba at mga linya pagkonekta ng mga ito tulad ng isang pamilya tree. Kaya iyon ang tinatawag na DOM o Dokumento Bagay Modelo. At ito ay lumiliko out na maaari mong ma-access ang parihaba para sa na puno na may syntax tulad ng mga sumusunod. Literal mong sabihin dokumento, na isang espesyal na global variable sa isang JavaScript programa na may isang function na nauugnay dito na maaari mong ma-access ang katulad ng isang struct, ngunit mo lamang sabihin na tuldok at pagkatapos ay ang pangalan ng function na ay, makakuha ng mga elemento sa pamamagitan ng ID. Ang elemento Gusto kong makakuha ay sa malas quote magpanipi pangalan. At pagkatapos Gusto kong makakuha ng halaga nito. Ngayon kami ay nakakakuha ng mas maaga sa ating mga sarili. Hindi ako kahit sigurado kung ano ang lahat ng ito ay tungkol sa. Sabihin mabilis inaabangan ang panahon na ang HTML sa ng pahina, na kung saan ay napaka-simple. Abiso na iyong tinukoy ko isang bumubuo pababa dito. Abisuhan ang ibinigay ko na ito sa isang natatanging ID, kahit na hindi na namin gagamitin katangiang ito bago. Ngunit ito ay umiiral sa HTML. Maaari mong matukoy nang natatangi ang ilang tipak ng HTML na may identifier na katulad nito. Abiso sa ngayon this-- lumabas HTML Sinusuportahan, sa bawat na laundry listahan ilang sandali ang nakalipas, isang buo bungkos ng handler ng kaganapan. At handler ng kaganapan na ito sinasabi sa isumite. Sa pagsusumite ng user ng ito form na ito, tawagan ang sumusunod na code. At ang code na nangyayari na tinatawag o ipinatupad ay eksaktong ito, ang mga Griyego function na sinusundan ng return false. Lahat ng iba pa ay dapat na maging medyo pamilyar. Narito ang isang input ng uri ng teksto, na ang ID, sa kasong ito, ay magiging pangalan. Hindi namin magkaroon ng aktwal na katangian pangalan ito time-- at isang pindutan ng isumite. Kaya mukhang ganito ang nagresultang pahina. At ang nagreresultang pag-uugali, makikita mo, ganito ang itsura. Ang pahinang ito lokal na host nagsasabing, kumusta David, marahil ay hindi isang aesthetically kasiya-siya paraan upang salubungin ang isang gumagamit. Ngunit kung ano ang talagang nangyari? Well, isaalang-alang kung ano ito ay. Ito ay isang patlang ng teksto. At ayon sa HTML dito, ibinigay ko ito isang natatanging tagatukoy tinatawag na quote magpanipi pangalan. Samantala, ang sinabi ko kapag isinusumite ang form na ito user sa pamamagitan ng pagpindot ang Enter o i-click ang Isumite pindutan, tawagan ang function na tinatawag na bumati at pagkatapos ay bumalik Mali. Isaalang-alang natin sa mga nasa reverse Hayaan. Pansinin kapag click ako sa Isumite, ang URL ng pahina na ito ay hindi nagbabago. Icon ng browser Hindi nagsimula umiikot. Hindi ko pumunta sa kahit saan, at iyon ang Literal dahil sinabi ko bumalik Mali. Bumalik Mali maikling circuits o hinto ang default na pag-uugali ng isang form. Kaya na pagkatapos ay nag-iwan sa amin ng ang isang huling tanong. Ano ang bumati gawin? Well, bumati sa malas tawag ng isang function na tinatawag na Alerto, ipapasa sa isa mahabang argumento na ang resulta ng concatenating-sama ng bungkos ng substrings, kumusta na pinaghihiwalay ng puwang, pagkatapos ay anumang ito ay nagbabalik. Kaya dokumento ay tulad ng isang global variable sa na ugat ng puno na, pagtawag ng isang espesyal na function, kung hindi man ay kilala na ngayon bilang paraan. Ang isang pag-andar na sa loob ng isang variable ay na tinatawag na isang pamamaraan sa halip ng isang function. Kaya makakuha ng mga elemento sa pamamagitan ng ID. Ano ang elemento ng ginagawa mo Gusto upang makakuha ng ID nito? Ilagay sa mga sipi magpanipi pangalan at pagkatapos ay partikular na Pinahahalagahan. Kaya sa ibang salita, ang code na iyon lamang hahanapin ng patlang ng teksto na kung saan ang ID ay pangalan at pagkatapos ay makakakuha ng halaga nito. Kaya kung ako ay upang baguhin ito at sabihin Davin sa halip na si David, at i-click ang Isumite, na kami ngayong magkaroon ng pagbati para sa Davin. Ang lahat ng mga karapatan, sa gayon ang lahat ng mga fine at mabuti. Ngunit sabihin makita kung maaari kaming magsagawa ng ang isang maliit na mas malinis dahil lang pagsusulat ng code tulad ng ito ay Sa pangkalahatan ay pagpunta sa ay frowned sa. Ito ay pagpunta sa hitsura scarier. Ngunit kung ano ang unang pagkakaiba na tandaan dito sa bersyong ito maliban sa pangalanan ang pagbabago sa DOM isa? Ano structurally hitsura ng iba't ibang tungkol sa kumpara sa iba pang? Oo? Madla: ba ang form sa tuktok ng script ngayon? David MALAN: Oo, ang form ay nasa tuktok ng script para sa ilang mga kataka-taka dahilan. Kaya iyon ang unang bagay na na jumps out sa akin, masyadong. At Sa kabutihang palad hindi bababa sa, bahaging ito ay magkapareho. Kaya ang tanging bagay na tila sa iba ay na ito. Kaya narito ang kung ano ang kapong baka tungkol sa JavaScript 2. At ito ay ginagawang mahirap Nauunawaan sa unang tingin, lalo na para sa huling proyekto kung tinitingnan mo ang sample code sa online, ngunit ito kahulihan babagsak ito sa ilang pangunahing sintaktik mga tampok. Narito muli ay ang dokumento global variable. Narito muli ay ang pamamaraan o function na na nagsasabing makuha ang elemento ng ID. Ito oras na nais kong makuha ang ID na tinatawag na demo. Saan na? Iyon ay tila karapatan dito, ang mismong form. At ngayon mapansin na tila kung ako makabalik na node mula sa puno na Kinakatawan ang form mismo, hindi isang patlang ng teksto, ito ay lumiliko ang form na iyon, na node o parihaba mula sa puno, May kung ano ang makikita namin tumawag sa isang ari-arian, napaka, napaka, na halos kapareho sa espiritu sa isang struct sa C. Ito ay lamang isang miyembro ng data sa loob ng parihaba. Kaya Mayroon akong form dito, at ako naglalakip, o ako magtatalaga, upang Sa nito Isumite handler o sa halip Sa Magsumite ng ari-arian ang mga sumusunod na function. At ito ay, sa pamamagitan ng malayo, ang craziest bagay kaya sa ngayon syntactically. Ito ay lumiliko out sa JavaScript at sa PHP, at tapat para sa na bagay sa C, kahit na hindi namin gawin ito, maaari mong magdagdag ng hindi mailarawan, anonymous, o aka lambda mga function na walang isang pangalan ngunit maaaring tinatawag na gayunman. Kaya kung ano ang ako paggawa dito ay ako magtatalaga sa On Magsumite ng ari-arian, na ay nasa loob ng node ng aking mga DOM tree, isang function, function na pointer kung habilin sa iyo. Function na ay walang pangalanan ang, ngunit hindi mahalaga dahil namin makita sa isang sandali kung paano tawagan ito. Kapag ang function na ito ay tinatawag na, ang code na ito ay makakakuha pinaandar, pagkatapos ay false ay ibinalik tulad ng dati. Ngunit mapansin kung ano ang iyong ginawa ko. Sa puntong ito sa kuwento, mayroon akong isang form. Ito ay nakuha ng isang natatanging ID na tinatawag na demo. Down dito, mayroon akong isang script tag na executes ang sumusunod na code. Ito attaches sa na node sa ang tree upang ito Sa Isumite ari-arian ang function na ito dito. At sa pamamagitan lamang ng likas na katangian ng kung paano gumagana ang mga browser, kapag ako ngayon i-click ang Isumite o pindutin ang Enter, na function ay pagpunta upang tinatawag. Hindi nito kailangang ng pangalan dahil sino pinahahalagahan ang ano ba kung ano ang tawag. Ang tanging pagkakataon ito ng pagpunta upang makakuha ng na tinatawag ay kapag isinumite ko ang form na ito. Hindi na kailangan para sa akin, ang nag-develop ng tao, upang aktwal na tawagan ito kahit saan pa. Ngayon lamang bilang isang teaser, na parang na Hindi na bale sapat na baluktot, Maaari rin naming gumawa ng mga ito Mas mukhang misteryosong gamit super sikat na library na tinatawag na jQuery. Sa katunayan jQuery at JavaScript ay madalas na conflated. At kung ano ang gagawin namin sa Miyerkules ay pagsisimula gamit ang wika at mga aklatan upang bumuo lalong asynchronous at dynamic na mga application tulad ng pagkuha ng mapa application, application na i-update ang webpage sa tunay oras, tulad ng Facebook o Gchat gawin, at hindi na nakaratay sa banig ating sarili sa Isumite ang pagpindot ng isang get o lamang post nag-iisa. Kaya ako ay nakikita mo sa Miyerkules. [Musika sa pag-play]