1 00:00:00,000 --> 00:00:01,940 >> [Música tocando] 2 00:00:01,940 --> 00:00:11,130 3 00:00:11,130 --> 00:00:14,620 >> DAVID Malan: Este é CS 50, e este é o comezo de semana nove. 4 00:00:14,620 --> 00:00:18,240 E o que pensamos en facer hoxe non é só pechar o capítulo sobre a da semana pasada 5 00:00:18,240 --> 00:00:22,670 material de onde nós nos concentrados en servidor programación web lado con PHP e SQL, 6 00:00:22,670 --> 00:00:23,549 algunhas cousas base de datos. 7 00:00:23,549 --> 00:00:25,590 Imos falar un pouco de hoxe a seguridade e, a continuación, 8 00:00:25,590 --> 00:00:29,590 transición á programación do lado do cliente linguaxe coñecida como JavaScript. 9 00:00:29,590 --> 00:00:31,330 Pero, primeiro, algunha redención. 10 00:00:31,330 --> 00:00:35,030 >> Debe lembrar que, en Mércores, eu me propuxen 11 00:00:35,030 --> 00:00:37,550 para escribir un sitio web que tomou na entrada do usuario 12 00:00:37,550 --> 00:00:41,120 por un código HTML que forman entón almacenado que os nomes de entrada do usuario, teléfono 13 00:00:41,120 --> 00:00:43,124 números e móbil portadores na base de datos. 14 00:00:43,124 --> 00:00:45,540 E entón eu tiven un pouco de orde guión de liña escrita en PHP 15 00:00:45,540 --> 00:00:47,956 que era para interactuar sobre as liñas na base de datos 16 00:00:47,956 --> 00:00:49,400 e enviar mensaxes de texto. 17 00:00:49,400 --> 00:00:53,870 A pesar de varias, varios intentos, nos non conseguir que o traballo ata o final. 18 00:00:53,870 --> 00:00:57,820 >> Entón eu pase toda esta semana de traballo en que o código para levarnos máis alá do punto 19 00:00:57,820 --> 00:01:01,220 de onde paramos, en que todos Teño ata finais deste mércores 20 00:01:01,220 --> 00:01:05,500 Foi esa mensaxe de texto de Margo mentres eu loitaba, 21 00:01:05,500 --> 00:01:09,940 seguido dunha mensaxe de texto dende outro compañeiro, ten ese David. 22 00:01:09,940 --> 00:01:14,030 Seguido por este, marabillosas estimulante. 23 00:01:14,030 --> 00:01:15,840 Seguín indo, moi alentador. 24 00:01:15,840 --> 00:01:20,960 Eu case puiden ata entăo-- e esa é a nota que rematou o mércores. 25 00:01:20,960 --> 00:01:25,850 E entón, de feito, quizais o meu favorito, un momento despois, este entrou. 26 00:01:25,850 --> 00:01:27,000 Porra Asistir xogos. 27 00:01:27,000 --> 00:01:31,080 >> Entón, hoxe, nós solucionar isto cunha rápida mira o que eu teño feito dende entón. 28 00:01:31,080 --> 00:01:35,440 Entón, todo este código está dispoñible liña desde a semana pasada, oito semanas, 29 00:01:35,440 --> 00:01:36,300 código fonte. 30 00:01:36,300 --> 00:01:39,425 E vai ver que eu pase, e realmente limparon un pouco as cousas. 31 00:01:39,425 --> 00:01:42,080 Eu presentei un par outro características de unha base de datos SQL. 32 00:01:42,080 --> 00:01:45,300 Por exemplo, en vez de basta facer transportadora de carbón var 33 00:01:45,300 --> 00:01:47,310 como eu creo que eu fixen en tempo real a semana pasada. 34 00:01:47,310 --> 00:01:49,820 Eu no canto definiu como o que se chama un enum. 35 00:01:49,820 --> 00:01:53,310 >> E algúns de vostedes poden ver iso como nós explorar C. Enum é realmente 36 00:01:53,310 --> 00:01:56,820 unha característica do C, onde pode enumerar unha chea de constantes 37 00:01:56,820 --> 00:01:59,640 e asignar-lles valores automáticos, como un, dous, tres, catro 38 00:01:59,640 --> 00:02:01,330 sen ter os números de código duro. 39 00:02:01,330 --> 00:02:04,780 Entón SQL soporta o mesmo, en que se ten un campo de base de datos que só 40 00:02:04,780 --> 00:02:09,389 quere asumir unha das finita valores, pode, literalmente, especificalo lo 41 00:02:09,389 --> 00:02:13,120 como eu fixen alí por catro operadoras de móbiles populares estadounidense. 42 00:02:13,120 --> 00:02:13,819 >> Entón eu fixen iso. 43 00:02:13,819 --> 00:02:16,610 E eu fixen unha serie de cambios como así, o máis importante dos cales 44 00:02:16,610 --> 00:02:20,090 foi para traballar correo electrónico porque recall, que este programa baseouse en que 45 00:02:20,090 --> 00:02:23,470 xeralmente chamado de un correo-e a Pasarela SMS, que é só 46 00:02:23,470 --> 00:02:27,670 un xeito elegante de dicir que a Verizon, e AT & T e outras persoas soportar un servidor, 47 00:02:27,670 --> 00:02:30,740 polo cal se recibe correo electrónico, el converte a SMS 48 00:02:30,740 --> 00:02:33,290 e envía un texto mensaxe ao teléfono de alguén. 49 00:02:33,290 --> 00:02:37,010 Entón, se eu fixen iso correctamente, aquí é unha forma nova e mellorada 50 00:02:37,010 --> 00:02:39,259 que vai falar con nova e mellorada de código, que 51 00:02:39,259 --> 00:02:40,300 pode xogar en liña. 52 00:02:40,300 --> 00:02:44,140 E espero facer o meu Campá teléfono en só un momento. 53 00:02:44,140 --> 00:02:47,240 >> Entón, primeiro, eu vou escribir o meu nome. 54 00:02:47,240 --> 00:02:51,400 En segundo lugar, eu non vou ao facelo neste momento. 55 00:02:51,400 --> 00:02:53,920 Vou facer Inspect Element. 56 00:02:53,920 --> 00:02:56,710 E este é só un pouca cousa para que eu non faga 57 00:02:56,710 --> 00:02:59,250 crear horas de post-produción traballar como eu fixen a última vez. 58 00:02:59,250 --> 00:03:02,300 Existe agora o meu número de teléfono. 59 00:03:02,300 --> 00:03:03,560 >> Vou seleccionar Verizon. 60 00:03:03,560 --> 00:03:10,260 E aquí, imos conectar o micrófono aquí, e buscar iso no meu teléfono móbil aquí. 61 00:03:10,260 --> 00:03:13,130 Vou prema Register, esperemos que deberá 62 00:03:13,130 --> 00:03:14,530 poñelas na base de datos. 63 00:03:14,530 --> 00:03:16,780 Agora eu estou indo a ir ao programa de liña de comandos, que 64 00:03:16,780 --> 00:03:20,825 recall foi chamado barra dot texto, e cruzar os dedos. 65 00:03:20,825 --> 00:03:24,092 66 00:03:24,092 --> 00:03:26,527 Aquí imos nós. 67 00:03:26,527 --> 00:03:27,501 >> [Dings TELÉFONO] 68 00:03:27,501 --> 00:03:28,962 >> [Aplausos] 69 00:03:28,962 --> 00:03:31,815 70 00:03:31,815 --> 00:03:34,940 DAVID Malan: Entón, máis divertido do que isso- é divertido, por suposto, se eu chegar a el. 71 00:03:34,940 --> 00:03:38,004 Pero é máis divertido, eu penso que, se nós creado un deses momentos de cine 72 00:03:38,004 --> 00:03:40,420 onde como algo realmente malo aconteceu no mundo, 73 00:03:40,420 --> 00:03:42,860 e como toda a xente da NSA móbiles comezar a apitar 74 00:03:42,860 --> 00:03:44,860 con mensaxes de texto alertando-os a este feito. 75 00:03:44,860 --> 00:03:47,026 Entón eu penso que ía tentar para recrear o mesmo aquí, 76 00:03:47,026 --> 00:03:49,610 en que non está a usar unha base de datos, I en vez de antelación 77 00:03:49,610 --> 00:03:51,490 escribiu un programa que se parece con isto. 78 00:03:51,490 --> 00:03:53,660 >> Esta é unha index.php-- e engada este código en liña 79 00:03:53,660 --> 00:03:56,710 como bom-- que aparentemente só fai form.php, 80 00:03:56,710 --> 00:04:00,990 usando un paradigma de estilo MVC que nós falar con máis detalle no conxunto de problemas 81 00:04:00,990 --> 00:04:01,650 Sete. 82 00:04:01,650 --> 00:04:02,910 Este formulario é moi sinxelo. 83 00:04:02,910 --> 00:04:06,634 Vai someterse a unha ficheiro chamado here.php vía post. 84 00:04:06,634 --> 00:04:09,300 E está ao parecer vai pedir por un nome e un número de teléfono, 85 00:04:09,300 --> 00:04:11,400 e, a continuación, a través da así-chamada Seleccione o menú, é 86 00:04:11,400 --> 00:04:14,250 vai darlle polo menos catro operadoras de móbiles populares dos Estados Unidos, 87 00:04:14,250 --> 00:04:17,470 e, a continuación, permitir que efectivamente levar atención premendo aquí. 88 00:04:17,470 --> 00:04:20,471 >> E aquí, mentres tanto, vai prestar algúns dos códigos da última vez. 89 00:04:20,471 --> 00:04:22,553 E se só roçar tanto, vai ver que non hai 90 00:04:22,553 --> 00:04:23,900 unha morea de verificación de erros. 91 00:04:23,900 --> 00:04:26,640 Pero a beleza ao final é que nós non estamos escribindo para unha base de datos actual. 92 00:04:26,640 --> 00:04:29,130 Estamos manténdose o simple e só o envío de espera 93 00:04:29,130 --> 00:04:32,190 unha mensaxe de texto vía función I escribiu sobre o pasado poucos días chamada 94 00:04:32,190 --> 00:04:36,270 Texto, que está en funcións. php, que é de novo dispoñible en liña. 95 00:04:36,270 --> 00:04:38,210 >> Entón, se quere participar desta. 96 00:04:38,210 --> 00:04:40,190 Non imos ser almacenar nada. 97 00:04:40,190 --> 00:04:43,809 Ir a este URL aquí en tempo real. 98 00:04:43,809 --> 00:04:46,850 Non presenta-lo aínda, pero imos ver se podemos ter un destes película 99 00:04:46,850 --> 00:04:49,830 momentos en que o móbil de todo o mundo comeza a apitar, espero só 100 00:04:49,830 --> 00:04:53,580 xa este ano, a diferenza, en 2011 onde esta deu terrible mal. 101 00:04:53,580 --> 00:04:58,910 E xa que vai a ese enderezo, ten que ver unha forma super sinxelo 102 00:04:58,910 --> 00:05:03,884 que se ten un nome, un teléfono móbil número, e un vehículo que teléfono 103 00:05:03,884 --> 00:05:06,175 corresponda á lista de aí, vai adiante e encher o formulario. 104 00:05:06,175 --> 00:05:07,880 Pero non bateu presentar aínda. 105 00:05:07,880 --> 00:05:10,850 >> O formulario está indo ollar coma este. 106 00:05:10,850 --> 00:05:13,660 Dalle escribir o seu nome, número de teléfono. 107 00:05:13,660 --> 00:05:17,670 Oop, alguén vai á fronte da curva. 108 00:05:17,670 --> 00:05:18,170 Está certo. 109 00:05:18,170 --> 00:05:19,340 OK, todo o mundo está cuberto o formulario. 110 00:05:19,340 --> 00:05:21,400 Isto debería funcionar nun teléfono, tamén, se queres. 111 00:05:21,400 --> 00:05:23,695 Todo ben, nas súas marcas, preparar, vai. 112 00:05:23,695 --> 00:05:24,195 Bater Aquí. 113 00:05:24,195 --> 00:05:27,275 114 00:05:27,275 --> 00:05:27,775 O que? 115 00:05:27,775 --> 00:05:31,140 116 00:05:31,140 --> 00:05:31,640 Non. 117 00:05:31,640 --> 00:05:34,410 118 00:05:34,410 --> 00:05:40,250 Xuro por Deus, eu proba iso varias veces hoxe. 119 00:05:40,250 --> 00:05:41,720 Vostede entendeu? 120 00:05:41,720 --> 00:05:43,145 >> [Interpoñendo voces] 121 00:05:43,145 --> 00:05:46,470 122 00:05:46,470 --> 00:05:49,560 >> DAVID Malan: OK, quizais o erro do usuario. 123 00:05:49,560 --> 00:05:50,550 Isto é dous. 124 00:05:50,550 --> 00:05:53,300 El traballou por dous en cada unha algúns centenares, tres, catro. 125 00:05:53,300 --> 00:05:55,940 OK, iso é bo. 126 00:05:55,940 --> 00:05:58,520 Catro de cinco para exactitude como sobre. 127 00:05:58,520 --> 00:05:59,810 >> Entón o que pasou? 128 00:05:59,810 --> 00:06:02,727 Así, presume-se, sen ver o pantallas, por que pode ter con erro? 129 00:06:02,727 --> 00:06:05,518 É, probablemente, que estabamos só intentando facer moitas conexións 130 00:06:05,518 --> 00:06:08,110 ao servidor de correo de Harvard, todo ao xa que desde o mesmo enderezo IP. 131 00:06:08,110 --> 00:06:10,740 Estou só adiviñando xa que eu non fixen ten o luxo de probas 132 00:06:10,740 --> 00:06:13,220 este código con algúns 300 persoas de antelación 133 00:06:13,220 --> 00:06:16,040 pero por agora entender que que, polo menos, debe 134 00:06:16,040 --> 00:06:18,250 comezar o traballo feito neste momento. 135 00:06:18,250 --> 00:06:22,880 >> Todo ben, entón por que todo isto é o máis pertinente para o que está pasando? 136 00:06:22,880 --> 00:06:24,900 Ben, primeiro, unha rápida par de anuncios. 137 00:06:24,900 --> 00:06:29,350 Entón un, se quere unirse Chang, e Nick, e outros no xantar deste venres, 138 00:06:29,350 --> 00:06:32,400 facer de RSVP na URL habitual alí. 139 00:06:32,400 --> 00:06:35,650 Se está a pensar en se concentrar ou facendo un secundario en CS, 140 00:06:35,650 --> 00:06:38,941 se é un estudante de segundo ano, ou calouro, ou mesmo Júnior ou Senior neste momento 141 00:06:38,941 --> 00:06:42,490 e aínda pode espremer nos cursos, entender que a escola de enxeñería 142 00:06:42,490 --> 00:06:45,620 está recollendo balde Ben e Sorbete de Jerry eo consello 143 00:06:45,620 --> 00:06:48,910 este mércores logo da aula en 4:00 no edificio CS 144 00:06:48,910 --> 00:06:49,771 Maxwell en Dworkin. 145 00:06:49,771 --> 00:06:51,520 Se esta é moi rápido na pantalla, só tes que ir 146 00:06:51,520 --> 00:06:55,260 para cs50.harvard.edu para unha enlace ao evento en Facebook 147 00:06:55,260 --> 00:06:57,140 onde se pode ver máis detalles. 148 00:06:57,140 --> 00:07:01,390 >> Mentres tanto, eu penso que eu ía corrixir outra cousa que eu gozado o mércores. 149 00:07:01,390 --> 00:07:04,400 Acontece que ID de Marcos en Facebook non tiña tres anos. 150 00:07:04,400 --> 00:07:05,230 Tiña catro anos. 151 00:07:05,230 --> 00:07:08,330 Acontece que tiña máis proba contas do que me lembro. 152 00:07:08,330 --> 00:07:12,400 Pero o que este se sentiu como un oportunidade que facer é tirar unha URL como esta. 153 00:07:12,400 --> 00:07:16,680 >> Así, verifícase que o Facebook ten unha API, Application Programming Interface, 154 00:07:16,680 --> 00:07:20,070 que é un mecanismo a través do cal pode solicitar datos programaticamente 155 00:07:20,070 --> 00:07:24,480 en Facebook e volver máquina información lexibles, e non páxinas web 156 00:07:24,480 --> 00:07:28,690 pero só o texto cru, algo chámase JavaScript Object Notation. 157 00:07:28,690 --> 00:07:32,150 E, de feito, se eu visitar esta URL, e ampliar, por defecto, 158 00:07:32,150 --> 00:07:34,960 este é Marcos publicamente información accesible. 159 00:07:34,960 --> 00:07:37,430 >> E o detalle interesante aquí é só que o seu ID 160 00:07:37,430 --> 00:07:40,670 é, de feito, o número de catro, que I entender logo que eu fixen iso. 161 00:07:40,670 --> 00:07:44,260 Podes facelo só, se sabe o seu nome de usuario de Facebook, se ten un. 162 00:07:44,260 --> 00:07:45,440 Basta escriba-lo enriba alí. 163 00:07:45,440 --> 00:07:46,640 E nada diso é privada. 164 00:07:46,640 --> 00:07:48,670 Eu só estou facendo iso mesmo no modo de incógnito. 165 00:07:48,670 --> 00:07:49,900 Entón eu non estou mesmo logueado. 166 00:07:49,900 --> 00:07:54,440 E está a ver que eu aparentemente era o número de usuario 6454 167 00:07:54,440 --> 00:07:56,480 en Facebook, o que non é moi mal estes días. 168 00:07:56,480 --> 00:07:59,900 Entón, de calquera forma, tamén vai ver información alí. 169 00:07:59,900 --> 00:08:02,150 >> E o aspecto útil de que é o que 170 00:08:02,150 --> 00:08:06,890 pode escribir o seu propio software que dalgún xeito, integra datos como este 171 00:08:06,890 --> 00:08:08,170 na súa propia aplicación. 172 00:08:08,170 --> 00:08:10,650 Pode que os usuarios para rexistrar na súa páxina web, 173 00:08:10,650 --> 00:08:14,190 non usar o seu propio nome de usuario personalizada e contrasinal, pero quizais o seu login do Facebook 174 00:08:14,190 --> 00:08:16,170 e obter información mesmo sobre os seus amigos, 175 00:08:16,170 --> 00:08:18,740 se aproban tal, ou similar. 176 00:08:18,740 --> 00:08:21,430 Así, teña en conta que CS50, tamén, ten algunhas das súas propias APIs, 177 00:08:21,430 --> 00:08:24,620 unha para os datos do catálogo curso, algúns dos menús abrazos na cea 178 00:08:24,620 --> 00:08:26,730 salóns, todos do edificios e locais 179 00:08:26,730 --> 00:08:30,930 no campus, temos unha API para ben que pode consultar de forma semellante e obter 180 00:08:30,930 --> 00:08:35,520 datos textual de volta que pode integrar nun PHP ou JavaScript, ou incluso, 181 00:08:35,520 --> 00:08:38,320 aínda que menos común, unha C baseada proxecto final. 182 00:08:38,320 --> 00:08:41,190 >> De feito adiante para a final proxecto son algúns marcos. 183 00:08:41,190 --> 00:08:42,980 Ten unha mensaxe o outro día. 184 00:08:42,980 --> 00:08:45,761 Entenda que a proposta débese esta próxima luns. 185 00:08:45,761 --> 00:08:49,010 Non é necesariamente obligatorio, pero precisan recibir os seus compañeiros de ensino 186 00:08:49,010 --> 00:08:51,260 aprobación, antes de facer Calquera cambio posteriores. 187 00:08:51,260 --> 00:08:54,280 E, a continuación, á cabeza son un número doutros marcos. 188 00:08:54,280 --> 00:08:56,542 >> Entón, para provoca-lo, tamén, con algunhas posibilidades, 189 00:08:56,542 --> 00:08:58,250 temos unha morea de estas lámpadas matiz. 190 00:08:58,250 --> 00:09:01,190 E algúns de vostedes xa teñen algún destes no seu cuarto do dormitorio tamén. 191 00:09:01,190 --> 00:09:02,920 E eles tamén teñen unha API. 192 00:09:02,920 --> 00:09:07,300 Así recordar aquelas semanas lámpadas binarios atrás que Dan Bradley e Ansel 193 00:09:07,300 --> 00:09:08,780 Duff creou para nós. 194 00:09:08,780 --> 00:09:12,560 Eles usaron unha interface de software para esta lámpada, que no momento 195 00:09:12,560 --> 00:09:15,232 está conectado á enerxía eléctrica e logo, vía wireless 196 00:09:15,232 --> 00:09:17,690 está conectado a unha pequena cousa chamado a Ponte aquí en baixo, 197 00:09:17,690 --> 00:09:21,280 como un pequeno propietario router para este dispositivo en particular. 198 00:09:21,280 --> 00:09:26,540 >> Pero resulta que se sei como enviar mensaxes de HTTP, como todos nós facemos agora, 199 00:09:26,540 --> 00:09:31,670 Podo enviar unha mensaxe como esta para esta lámpada para liga-lo ou apagado 200 00:09:31,670 --> 00:09:34,000 ou facer calquera número de outras operacións sobre el. 201 00:09:34,000 --> 00:09:36,110 Teña en conta que non é chegar, non é escribir. 202 00:09:36,110 --> 00:09:37,760 Hai outro chamado put. 203 00:09:37,760 --> 00:09:39,630 En realidade, hai algunhas outras tales verbos. 204 00:09:39,630 --> 00:09:42,920 Pero repare que hai un camiño de alí, reducir API, slash novo colaborador, 205 00:09:42,920 --> 00:09:44,990 cortar a luz, cortar unha, barra de estado. 206 00:09:44,990 --> 00:09:49,060 >> Isto é, ao parecer, só o camiño que a empresa, Philips, 207 00:09:49,060 --> 00:09:51,640 decidiu que ten que bater cunha solicitude HTTP 208 00:09:51,640 --> 00:09:55,010 se quere cambiar o estado da lámpada coa utilización de HTTP 1.1. 209 00:09:55,010 --> 00:09:56,380 Logo, teña en conta a liña en branco. 210 00:09:56,380 --> 00:10:00,170 E entón, finalmente o que parece ser tipo de unha matriz de algunha sorte, 211 00:10:00,170 --> 00:10:04,730 iso de novo vai ser chamado JavaScript Object Notation, é Jason. 212 00:10:04,730 --> 00:10:08,000 E o que ve aquí é que hai tres pares de valores clave. 213 00:10:08,000 --> 00:10:09,115 >> Unha clave é chamado. 214 00:10:09,115 --> 00:10:10,990 E o seu valor ao parecer será verdade. 215 00:10:10,990 --> 00:10:13,612 O brillo é de 128, o que é algún tipo de int. 216 00:10:13,612 --> 00:10:15,820 E entón o tempo de transición é cero, o que é aparentemente 217 00:10:15,820 --> 00:10:17,970 canto tempo vai necesario para transformar esa cousa. 218 00:10:17,970 --> 00:10:19,890 >> Entón, agora esta lámpada está apagada. 219 00:10:19,890 --> 00:10:22,880 Pero, se fago exactamente isto-- deixar me ir a unha folla de fraude pouco 220 00:10:22,880 --> 00:10:25,200 que Dan creada en advance-- e eu vou 221 00:10:25,200 --> 00:10:27,920 para ir adiante e copiar a orde a seguir. 222 00:10:27,920 --> 00:10:30,200 Curl, como algúns de vós podería recollido en CS50 223 00:10:30,200 --> 00:10:35,080 Discutir é unha utilidade como o Telnet, tales que pode simular as solicitudes HTTP, 224 00:10:35,080 --> 00:10:36,360 especialmente pon. 225 00:10:36,360 --> 00:10:39,710 Podo enviar estes datos, especialmente o que acabamos de 226 00:10:39,710 --> 00:10:43,430 viu un momento atrás especialmente para este URL aquí. 227 00:10:43,430 --> 00:10:46,310 E despois da onda está indo a tratar con todo cabeceiras necesarios 228 00:10:46,310 --> 00:10:47,600 e análise de alí. 229 00:10:47,600 --> 00:10:54,700 >> Entón, todo o que teño que facer é copiar este en unha fiestra de terminal e, a continuación, prema Intro. 230 00:10:54,700 --> 00:10:56,000 E a lámpada acéndese. 231 00:10:56,000 --> 00:10:59,060 E todo isto é pasando por meu ordenador sen fíos 232 00:10:59,060 --> 00:11:01,960 dalgún xeito á ponte, que é, entón, a falar con esta lámpada. 233 00:11:01,960 --> 00:11:02,960 Podo facer outra cousa. 234 00:11:02,960 --> 00:11:07,050 Podo facer esa cousa vai o vermello, por exemplo. 235 00:11:07,050 --> 00:11:11,040 Podo, por exemplo, facer esa cousa de ir verde. 236 00:11:11,040 --> 00:11:12,220 Podo facelo ir azul. 237 00:11:12,220 --> 00:11:14,760 >> E teña en conta en cada unha delas casos, todo o que eu estou cambiando 238 00:11:14,760 --> 00:11:18,540 é o chamado valor de tonalidade de realmente darlle un pouco de cor. 239 00:11:18,540 --> 00:11:20,320 Entón deixe-me pegas en ben. 240 00:11:20,320 --> 00:11:21,000 Agora é azul. 241 00:11:21,000 --> 00:11:24,672 >> E pode facer aínda máis chic cousas where-- imos para verde. 242 00:11:24,672 --> 00:11:26,630 E eu podería facelo de Claro que co meu propio código. 243 00:11:26,630 --> 00:11:30,670 Pero mesmo a propia API soporta as tarefas de funky 244 00:11:30,670 --> 00:11:35,510 como este, que agora vai se preocupar nos para os próximos 30 segundos. 245 00:11:35,510 --> 00:11:39,170 >> Entón esta é unha mostra do que pode facer unha API, esta vez envolvendo 246 00:11:39,170 --> 00:11:40,010 lámpadas. 247 00:11:40,010 --> 00:11:42,510 Teña en conta que CS50 ten unha parella pares de Google de vidro se 248 00:11:42,510 --> 00:11:45,380 quere abordar algo ao longo estas liñas, Arduino unos, que 249 00:11:45,380 --> 00:11:48,670 son ordenadores minúsculos pequenos, esencialmente, nunha placa de circuíto pequena 250 00:11:48,670 --> 00:11:50,470 que pode conectarse fíos e outras cousas 251 00:11:50,470 --> 00:11:52,732 e, de feito, para o control seu ambiente de mundo real. 252 00:11:52,732 --> 00:11:54,940 E entón hai un par de novos xoguetes que temos. 253 00:11:54,940 --> 00:11:59,294 Esta literalmente só chegou a Outro día, por correo, un Myo Armband. 254 00:11:59,294 --> 00:12:01,710 E eu penso que é unha forma de vostede animado sobre proxectos 255 00:12:01,710 --> 00:12:03,720 que pode usar con este hardware faría 256 00:12:03,720 --> 00:12:08,900 ser para xogar este pequeno clip que empregan para burlar persoas 257 00:12:08,900 --> 00:12:10,500 que estamos agora a vivir no futuro. 258 00:12:10,500 --> 00:12:13,494 259 00:12:13,494 --> 00:12:15,490 >> [Música tocando] 260 00:12:15,490 --> 00:13:33,410 261 00:13:33,410 --> 00:13:37,109 >> DAVID Malan: Entón, en só unhas semanas, ten Tamén pode ser que legal na feira CS50. 262 00:13:37,109 --> 00:13:39,150 Outro dispositivo que ten unha morea de que estamos 263 00:13:39,150 --> 00:13:42,090 feliz para prestar para proxectos chámase un controlador de movemento. 264 00:13:42,090 --> 00:13:45,030 Este é un dispositivo USB pouco se conecta a un ordenador que 265 00:13:45,030 --> 00:13:47,520 permite que interactuar con seu portátil, Mac ou PC, 266 00:13:47,520 --> 00:13:51,570 como se tivese como un Xbox Kinect e realmente facer movementos físicos moi 267 00:13:51,570 --> 00:13:54,509 como vemos neste visión de futuro. 268 00:13:54,509 --> 00:13:56,505 >> [Música tocando] 269 00:13:56,505 --> 00:15:03,380 270 00:15:03,380 --> 00:15:06,260 >> DAVID Malan: Entón, mesmo se ten ningunha idea de como algo así 271 00:15:06,260 --> 00:15:10,050 podería ser posiblemente inventado ou traballo nun nivel de hardware, non importa. 272 00:15:10,050 --> 00:15:13,520 Mesmo despois de só uns meses de CS50, e unha comprensión de programación 273 00:15:13,520 --> 00:15:19,460 máis xeral, e programación web máis recentemente, e despois tamén APIs, e HTTP, 274 00:15:19,460 --> 00:15:21,830 terá acceso vía APIs de software se 275 00:15:21,830 --> 00:15:24,680 quero pedir unha delas dispositivos para realmente falar con el 276 00:15:24,680 --> 00:15:27,180 e non ten que se preocupar a posta en marcha subxacente 277 00:15:27,180 --> 00:15:30,220 detalles, o cal é totalmente consistente coa noción de estratificación 278 00:15:30,220 --> 00:15:33,610 unha abstracción que temos ver ao longo do semestre. 279 00:15:33,610 --> 00:15:37,990 >> Así tamén na fin de semana, vin algunhas pezas de novas. 280 00:15:37,990 --> 00:15:40,640 Vaia primeiro, ir a seminarios se quere aprender algo 281 00:15:40,640 --> 00:15:42,160 máis en calquera número de temas. 282 00:15:42,160 --> 00:15:43,340 Consulte o URL alí. 283 00:15:43,340 --> 00:15:45,890 E este foi enviado a me por Chang, que sabe, 284 00:15:45,890 --> 00:15:47,850 quen está a imprimir o noso exército de elefantes. 285 00:15:47,850 --> 00:15:49,910 E foi un titular como segue. 286 00:15:49,910 --> 00:15:51,280 Teño pavor da miña nova TV. 287 00:15:51,280 --> 00:15:54,301 Por que eu estou con medo de converter este cousa e estaría moito. 288 00:15:54,301 --> 00:15:56,050 Entón, nós estamos agora en apuntan no semestre, 289 00:15:56,050 --> 00:15:58,860 tamén, onde mesmo se ten a menor de entendemento 290 00:15:58,860 --> 00:16:02,620 de como a web funciona e HTTP, e de seguridade, cousas como esta 291 00:16:02,620 --> 00:16:03,980 debe comezar a chamar a atención. 292 00:16:03,980 --> 00:16:07,450 Pero tamén, vai entender se estas cousas son ou non 293 00:16:07,450 --> 00:16:08,430 ameazas reais. 294 00:16:08,430 --> 00:16:10,940 >> Entón eu peguei algúns fragmentos a partir deste artigo aquí. 295 00:16:10,940 --> 00:16:12,540 E a historia é a seguinte. 296 00:16:12,540 --> 00:16:14,300 Agora son o dono da unha nova televisión intelixente, que 297 00:16:14,300 --> 00:16:18,470 promete entregar streaming contidos multimedia, xogos, app, 298 00:16:18,470 --> 00:16:21,450 medios sociais e Internet navegación, oh e TV tamén. 299 00:16:21,450 --> 00:16:24,410 O único problema é que eu son agora medo de usalo, di o autor. 300 00:16:24,410 --> 00:16:29,592 Vostede sería, tamén, se ler a política de privacidade páxina 46 para a TV. 301 00:16:29,592 --> 00:16:31,800 A cantidade de datos esta que colecciona é impresionante. 302 00:16:31,800 --> 00:16:35,710 El rexistra onde, cando, como e por canto tempo usa a TV. 303 00:16:35,710 --> 00:16:38,190 Establece cookies de seguimento, como xa discutir, 304 00:16:38,190 --> 00:16:40,560 e beacons deseñado para detectar cando ten 305 00:16:40,560 --> 00:16:43,185 determinado contido visto ou unha mensaxe de correo electrónico especial 306 00:16:43,185 --> 00:16:45,230 se quere comprobar correo-e no seu televisor. 307 00:16:45,230 --> 00:16:48,430 El rexistra as aplicacións que usar, os sitios que visita, 308 00:16:48,430 --> 00:16:52,280 e como interactúa co contido, facendo todo o que vía a súa televisión intelixente. 309 00:16:52,280 --> 00:16:55,470 Tamén, yet-- creepier esta é a miña addition-- 310 00:16:55,470 --> 00:16:58,140 ten un construído en cámara con recoñecemento facial. 311 00:16:58,140 --> 00:17:01,010 >> O obxectivo consiste en ofrecer control por xestos para a TV 312 00:17:01,010 --> 00:17:05,490 e permiten que faga o login para personalizado conta co seu rostro. 313 00:17:05,490 --> 00:17:08,940 No lado positivo, as imaxes son gardados na TV ao contrario de cargado 314 00:17:08,940 --> 00:17:09,940 a un servidor corporativo. 315 00:17:09,940 --> 00:17:12,520 No lado negativo, a internet conexión fai que toda a TV 316 00:17:12,520 --> 00:17:14,811 vulnerables a hackers que demostraron a capacidade 317 00:17:14,811 --> 00:17:16,700 para asumir o control total da máquina. 318 00:17:16,700 --> 00:17:20,880 >> Máis preocupante, como se isto non fose intelixente abondo, é o micrófono. 319 00:17:20,880 --> 00:17:23,599 A TV posúe unha voz recurso de recoñecemento 320 00:17:23,599 --> 00:17:26,859 que permite aos espectadores controlar a pantalla con comandos de voz. 321 00:17:26,859 --> 00:17:30,290 Pero o servizo ven con unha advertencia moi sinistro. 322 00:17:30,290 --> 00:17:33,030 Por favor, estea en conta que se as súas palabras faladas inclúen 323 00:17:33,030 --> 00:17:36,210 persoal ou outro sensible información, que a información 324 00:17:36,210 --> 00:17:40,310 estarán entre os datos capturados e transmitida a un terceiro. 325 00:17:40,310 --> 00:17:40,870 Entendeu? 326 00:17:40,870 --> 00:17:45,860 Non diga persoais ou confidenciais cousas diante do televisor. 327 00:17:45,860 --> 00:17:47,280 >> Polo tanto, este é, en realidade, de verdade. 328 00:17:47,280 --> 00:17:50,530 E é difícil non ver se ir á Best Buy ou similares para televisores 329 00:17:50,530 --> 00:17:51,030 nos días de hoxe. 330 00:17:51,030 --> 00:17:52,540 Son todos intelixentes de algunha maneira. 331 00:17:52,540 --> 00:17:54,740 E eles están recibindo máis intelixente e máis asustado. 332 00:17:54,740 --> 00:17:57,490 E eles están simplemente a obtención de datos de formas que falamos de 333 00:17:57,490 --> 00:18:01,840 e, a continuación, envialo vía HTTP ou algún outro protocolo para un servidor. 334 00:18:01,840 --> 00:18:05,720 >> Polo tanto, este foi dun artigo de diversión neste sitio en liña 335 00:18:05,720 --> 00:18:08,940 aquí, que falou sobre a especial erro ou código equivocado 336 00:18:08,940 --> 00:18:11,340 que podemos realmente amarre para discusión da semana pasada. 337 00:18:11,340 --> 00:18:15,730 Polo tanto, este título era como segue, a historia pasa aquí, 338 00:18:15,730 --> 00:18:18,720 Josh Breckman traballaba para unha empresa que conseguiu un contrato 339 00:18:18,720 --> 00:18:22,390 desenvolver unha xestión de contidos sistema, ou CMS como son chamados, 340 00:18:22,390 --> 00:18:24,380 para unha moi grande sitio web do goberno. 341 00:18:24,380 --> 00:18:27,300 Gran parte do proxecto implica desenvolvemento dun sistema de xestión de contidos 342 00:18:27,300 --> 00:18:29,840 para que os funcionarios serían capaz de construír e manter 343 00:18:29,840 --> 00:18:31,877 a constante cambio contido para o seu sitio. 344 00:18:31,877 --> 00:18:34,210 As cousas correron moi ben para poucos días despois de ir ao vivo. 345 00:18:34,210 --> 00:18:37,020 Pero o sexto día, as cousas non correu tan ben. 346 00:18:37,020 --> 00:18:39,500 Todo o contido no sitio desaparecera completamente. 347 00:18:39,500 --> 00:18:42,950 E todas as páxinas levou ao estándar, por favor entrar na páxina web de contido. 348 00:18:42,950 --> 00:18:43,810 Whoops. 349 00:18:43,810 --> 00:18:46,080 Josh foi chamado para investigar e notei 350 00:18:46,080 --> 00:18:49,390 que unha particularmente problemático enderezo IP externo tivo 351 00:18:49,390 --> 00:18:53,380 ir e excluídos todos o contido do sistema. 352 00:18:53,380 --> 00:18:56,290 >> O enderezo IP Non pertenzo para algúns no exterior hackers dobrado 353 00:18:56,290 --> 00:18:58,340 en destruír útil información do goberno. 354 00:18:58,340 --> 00:19:05,190 El resolveu googlebot.com, Moi propia araña de Google web seguimento. 355 00:19:05,190 --> 00:19:06,010 Whoops. 356 00:19:06,010 --> 00:19:09,150 Despois dun pouco de investigación e loitando en torno a atopar un backup noncorrupt, 357 00:19:09,150 --> 00:19:10,180 Josh atopou o problema. 358 00:19:10,180 --> 00:19:12,700 >> Un usuario tiña copiado e pegado algún contido dun 359 00:19:12,700 --> 00:19:15,670 páxina a outra, incluíndo un Edit Hyperlink 360 00:19:15,670 --> 00:19:17,577 para modificar o contido da páxina. 361 00:19:17,577 --> 00:19:20,160 Normalmente isto non sería un cuestión, xa que un usuario fóra faría 362 00:19:20,160 --> 00:19:24,320 necesario escribir un nome e un contrasinal, pero o sistema de autenticación CMS, 363 00:19:24,320 --> 00:19:27,520 o sistema de login, non tivo en conta 364 00:19:27,520 --> 00:19:30,980 piratería sofisticado técnicas de Google Araña. 365 00:19:30,980 --> 00:19:31,700 Whoops. 366 00:19:31,700 --> 00:19:33,610 >> Como se ve, Google A araña non usar 367 00:19:33,610 --> 00:19:36,950 cookies, que significa que pode facilmente evitar un cheque para a 368 00:19:36,950 --> 00:19:39,840 está rexistrado no set cookie para ser falsa. 369 00:19:39,840 --> 00:19:42,620 Tamén non prestar atención a JavaScript, que normalmente 370 00:19:42,620 --> 00:19:45,170 solicitar e redireccionar usuarios que non está dentro do sistema. 371 00:19:45,170 --> 00:19:48,610 Isto, con todo, seguir cada hyperlink en cada páxina que atopa, 372 00:19:48,610 --> 00:19:51,700 incluíndo aqueles con Borrar páxina no título. 373 00:19:51,700 --> 00:19:52,650 Whoops. 374 00:19:52,650 --> 00:19:56,070 >> Entón que é o que isto significa en máis termos técnicos, pero moi accesibles? 375 00:19:56,070 --> 00:19:58,340 Significa só que en todo o seu sitio web, 376 00:19:58,340 --> 00:20:02,287 eles tiñan URL non moi diferente deste que podes ver no conxunto de problemas sete. 377 00:20:02,287 --> 00:20:04,620 Teña en conta que no conxunto de problemas de sete ou coñecen en conxunto de problemas de sete 378 00:20:04,620 --> 00:20:06,411 que está desafiado, entre outras cousas, 379 00:20:06,411 --> 00:20:08,570 para vender accións en nome dos usuarios. 380 00:20:08,570 --> 00:20:14,010 Pero a implantación deste recurso por medio de obter a través de hiperlinks no seu usuario 381 00:20:14,010 --> 00:20:16,880 interface, probablemente non a idea máis intelixente 382 00:20:16,880 --> 00:20:20,300 porque se o sitio é dalgunha forma accesibles, ou por un ser humano 383 00:20:20,300 --> 00:20:23,577 quen está premendo en torno ou mercar un bot como Google ou a Spider 384 00:20:23,577 --> 00:20:26,160 como son chamados iso é só seguimento web intentando índice 385 00:20:26,160 --> 00:20:29,060 a web como un buscador, que podían moi facilmente 386 00:20:29,060 --> 00:20:31,340 acadar mediante obter este tipo de URL. 387 00:20:31,340 --> 00:20:33,770 E iso é funcionalmente equivalente a, neste caso, 388 00:20:33,770 --> 00:20:37,000 venda de todas as accións de Google. 389 00:20:37,000 --> 00:20:40,030 >> Agora, a verdade, é totalmente asinino que o CMS 390 00:20:40,030 --> 00:20:43,240 Usado JavaScript e cookies para aplicar o sistema de login 391 00:20:43,240 --> 00:20:47,100 e non a facer iso ao lado do servidor, como vostedes fan e ganas en PSet 7-- 392 00:20:47,100 --> 00:20:49,940 hai unha login.php file-- sempre, sempre, 393 00:20:49,940 --> 00:20:52,789 sempre a seguridade debe ser feito no lado do servidor, 394 00:20:52,789 --> 00:20:56,080 non no lado do cliente, xa que, como esta artigo suxire que pode e vostede mesmo 395 00:20:56,080 --> 00:20:59,600 ver, nalgún momento, é trivial para un usuario, bo ou malo, 396 00:20:59,600 --> 00:21:02,860 para simplemente apagar JavaScript para non falar de cookies. 397 00:21:02,860 --> 00:21:06,020 Entón esta é a súa WTF diaria. 398 00:21:06,020 --> 00:21:07,970 >> Hai máis dun, que é só un pouco asustado, 399 00:21:07,970 --> 00:21:11,360 entón eu vou falar que se só como unha lección de vida. 400 00:21:11,360 --> 00:21:14,850 Sempre que usar unha aplicación chamado como Snapchat ou similares 401 00:21:14,850 --> 00:21:19,380 que di que estas fotos só duran cinco segundo, dez segundos, ou outros enfeites. 402 00:21:19,380 --> 00:21:21,680 Son efémeras que é absolutamente non é o caso. 403 00:21:21,680 --> 00:21:25,670 Como non hai ningunha maneira, dixitalmente, para aplicar algún tipo de vídeo, 404 00:21:25,670 --> 00:21:30,150 ou imaxe, ou textual compartir tales que un receptor na outra extrema 405 00:21:30,150 --> 00:21:31,660 non pode dalgún xeito gardar os datos. 406 00:21:31,660 --> 00:21:34,300 >> Na forma máis inxenua, alguén podería tomar o seu teléfono. 407 00:21:34,300 --> 00:21:36,850 E eles teñen unha segunda xanela 10 mentres mira para algunha presión 408 00:21:36,850 --> 00:21:39,410 só tomar algún outro teléfono e fotografala lo, obviamente. 409 00:21:39,410 --> 00:21:41,660 Así, pode preservar algo dixitalmente desa forma. 410 00:21:41,660 --> 00:21:44,620 Algúns de vostedes saben como tomar screenshots do seu teléfono. 411 00:21:44,620 --> 00:21:49,290 En realidade, se non sabe iso, entender que, polo menos, Snapchat, 412 00:21:49,290 --> 00:21:51,040 e eu creo que outro aplicacións nos días de hoxe, 413 00:21:51,040 --> 00:21:53,720 polo menos dicir se a destinatario ten, de feito, 414 00:21:53,720 --> 00:21:55,310 tomado un screenshot da súa imaxe. 415 00:21:55,310 --> 00:22:00,870 >> Pero peor aínda, esta foi a snappening, como alguén acuñou hai pouco, 416 00:22:00,870 --> 00:22:04,680 onde algúns 100.000 snaps fora liberado 417 00:22:04,680 --> 00:22:09,310 no que se chama un ficheiro torrent en varios sitios, en última instancia. 418 00:22:09,310 --> 00:22:12,000 E estes contiñan un grupo enteiro de mensaxes privadas e artigos. 419 00:22:12,000 --> 00:22:15,210 Acontece que a maioría delas benigna, polo que non é o que podería esperar. 420 00:22:15,210 --> 00:22:17,580 Senón porque a xente tiñan utilizado unha web de terceiros, 421 00:22:17,580 --> 00:22:20,270 facer login coa súa Snapchat nome de usuario e contrasinal e, a continuación, 422 00:22:20,270 --> 00:22:23,470 gardar todos os seus snaps neste sitio de terceiros. 423 00:22:23,470 --> 00:22:26,130 E foi ese terceiro sitio que foi hackeado, 424 00:22:26,130 --> 00:22:30,710 que só quería dicir que alguén descubriu como para obter todos os 100.000 máis desas imaxes 425 00:22:30,710 --> 00:22:33,822 no seu propio disco duro para compartir posterior. 426 00:22:33,822 --> 00:22:36,030 Francamente, aquí tamén, é unha especie de asinino que Snapchat 427 00:22:36,030 --> 00:22:39,360 é aplicado de xeito que un terceiro pode clasificar de interceptación 428 00:22:39,360 --> 00:22:43,310 os datos e que non está ligada á súa propia aplicación en execución no teléfono. 429 00:22:43,310 --> 00:22:46,947 Pero aquí, tamén, entender que estes as cousas non deben incorporarse vostede de sorpresa, 430 00:22:46,947 --> 00:22:49,030 ou polo menos non debería ser unha lección de vida aquí. 431 00:22:49,030 --> 00:22:52,220 Se desexa que o técnico detalles, vaia á URL alí 432 00:22:52,220 --> 00:22:53,570 que está láminas de hoxe. 433 00:22:53,570 --> 00:23:00,960 Todo ben, calquera dúbida sobre leccións de vida de hoxe no CS? 434 00:23:00,960 --> 00:23:02,710 Desactivar iso. 435 00:23:02,710 --> 00:23:04,970 Calquera cousa en todo? 436 00:23:04,970 --> 00:23:06,301 Calquera cousa en todo? 437 00:23:06,301 --> 00:23:09,050 Eu teño unha morea de xente verificación súa Snapchat ou algo agora. 438 00:23:09,050 --> 00:23:11,690 >> Todo ben, entón SQL, Structured Query Language. 439 00:23:11,690 --> 00:23:12,509 Imos acabar con isto. 440 00:23:12,509 --> 00:23:14,300 E tamén, aínda que estamos só rabuñando 441 00:23:14,300 --> 00:23:16,310 a superficie desta linguaxe, nós imos dar-lle 442 00:23:16,310 --> 00:23:18,930 suficiente da lingua baixo a forma de PSet 7 443 00:23:18,930 --> 00:23:22,140 de modo que pode afrontar algúns funcionalidade bastante común. 444 00:23:22,140 --> 00:23:24,912 Pero entendo que hai unha parella cousas que non esixen de ti, 445 00:23:24,912 --> 00:23:27,120 pero eles están indo a ser importante vir proxectos finais 446 00:23:27,120 --> 00:23:30,760 e, por suposto, veñen facendo real sitios con usuarios reais 447 00:23:30,760 --> 00:23:32,040 É esta decisión deseño. 448 00:23:32,040 --> 00:23:34,460 >> Acontece que en unha base de datos MySQL, vostede 449 00:23:34,460 --> 00:23:37,460 ter acios de opcións como tipo de datos para as columnas 450 00:23:37,460 --> 00:23:41,670 e outras cousas, pero tamén ten a elección dun así chamado almacenamento 451 00:23:41,670 --> 00:23:44,570 motor para todos os seus datos, o tipo de sistema de ficheiros, 452 00:23:44,570 --> 00:23:46,700 se está familiarizado, para todos os seus datos. 453 00:23:46,700 --> 00:23:48,830 O formato é en definitiva, almacenados? 454 00:23:48,830 --> 00:23:53,300 E o máis común, quizais, foi MyISAM e InnoDB, termos técnicos 455 00:23:53,300 --> 00:23:56,060 que se preocupan só na medida en que ten un 456 00:23:56,060 --> 00:23:58,500 e non se ten o seguinte recurso. 457 00:23:58,500 --> 00:24:00,390 >> Supoña que ten un pequeno frigorífico dormitorio. 458 00:24:00,390 --> 00:24:03,030 E supoña que vostede ea súa compañeiro de cuarto, que comparten este frigorífico, 459 00:24:03,030 --> 00:24:04,682 son realmente lle gustaba de leite por exemplo. 460 00:24:04,682 --> 00:24:07,140 E este é, de feito, como o historia foi contada a min camiño de volta 461 00:24:07,140 --> 00:24:10,890 o día en que eu fixen un curso chamado CS 161 Sistemas Operativos, que 462 00:24:10,890 --> 00:24:12,580 semellante explota este tema. 463 00:24:12,580 --> 00:24:13,760 Entón tes este frigorífico. 464 00:24:13,760 --> 00:24:14,630 Está fóra de leite. 465 00:24:14,630 --> 00:24:17,000 E chegar a casa, o seu compañeiro de cuarto de aínda na clase ou calquera outra cousa, 466 00:24:17,000 --> 00:24:19,208 e decide vou saír e conseguir un pouco de leite. 467 00:24:19,208 --> 00:24:22,630 Entón pecha a neveira, bloqueo cuarto do dormitorio, atravesar a rúa 468 00:24:22,630 --> 00:24:25,330 a CVS ou onde queira, e obteña na cola para mercar un pouco de leite. 469 00:24:25,330 --> 00:24:28,960 >> Mentres tanto, o seu compañeiro de cuarto chega na casa de clase, queda en cuarto do dormitorio, 470 00:24:28,960 --> 00:24:31,802 abre a neveira, tamén entende ooph, estamos fóra de leite. 471 00:24:31,802 --> 00:24:33,760 El ou ela pecha a neveira e, a continuación, pasa 472 00:24:33,760 --> 00:24:35,610 para ir a outro CVS, que pasa a ser 473 00:24:35,610 --> 00:24:38,470 un Cityblock de distancia das outras CVS na praza, e entra na cola 474 00:24:38,470 --> 00:24:40,230 alí para obter un pouco de leite. 475 00:24:40,230 --> 00:24:42,524 Agora, por suposto, nalgúns minutos máis tarde, tanto volver, 476 00:24:42,524 --> 00:24:44,690 eo peor de todo é posible resultados que pasou. 477 00:24:44,690 --> 00:24:45,792 Ten tanto de leite. 478 00:24:45,792 --> 00:24:47,500 E realmente non como o leite que moito. 479 00:24:47,500 --> 00:24:49,625 Entón, un deles é só vai aceda nalgún punto. 480 00:24:49,625 --> 00:24:55,941 Entón agora ten unha cantidade excesiva de leite na neveira, pois todo por que? 481 00:24:55,941 --> 00:24:57,072 >> [Inaudível] 482 00:24:57,072 --> 00:24:59,780 DAVID Malan: Si, non fixo dalgún xeito comunicar uns cos outros 483 00:24:59,780 --> 00:25:00,904 que estaban a recibir leite. 484 00:25:00,904 --> 00:25:04,320 Así, no máis simple dos formas no mundo humano, 485 00:25:04,320 --> 00:25:08,390 como pode evitar esa bobada escenario ocorre tal 486 00:25:08,390 --> 00:25:09,750 que só acabar con un. 487 00:25:09,750 --> 00:25:10,840 Texto-los, si bo. 488 00:25:10,840 --> 00:25:12,877 Pero de que outra? 489 00:25:12,877 --> 00:25:13,460 Post-it. 490 00:25:13,460 --> 00:25:14,626 DAVID Malan: Un Post-it. 491 00:25:14,626 --> 00:25:17,150 Calquera forma de comunicación que di ao seu compañeiro de cuarto 492 00:25:17,150 --> 00:25:18,670 non ir á neveira para o leite. 493 00:25:18,670 --> 00:25:20,440 Eu estou indo a ir encher no meu propio. 494 00:25:20,440 --> 00:25:22,770 Entón tes que de algunha maneira para bloquear esta función. 495 00:25:22,770 --> 00:25:27,180 Así, podemos facer isso- pudermos tipo de arruinar a historia e converterse nunha historia de CS 496 00:25:27,180 --> 00:25:30,360 en que pensar niso como só como un variable, que é o almacenamento de algún valor. 497 00:25:30,360 --> 00:25:32,570 E agora, o valor do leite é cero, 498 00:25:32,570 --> 00:25:35,410 que non quere que o seu compañeiro de cuarto para inspeccionar esa variable 499 00:25:35,410 --> 00:25:38,730 e despois tomar unha decisión si mesmo con base no estado da variable 500 00:25:38,730 --> 00:25:42,430 se está no proceso de cambiar o estado desa variable. 501 00:25:42,430 --> 00:25:46,140 >> Polo tanto, unha das liñas de SQL que darlle en PSet especificación 7 502 00:25:46,140 --> 00:25:47,310 é este aquí. 503 00:25:47,310 --> 00:25:49,740 E nós non gastar unha enorme cantidade de tempo a falar sobre iso. 504 00:25:49,740 --> 00:25:55,100 Pero acontece que, se estás para mercar algunhas accións en CS50 finanzas 505 00:25:55,100 --> 00:25:58,000 que xa ten algunhas partes de ti 506 00:25:58,000 --> 00:26:01,750 quere ser capaz de facer unha serie de cousas xuntos instantaneamente. 507 00:26:01,750 --> 00:26:04,360 Quere ser capaz de efectivamente, en un alto nivel, 508 00:26:04,360 --> 00:26:06,700 comprobar todo ben, se eu queira para mercar máis accións de balde, 509 00:26:06,700 --> 00:26:08,780 o que penny stock falar na especificación, 510 00:26:08,780 --> 00:26:10,660 Quero primeiro cheque cantas accións eu teño. 511 00:26:10,660 --> 00:26:11,810 E supoño que é de cinco anos. 512 00:26:11,810 --> 00:26:14,600 E supoña que quero compra máis 10, eu, en última instancia 513 00:26:14,600 --> 00:26:17,069 quere ter 15 partes de stock. 514 00:26:17,069 --> 00:26:18,360 Entón eu teño que facer dúas preguntas. 515 00:26:18,360 --> 00:26:20,230 Cal é o estado da variable? 516 00:26:20,230 --> 00:26:21,470 Cal é o estado da liña? 517 00:26:21,470 --> 00:26:22,970 Cantas accións teño actualmente? 518 00:26:22,970 --> 00:26:24,636 Entón quere ir adiante e actualiza-lo. 519 00:26:24,636 --> 00:26:27,720 Entón ese é o analóxico para o leite que verifique a liña, 520 00:26:27,720 --> 00:26:30,730 e entón quere actualiza-lo porque se quere mercar 10 accións, 521 00:26:30,730 --> 00:26:32,521 non quere cambiar a liña a 10, ten 522 00:26:32,521 --> 00:26:35,300 quere mudalo para 5 máis de 10 ou, por suposto, 15. 523 00:26:35,300 --> 00:26:40,030 >> Esta liña de código asegura que estas dúas ideas conceptuais 524 00:26:40,030 --> 00:26:42,810 pasar xuntos ou non en todos. 525 00:26:42,810 --> 00:26:46,920 Ninguén, incluíndo algún outro usuario quen está conectado o mesmo sitio, 526 00:26:46,920 --> 00:26:49,900 dalgún xeito pode deter a verificación da liña 527 00:26:49,900 --> 00:26:52,960 ea actualización da liña, a seleccionar e actualización se quere. 528 00:26:52,960 --> 00:26:57,360 E a sintaxe non é super obvia, pero esta liña, tempo é o que é, 529 00:26:57,360 --> 00:27:01,150 Asegura que as dúas operacións comprobar a variable ou comprobar a liña 530 00:27:01,150 --> 00:27:04,660 e actualizar a liña ocorrer atomicamente. 531 00:27:04,660 --> 00:27:06,849 >> Oh, aquí imos nós de novo. 532 00:27:06,849 --> 00:27:07,890 Mensaxe de texto no meu teléfono móbil. 533 00:27:07,890 --> 00:27:09,954 Entón, imos facer deste un pouco máis concreto. 534 00:27:09,954 --> 00:27:12,120 Supoña que non está implementación dunha neveira, 535 00:27:12,120 --> 00:27:16,400 e non está aplicando PSet 7, pero unha base real, 536 00:27:16,400 --> 00:27:20,000 ou un cadro electrónico, un cadro automático Machine, en que dalgún xeito 537 00:27:20,000 --> 00:27:22,960 quero ser capaz de capacitar que os usuarios transfiran diñeiro 538 00:27:22,960 --> 00:27:24,500 desde unha conta a outra. 539 00:27:24,500 --> 00:27:25,100 OK, agarde. 540 00:27:25,100 --> 00:27:26,683 Vou silenciar isto agora, grazas. 541 00:27:26,683 --> 00:27:30,450 Por iso, queremos mover diñeiro a partir dun número de conta 542 00:27:30,450 --> 00:27:33,600 nunha conta diferente número, especialmente de $ 100. 543 00:27:33,600 --> 00:27:37,690 Polo tanto, esta é unha especie de arbitrario exemplo, a través do cal, o ATM, 544 00:27:37,690 --> 00:27:41,060 Pode querer executar dous SQL consultas, restar dunha conta, 545 00:27:41,060 --> 00:27:42,430 e engadir a outra conta. 546 00:27:42,430 --> 00:27:46,766 Pero quere garantir que estes dúas liñas, tanto ocorrer ou non en todos. 547 00:27:46,766 --> 00:27:48,640 Non quere algo estar detido. 548 00:27:48,640 --> 00:27:51,440 Non facer algunha mala cara intelixente dalgún xeito, de pé no Bank of America 549 00:27:51,440 --> 00:27:53,270 con dous caixas electrónicos fronte del e dalgunha forma 550 00:27:53,270 --> 00:27:55,270 tipo de escritura en comandos á vez, 551 00:27:55,270 --> 00:28:01,230 espero intentando deducir 200 dólares, no canto de 100 dólares e ter só 100 dólares créditos. 552 00:28:01,230 --> 00:28:04,450 En suma, quere que isto comportan-se exactamente como espera. 553 00:28:04,450 --> 00:28:06,540 >> E o xeito de facer isto en SQL base de datos é 554 00:28:06,540 --> 00:28:09,350 vostede envolve-la en que é chamado dunha transacción. 555 00:28:09,350 --> 00:28:14,290 Literalmente en SQL, pode chamar de CS50 función de consulta co Cita inicio unquote 556 00:28:14,290 --> 00:28:15,370 transacción. 557 00:28:15,370 --> 00:28:18,640 Logo, pode realizar calquera número de consultas SQL posteriores, 558 00:28:18,640 --> 00:28:20,870 pero ningún deles ter efecto sobre a base de datos 559 00:28:20,870 --> 00:28:25,880 ata que chame consulta entre comiñas comprometerse novamente usando PHP. 560 00:28:25,880 --> 00:28:29,810 E, deste xeito, pode garantir que mesmo se ten 1.000 usuarios todos 561 00:28:29,810 --> 00:28:32,080 bater súa base de datos á vez, o SQL 562 00:28:32,080 --> 00:28:34,540 prometer que estes dúas consultas serán 563 00:28:34,540 --> 00:28:36,740 implantado un pouco despois do outro. 564 00:28:36,740 --> 00:28:40,330 Entón non acabar co exceso de leite ou a cantidade errónea, en última instancia, 565 00:28:40,330 --> 00:28:40,830 de diñeiro. 566 00:28:40,830 --> 00:28:43,110 >> Polo tanto, manter isto presente, non tanto para PSet 7 567 00:28:43,110 --> 00:28:45,250 pero para proxectos finais se é realmente 568 00:28:45,250 --> 00:28:49,690 intentando mover os datos mediante táboas como pode aquí. 569 00:28:49,690 --> 00:28:53,980 Pero quizais aínda máis simple e máis obvia para entender cun exemplo 570 00:28:53,980 --> 00:28:54,860 é este aquí. 571 00:28:54,860 --> 00:28:57,760 E alguén ten falado sobre iso só o outro día 572 00:28:57,760 --> 00:28:59,600 cando viu algo semellante en liña. 573 00:28:59,600 --> 00:29:03,480 >> Entón, para o meu coñecemento, o sistema de Pino non é vulnerable a este ataque. 574 00:29:03,480 --> 00:29:06,637 E eu non teño idea se el mesmo os usos a base de datos SQL debaixo do capó. 575 00:29:06,637 --> 00:29:08,470 Pero imos usalo para a causa da discusión. 576 00:29:08,470 --> 00:29:10,178 Aquí é a pantalla que Persoas tenden Harvard 577 00:29:10,178 --> 00:29:13,620 a ver cando efectuar o login co seu Número Harvard ID eo seu PIN. 578 00:29:13,620 --> 00:29:19,020 E supoña que o sistema de pinos foron aplicado en PHP e cun MySQL 579 00:29:19,020 --> 00:29:22,000 base de datos, o código que alguén anos podería ter escrito atrás 580 00:29:22,000 --> 00:29:23,270 pode ter esta aparencia. 581 00:29:23,270 --> 00:29:25,230 En primeiro lugar, declare unha chamada variable usuario. 582 00:29:25,230 --> 00:29:27,560 E só comezar a partir de o superglobal POST. 583 00:29:27,560 --> 00:29:30,140 A continuación, obter outra variable chamado contrasinal e facer o mesmo. 584 00:29:30,140 --> 00:29:33,080 E despois é só realizar esta longa consulta aquí, 585 00:29:33,080 --> 00:29:36,690 selecciona estrela dos usuarios ONDE nome de usuario é igual a tal e tal 586 00:29:36,690 --> 00:29:38,510 eo contrasinal é igual a tal e tal. 587 00:29:38,510 --> 00:29:40,660 >> Teña en conta que o rizado claves usei aquí 588 00:29:40,660 --> 00:29:42,880 significa só para PHP, ir adiante e substituto 589 00:29:42,880 --> 00:29:45,400 o valor dos dous variables alí mesmo. 590 00:29:45,400 --> 00:29:50,090 Eles non son estrictamente necesarios, pero eles tenden a evitar erros de sintaxe sutís. 591 00:29:50,090 --> 00:29:53,650 Entón, iso parece completamente correcta a primeira vista. 592 00:29:53,650 --> 00:29:54,240 E é. 593 00:29:54,240 --> 00:29:56,680 Podería aplicar o sistema de patas deste xeito. 594 00:29:56,680 --> 00:30:00,460 >> Pero supoñamos que un super alumno intelixente e malicioso 595 00:30:00,460 --> 00:30:03,020 input este como o seu Pino. 596 00:30:03,020 --> 00:30:05,550 Entón eu elimina a bala sinais aquí no Mock-up, 597 00:30:05,550 --> 00:30:08,760 e realmente revelado o que el ou ela pode ser de dixitación. 598 00:30:08,760 --> 00:30:10,350 E é un pouco raro. 599 00:30:10,350 --> 00:30:13,850 Pero o que salta á vista na potencialmente preocupante sobre a entrada do usuario, 600 00:30:13,850 --> 00:30:16,450 mesmo se non ten idea do que un ataque de inxección SQL significa. 601 00:30:16,450 --> 00:30:20,300 Por que isto parece un pouco sospeitoso? 602 00:30:20,300 --> 00:30:21,050 ¿Que é iso? 603 00:30:21,050 --> 00:30:21,550 [Inaudível] 604 00:30:21,550 --> 00:30:24,260 DAVID Malan: A ou é algo sospeitoso. 605 00:30:24,260 --> 00:30:26,310 En realidade, iso é unha contrasinal de SQL. 606 00:30:26,310 --> 00:30:28,105 Entón, iso non augura nada bo. 607 00:30:28,105 --> 00:30:29,980 O feito de que hai todas esas comiñas simples 608 00:30:29,980 --> 00:30:32,646 há-- de feito, un dos máis fácil formas de romper algúns bancos de datos 609 00:30:32,646 --> 00:30:35,880 é escribindo un nome como O'Reilly que ten un apóstrofo nel 610 00:30:35,880 --> 00:30:38,600 porque se o ser humano que escribiu o código detrás das escenas 611 00:30:38,600 --> 00:30:41,570 non ten en conta que hai pode ser comiñas simples nun usuario de 612 00:30:41,570 --> 00:30:45,060 entrada, e el ou ela está a usar comiñas simples no seu código, 613 00:30:45,060 --> 00:30:46,040 cousas malas poden ocorrer. 614 00:30:46,040 --> 00:30:47,870 >> En realidade, peor aínda, considerar isto. 615 00:30:47,870 --> 00:30:50,600 Se esta foi unha vez máis o código que alguén o ano de Harvard 616 00:30:50,600 --> 00:30:53,100 atrás escribín á Pino sistema, teña en conta o que se 617 00:30:53,100 --> 00:30:56,220 a piques de ser substituído nome de usuario e contrasinal 618 00:30:56,220 --> 00:30:59,780 se o usuario inserir novo skroob como o seu nome de usuario 619 00:30:59,780 --> 00:31:03,960 e logo, un, dous, tres, catro, cinco, Cita ou entre comiñas un igual 620 00:31:03,960 --> 00:31:04,660 citar un. 621 00:31:04,660 --> 00:31:07,220 E teña en conta o que é fundamental aquí é o usuario non 622 00:31:07,220 --> 00:31:09,900 comezou o seu contrasinal ou Pino cunha cita. 623 00:31:09,900 --> 00:31:12,610 E non rematou cunha cita porque el ou ela 624 00:31:12,610 --> 00:31:16,315 é asumindo que o programador non era tan acentuada, 625 00:31:16,315 --> 00:31:18,690 van ter os comiñas simples no seu código. 626 00:31:18,690 --> 00:31:19,860 >> Entón, aquí está o código. 627 00:31:19,860 --> 00:31:23,820 E que a substitución agora pode ocorrer é iso. 628 00:31:23,820 --> 00:31:26,350 E eu teño subliñado que o usuario inseriu no. 629 00:31:26,350 --> 00:31:28,480 Entón, antes, despois. 630 00:31:28,480 --> 00:31:33,330 E teña en conta o que é lixeiramente preocupante agora sobre a metade dereita deste código SQL? 631 00:31:33,330 --> 00:31:36,300 É un pouco máis complexo, é certo, que as consultas que xa vimos. 632 00:31:36,300 --> 00:31:38,550 Pero iso non pode, posiblemente, ser bo se está 633 00:31:38,550 --> 00:31:42,240 dicindo seleccione estrela, que é seleccionar todo da mesa do usuario 634 00:31:42,240 --> 00:31:46,630 onde username é igual skroob e contrasinal é igual a un, dous, tres, catro, 635 00:31:46,630 --> 00:31:49,610 cinco ou un é igual a un. 636 00:31:49,610 --> 00:31:53,860 Cal é a implicación lóxica de que a última cláusula presuntamente? 637 00:31:53,860 --> 00:31:55,650 É só sempre é certo. 638 00:31:55,650 --> 00:31:59,930 >> E porque temos unha especie de adiviñar ou descubrir por intento e erro 639 00:31:59,930 --> 00:32:02,760 que o programador que escribiu este código non 640 00:32:02,760 --> 00:32:07,250 anticipar unha persoa humana ou malo escribindo entre comiñas simples, así como, 641 00:32:07,250 --> 00:32:10,350 podemos sintaticamente completar a consulta SQL 642 00:32:10,350 --> 00:32:12,260 con algo sen sentido pero algo que 643 00:32:12,260 --> 00:32:15,930 é sintaticamente incorrecto que sempre valora a verdade. 644 00:32:15,930 --> 00:32:19,130 Polo tanto, se este código está a ser usado para responder a cuestión verdadeira ou falsa debe 645 00:32:19,130 --> 00:32:22,930 este usuario permiso para pasar, o resposta é sempre ao parecer vai 646 00:32:22,930 --> 00:32:26,930 para ser verdade, porque iso sempre vai para seleccionar algo da base de datos 647 00:32:26,930 --> 00:32:29,280 porque un claro, sempre é igual a un. 648 00:32:29,280 --> 00:32:30,360 >> Entón, cal é a solución? 649 00:32:30,360 --> 00:32:33,290 Ben en PSet 7, nós realmente evitar todo isto xunto. 650 00:32:33,290 --> 00:32:37,360 Dámoslle unha función de consulta, e nós incentivos-lo a usar puntos de interrogación 651 00:32:37,360 --> 00:32:40,430 como marcadores de posición, semellante en espírito á de printf% s, 652 00:32:40,430 --> 00:32:43,710 pero o que é importante sobre os puntos de interrogación aquí é se realmente ler 653 00:32:43,710 --> 00:32:46,950 functions.php, onde a nosa función de consulta é aplicada, 654 00:32:46,950 --> 00:32:52,780 estes puntos de interrogación son escapou, en que nada potencialmente perigoso 655 00:32:52,780 --> 00:32:58,210 como unha única cita está conectado nunha única cita escapou. 656 00:32:58,210 --> 00:33:00,590 >> Entón, iso é o que é realmente está a suceder, se 657 00:33:00,590 --> 00:33:04,850 usar a función de consulta do CS50 ou calquera número de terceiros bibliotecas libres que 658 00:33:04,850 --> 00:33:06,000 facer o mesmo. 659 00:33:06,000 --> 00:33:09,850 Non importa, neste caso, en verde, se o usuario ten ingresaran nunha única cita 660 00:33:09,850 --> 00:33:12,070 porque a consulta función que escribimos é 661 00:33:12,070 --> 00:33:15,120 indo para engadir barras invertidas antes calquera cita tan perigosa. 662 00:33:15,120 --> 00:33:17,360 Polo tanto, este non é, de realidade, vai ser legal. 663 00:33:17,360 --> 00:33:20,910 Isto é como escribir un tolo buscando contrasinal que é, por suposto, non vai 664 00:33:20,910 --> 00:33:23,490 ser real contrasinal da skroob. 665 00:33:23,490 --> 00:33:28,260 >> Así, o takeaway para CS50 é un, absolutamente usar algo 666 00:33:28,260 --> 00:33:30,860 como función de consulta do CS50 ou a biblioteca subxacente, 667 00:33:30,860 --> 00:33:32,560 que pasa a ser chamado de PDO. 668 00:33:32,560 --> 00:33:35,880 Pero nunca, nunca, nunca facer un código coma este 669 00:33:35,880 --> 00:33:39,472 sen escapar ou esfregar como din os seus insumos. 670 00:33:39,472 --> 00:33:42,430 E ti, nalgún momento, probablemente, se atopou con algúns sitio coma este. 671 00:33:42,430 --> 00:33:46,060 De feito, parece ser o caso como en aeroportos e hoteis en lugares 672 00:33:46,060 --> 00:33:48,880 onde teñen acceso Wi-Fi acceso que ten que acceder para, 673 00:33:48,880 --> 00:33:51,010 estes sitios son sempre horriblemente aplicadas. 674 00:33:51,010 --> 00:33:55,680 E así, unha especie de desfrute na casa exercicio, non con fins maliciosos ou máis 675 00:33:55,680 --> 00:33:59,170 dun desfrute vial exercicio, é só escribir 676 00:33:59,170 --> 00:34:02,850 un apóstrofo, comiñas simples, nun formulario nalgún sitio 677 00:34:02,850 --> 00:34:03,810 e ver que pasa. 678 00:34:03,810 --> 00:34:06,660 E se o servidor traba ou dá vostede algún tipo de mensaxe de erro, 679 00:34:06,660 --> 00:34:09,690 pode moi ben ser que alguén non teña previsto iso. 680 00:34:09,690 --> 00:34:15,239 E entón ten que alertar o bo autoridades e ir adiante. 681 00:34:15,239 --> 00:34:20,843 >> Entón agora vostedes deben espero entender un pouco máis humor do geek aquí. 682 00:34:20,843 --> 00:34:24,120 >> [Risas] 683 00:34:24,120 --> 00:34:27,571 684 00:34:27,571 --> 00:34:29,070 DAVID Malan: Vostede sabe que é un geek. 685 00:34:29,070 --> 00:34:30,944 Á seguinte varios anos, vai lembrar 686 00:34:30,944 --> 00:34:33,520 mesiñas que Bobby é por mor deste deseño animado aquí. 687 00:34:33,520 --> 00:34:36,760 Polo tanto, manter isto presente ao cambio de contexto unha última vez 688 00:34:36,760 --> 00:34:38,770 hoxe para JavaScript. 689 00:34:38,770 --> 00:34:41,600 Pasamos relativamente pouco tempo sobre a sintaxe do PHP 690 00:34:41,600 --> 00:34:43,440 porque é realmente Super semellante a C. 691 00:34:43,440 --> 00:34:47,300 E ben o suficiente, JavaScript tamén é super semellante á sintaxe do C 692 00:34:47,300 --> 00:34:49,639 así como veremos na só un momento e como nós imos 693 00:34:49,639 --> 00:34:51,205 vexa a finais desta semana, en particular. 694 00:34:51,205 --> 00:34:54,080 O que podes facer con esta linguaxe, con todo, é aínda máis poderosa, 695 00:34:54,080 --> 00:34:55,790 especialmente con APIs. 696 00:34:55,790 --> 00:34:56,960 >> Pero, primeiro, un rápido paseo. 697 00:34:56,960 --> 00:35:00,450 Entón, un, en JavaScript, non hai ningunha función principal, que é bo. 698 00:35:00,450 --> 00:35:02,650 Igual que PHP, pode só escribir código. 699 00:35:02,650 --> 00:35:04,310 Condicións coma este. 700 00:35:04,310 --> 00:35:07,100 E expresións booleanas pode coma este ou coma este. 701 00:35:07,100 --> 00:35:09,530 Existen interruptores, e pode ter esta aparencia. 702 00:35:09,530 --> 00:35:10,970 Catro voltas coma este. 703 00:35:10,970 --> 00:35:12,390 Mentres lazos coma este. 704 00:35:12,390 --> 00:35:14,160 Fai while coma este. 705 00:35:14,160 --> 00:35:16,850 E entón matrices parecido tanto, moi semellante ao PHP. 706 00:35:16,850 --> 00:35:20,740 Pero teña en conta, que en JavaScript ten declarar unha variable non cun dólar 707 00:35:20,740 --> 00:35:25,190 asinar, non cun tipo de datos, pero, literalmente, dicindo var á variable antes. 708 00:35:25,190 --> 00:35:27,900 Tamén é vagamente ingresaran na medida en que ten tipos, 709 00:35:27,900 --> 00:35:29,729 pero non declaralo los explicitamente. 710 00:35:29,729 --> 00:35:31,520 E entón unha corda, a exemplo, pode parecer 711 00:35:31,520 --> 00:35:34,350 así, esta cadea sendo chamado s neste caso. 712 00:35:34,350 --> 00:35:35,410 E logo un obxecto. 713 00:35:35,410 --> 00:35:37,010 E estes, imos ver máis en pouco tempo. 714 00:35:37,010 --> 00:35:41,470 E un obxecto é quizais un dos máis comunmente visto estruturas de datos 715 00:35:41,470 --> 00:35:44,050 baseada nun JavaScript programa porque permite 716 00:35:44,050 --> 00:35:46,680 asociar arbitraria pares de chaves de valor só 717 00:35:46,680 --> 00:35:51,240 como matrices asociativas de PHP e, así como a súa propia táboa hash 718 00:35:51,240 --> 00:35:54,042 ou tentar, Implementar unhas semanas atrás. 719 00:35:54,042 --> 00:35:56,250 Entón, imos ver o que realmente podemos facer con JavaScript. 720 00:35:56,250 --> 00:35:59,410 E, en particular, esta é un rol de características 721 00:35:59,410 --> 00:36:02,300 que os navegadores teñen que nos permiten conectar JavaScript 722 00:36:02,300 --> 00:36:05,470 nunha web do seguinte xeito. 723 00:36:05,470 --> 00:36:09,340 JavaScript é frecuentemente utilizado como un lado do cliente linguaxe de script. 724 00:36:09,340 --> 00:36:10,130 Non está feita. 725 00:36:10,130 --> 00:36:11,370 Tamén é interpretada. 726 00:36:11,370 --> 00:36:15,740 Pero a diferenza de PHP, que foi executado no servidor, o servidor web, 727 00:36:15,740 --> 00:36:18,220 ou no fondo do clientes, JavaScript 728 00:36:18,220 --> 00:36:22,190 é diferente na medida en que el xeralmente é executado no navegador. 729 00:36:22,190 --> 00:36:26,060 >> Así, calquera código JavaScript que comezar a escribir para PSet 8, ou o seu proxecto final, 730 00:36:26,060 --> 00:36:29,890 ou no mundo real vai xeralmente para ser gardado no servidor, absolutamente 731 00:36:29,890 --> 00:36:33,110 nun punto ou un punto de HTML JS ao arquivo JavaScript. 732 00:36:33,110 --> 00:36:35,770 Pero o navegador vai descargar que Javascript 733 00:36:35,770 --> 00:36:39,530 código a súa propia instancia de Chrome, ou IE, ou Firefox, ou o que quere. 734 00:36:39,530 --> 00:36:43,870 E o código é realmente comezará executado dentro do seu propio navegador. 735 00:36:43,870 --> 00:36:46,560 Só para facer isto máis real, imos ver iso de forma concreta. 736 00:36:46,560 --> 00:36:50,120 >> Nós non temos idea do que este código fai sen realmente ler a través dela. 737 00:36:50,120 --> 00:36:52,670 Pero déixeme ir Facebook.com sen iniciar sesión. 738 00:36:52,670 --> 00:37:00,440 Déixeme ir Inspect Element e ir, digamos, Rede e volva a páxina. 739 00:37:00,440 --> 00:37:04,150 E nós imos see-- déixeme cambiar Recargar o Páxina para obter todas as peticións para o novo. 740 00:37:04,150 --> 00:37:08,850 E o primeiro ficheiro que eu vexo é CSS, CSS. 741 00:37:08,850 --> 00:37:10,880 Aquí está a primeira JavaScript ficheiro, e eu teño 742 00:37:10,880 --> 00:37:14,600 ningunha idea do que isto significa, pero aquí é parte do código JavaScript 743 00:37:14,600 --> 00:37:16,180 que impulsa Facebook. 744 00:37:16,180 --> 00:37:18,400 Non o é certo que revelando para ampliar. 745 00:37:18,400 --> 00:37:20,260 El aínda é tan sen sentido. 746 00:37:20,260 --> 00:37:24,341 >> Pero vai ver, mesmo en baixo, hai aínda máis deses arquivos JavaScript. 747 00:37:24,341 --> 00:37:24,840 Whoops. 748 00:37:24,840 --> 00:37:25,440 Isto é un ping. 749 00:37:25,440 --> 00:37:28,550 Imos descender un pouco aínda máis, aínda máis, aínda máis. 750 00:37:28,550 --> 00:37:29,894 Hai un. 751 00:37:29,894 --> 00:37:31,238 Hai un. 752 00:37:31,238 --> 00:37:31,880 Hai un. 753 00:37:31,880 --> 00:37:35,820 >> Así, aínda que o Facebook, por tras da escenas, está escrito en parte en PHP 754 00:37:35,820 --> 00:37:39,100 e versión propia do mesmo de Facebook, hai unha enorme cantidade de JavaScript. 755 00:37:39,100 --> 00:37:41,330 En realidade, calquera dos falando que fai no Facebook, 756 00:37:41,330 --> 00:37:45,520 calquera das actualizacións en liña programa que ocorrer en tempo real, de que todos 757 00:37:45,520 --> 00:37:47,944 é conducido mediante JavaScript. 758 00:37:47,944 --> 00:37:48,444 Si? 759 00:37:48,444 --> 00:37:50,235 >> Audiencia: Non estou seguro se este é o Facebook, 760 00:37:50,235 --> 00:37:53,624 pero eu penso que Facebook desenvolveu súa propia lingua código in-house? 761 00:37:53,624 --> 00:37:54,540 DAVID Malan: Eles fixeron. 762 00:37:54,540 --> 00:37:58,110 Entón é por iso que eu digo unha variación de PHP chamado Hip Hop que realmente 763 00:37:58,110 --> 00:38:03,440 recursos adicionais para tal que cando Mark aplicado por primeira vez o Facebook, 764 00:38:03,440 --> 00:38:04,710 estaba escrito en PHP. 765 00:38:04,710 --> 00:38:07,370 E este tipo de tense mantido o tipo de linguaxe front-end 766 00:38:07,370 --> 00:38:09,030 que empregan para moito da súa codificación, pero iso 767 00:38:09,030 --> 00:38:11,870 non foi unha linguaxe que é escalas particularmente ben a millóns 768 00:38:11,870 --> 00:38:12,630 de persoas. 769 00:38:12,630 --> 00:38:15,300 E así eles foron engadidos á súa propia melloras nos bastidores. 770 00:38:15,300 --> 00:38:17,049 E empregan calquera número doutras linguas 771 00:38:17,049 --> 00:38:19,170 para varias pezas de súa infraestrutura. 772 00:38:19,170 --> 00:38:24,080 Entón, si, é unha variación de o que hoxe coñecemos como PHP. 773 00:38:24,080 --> 00:38:26,610 >> Entón, imos dar un ollo nun par de exemplos 774 00:38:26,610 --> 00:38:28,890 de como podemos usar JavaScript aquí. 775 00:38:28,890 --> 00:38:32,530 O código fonte de hoxe, temos un grupo de ficheiros, o primeiro dos cales, 776 00:38:32,530 --> 00:38:34,090 imos chamado DON cero. 777 00:38:34,090 --> 00:38:36,770 Entón DOM de cero ten a seguinte aparencia. 778 00:38:36,770 --> 00:38:40,730 Deixe-me ir a este directorio e abrir domzero.html, 779 00:38:40,730 --> 00:38:44,970 o cumio do cal ten un tipo de documento declaración, dicindo que aquí vén HTML 5. 780 00:38:44,970 --> 00:38:46,440 E agora aquí está unha etiqueta HTML. 781 00:38:46,440 --> 00:38:47,540 Aquí está a etiqueta cabeza. 782 00:38:47,540 --> 00:38:49,210 E aquí está o que hai de novo hoxe. 783 00:38:49,210 --> 00:38:52,620 >> Agora temos unha etiqueta script dentro da cabeza da páxina. 784 00:38:52,620 --> 00:38:55,290 E iso ao parecer fai moi pouco, pero aviso 785 00:38:55,290 --> 00:38:58,410 que teña definido un guión, un JavaScript. 786 00:38:58,410 --> 00:39:01,050 E como un aparte, xa que este É un equívoco común, 787 00:39:01,050 --> 00:39:05,220 JavaScript non ten absolutamente nada a ver con Java, a linguaxe 788 00:39:05,220 --> 00:39:08,010 que algúns de vostedes poden aprenderon na APCS. 789 00:39:08,010 --> 00:39:10,480 Era máis un marketing cousa que calquera cousa, 790 00:39:10,480 --> 00:39:12,980 montando os coattails de anos Java. 791 00:39:12,980 --> 00:39:17,300 Pero JavaScript, nada que ver co Java, só de forma semellante, e irritante, 792 00:39:17,300 --> 00:39:18,480 confusamente chamado. 793 00:39:18,480 --> 00:39:21,890 >> Entón aquí está como declarar unha función en JavaScript, literalmente función dicir, 794 00:39:21,890 --> 00:39:24,556 logo o nome da función, entón calquera argumentos que podería tomar, 795 00:39:24,556 --> 00:39:25,530 así como en PHP. 796 00:39:25,530 --> 00:39:28,990 Acontece que en JavaScript, un dos máis funcións irritantes que existen é de alerta. 797 00:39:28,990 --> 00:39:31,392 Esta é unha pequena fiestra que aparecerá e alerta-lo 798 00:39:31,392 --> 00:39:32,600 a algún anaco de información. 799 00:39:32,600 --> 00:39:33,766 É xeralmente desaprovado. 800 00:39:33,766 --> 00:39:35,980 Pero nós imos usalo como o noso primeiro exercicio aquí. 801 00:39:35,980 --> 00:39:37,900 >> Teña en conta algunhas características do JavaScript. 802 00:39:37,900 --> 00:39:41,524 As comiñas simples e comiñas dobres Realmente non importa máis. 803 00:39:41,524 --> 00:39:43,690 Aspas simples e dobres citas poden ser trocados, 804 00:39:43,690 --> 00:39:46,220 mentres que en C, tes que usar comiñas para cordas, 805 00:39:46,220 --> 00:39:48,150 e ten dúas de solteiro cita para chars. 806 00:39:48,150 --> 00:39:51,150 No mundo JavaScript, moitas persoas, a maioría da xente 807 00:39:51,150 --> 00:39:54,970 usar comiñas simples arredor de cordas só porque é unha cousa estilística. 808 00:39:54,970 --> 00:39:58,330 Pero o que é o operador máis aquí, que nós non vimos antes? 809 00:39:58,330 --> 00:39:59,836 >> Audiencia: concatenação. 810 00:39:59,836 --> 00:40:00,960 DAVID Malan: concatenação. 811 00:40:00,960 --> 00:40:02,450 Entón C non ten sequera iso. 812 00:40:02,450 --> 00:40:04,820 PHP ten o operador punto, que fai iso. 813 00:40:04,820 --> 00:40:09,710 JavaScript ten o operador de suma, que confusión é como Java. 814 00:40:09,710 --> 00:40:11,440 Agora, o que está pasando aquí? 815 00:40:11,440 --> 00:40:14,260 >> Entón, aquí é onde a base comprensión de que a imaxe 816 00:40:14,260 --> 00:40:17,010 xogamos un par días entra en xogo. 817 00:40:17,010 --> 00:40:19,620 Teña en conta que, cando tivemos unha simple versión dun HTML página-- 818 00:40:19,620 --> 00:40:20,830 el só dixo: Ola mundo. 819 00:40:20,830 --> 00:40:22,770 E, entón, deseñou unha árbore á dereita, o que 820 00:40:22,770 --> 00:40:27,320 tiña unha morea de rectángulos e liñas conectando os como unha árbore xenealóxica. 821 00:40:27,320 --> 00:40:30,820 Entón esta é a chamada DOM ou Document Object Model. 822 00:40:30,820 --> 00:40:36,759 E verifícase que podes acceder rectángulos en que árbore con sintaxe 823 00:40:36,759 --> 00:40:37,550 como a seguinte. 824 00:40:37,550 --> 00:40:41,370 Vostede literalmente dicir documento, que é unha variable global especial nun JavaScript 825 00:40:41,370 --> 00:40:45,890 programa que ten unha función asociado a el que pode acceder 826 00:40:45,890 --> 00:40:50,280 semellante a un struct, pero simplemente dicir punto e, a continuación, o nome da función, 827 00:40:50,280 --> 00:40:52,390 obter elemento de identificación. 828 00:40:52,390 --> 00:40:55,460 >> O elemento que quero chegar é aparentemente citar nome unquote. 829 00:40:55,460 --> 00:40:57,150 E entón eu quero comezar o seu valor. 830 00:40:57,150 --> 00:40:58,330 Agora estamos quedando por diante de nós mesmos. 831 00:40:58,330 --> 00:41:00,038 Eu nin estou seguro do que todo isto é sobre. 832 00:41:00,038 --> 00:41:03,000 Imos avanzar rapidamente para o HTML en da páxina, que é super sinxelo. 833 00:41:03,000 --> 00:41:05,370 >> Teña en conta que eu define Unha forma aquí debaixo. 834 00:41:05,370 --> 00:41:07,940 Repare que eu dei-lle un único ID, aínda que non usei 835 00:41:07,940 --> 00:41:08,870 este atributo antes. 836 00:41:08,870 --> 00:41:11,300 Pero iso existe en HTML. 837 00:41:11,300 --> 00:41:15,570 Pode identificar exclusivamente algún anaco HTML cun identificador coma este. 838 00:41:15,570 --> 00:41:19,880 >> Observe agora isto-- Acontece HTML apoia, por que rol 839 00:41:19,880 --> 00:41:22,490 hai pouco, un todo banda de manipuladores de eventos. 840 00:41:22,490 --> 00:41:25,060 E ese manipulador de eventos di en enviar. 841 00:41:25,060 --> 00:41:28,730 Sobre a presentación usuario deste formulario, chame o seguinte código. 842 00:41:28,730 --> 00:41:31,360 E o código que está pasando a chamarse ou executado 843 00:41:31,360 --> 00:41:35,260 é exactamente iso, o grego función seguido de retorno falso. 844 00:41:35,260 --> 00:41:37,360 Todo o resto debe ser moi familiar. 845 00:41:37,360 --> 00:41:42,050 >> Aquí é unha entrada do tipo texto, cuxa ID neste caso será nome. 846 00:41:42,050 --> 00:41:45,430 Nós non temos un certo atributo de nome este tempo-- e un botón de envío. 847 00:41:45,430 --> 00:41:48,330 Así, a páxina resultante se parece con isto. 848 00:41:48,330 --> 00:41:52,890 E o comportamento resultante, vai ver, si parece con isto. 849 00:41:52,890 --> 00:41:56,940 A páxina aloxa locais di, Ola David, dificilmente un esteticamente agradable 850 00:41:56,940 --> 00:41:58,340 forma de cumprimento dun usuario. 851 00:41:58,340 --> 00:41:59,950 Pero o que está realmente a suceder? 852 00:41:59,950 --> 00:42:01,360 >> Ben, considerada o que é iso. 853 00:42:01,360 --> 00:42:02,310 Este é un campo de texto. 854 00:42:02,310 --> 00:42:04,635 E segundo a HTML aquí, eu dei-lle 855 00:42:04,635 --> 00:42:07,350 un identificador único chamado Cita nome unquote. 856 00:42:07,350 --> 00:42:09,770 Mentres tanto, eu dixen cando o usuario envía o formulario 857 00:42:09,770 --> 00:42:13,820 por premer Intro ou facer clic no Subir botón, chamar a función chamada Greet 858 00:42:13,820 --> 00:42:15,410 e despois voltar False. 859 00:42:15,410 --> 00:42:16,870 Imos considerar aqueles en sentido inverso. 860 00:42:16,870 --> 00:42:20,590 Teña en conta que cando eu premer en Enviar, o URL da páxina non cambia. 861 00:42:20,590 --> 00:42:22,420 A icona do navegador non comezar a xirar. 862 00:42:22,420 --> 00:42:27,050 Non ir a calquera lugar, e iso é literalmente, porque eu dixen que volver False. 863 00:42:27,050 --> 00:42:31,534 Retorno curtocircuítos falsa ou paradas o comportamento estándar dun formulario. 864 00:42:31,534 --> 00:42:33,700 De xeito que, a continuación, déixanos con esta unha pregunta final. 865 00:42:33,700 --> 00:42:34,764 Que Greet facer? 866 00:42:34,764 --> 00:42:36,680 Ben, aparentemente Cumprimente chama unha función chamada 867 00:42:36,680 --> 00:42:39,250 Aviso, pasa nunha longo argumento de que é 868 00:42:39,250 --> 00:42:43,950 o resultado da concatenação xuntos un banda de substrings, Ola espazo coma, 869 00:42:43,950 --> 00:42:45,810 entón o que quere que isto volve. 870 00:42:45,810 --> 00:42:51,490 Entón documento é como un mundial variable para esta raíz desa árbore, 871 00:42:51,490 --> 00:42:55,560 chamar unha función especial, se non, agora coñecido como un método. 872 00:42:55,560 --> 00:42:57,650 Unha función que é dentro dunha variable é 873 00:42:57,650 --> 00:42:59,640 chamado un método no canto dunha función. 874 00:42:59,640 --> 00:43:01,570 >> Polo tanto, obter elemento por ID. 875 00:43:01,570 --> 00:43:03,940 Que elemento ten quero comezar polo seu ID? 876 00:43:03,940 --> 00:43:06,970 Citar nome unquote e logo especificamente valorar. 877 00:43:06,970 --> 00:43:12,000 Así, noutras palabras, que o código simplemente atopa o campo de texto cuxo ID é o nome 878 00:43:12,000 --> 00:43:13,380 e despois recibe o seu valor. 879 00:43:13,380 --> 00:43:16,460 Entón, se eu fose para cambiar esta e dicir Davin en lugar de David, 880 00:43:16,460 --> 00:43:20,670 e prema en Enviar, agora nós ten un saúdo para Davin. 881 00:43:20,670 --> 00:43:22,890 >> Todo ben, entón todo ben e bo. 882 00:43:22,890 --> 00:43:25,480 Pero imos ver se podemos facer esta un pouco máis limpo desde só 883 00:43:25,480 --> 00:43:28,190 código escrito, como este é xeralmente será desaprovada. 884 00:43:28,190 --> 00:43:30,060 Isto vai ollar máis asustado. 885 00:43:30,060 --> 00:43:32,330 Pero o que é o primeiro diferenza que nota aquí 886 00:43:32,330 --> 00:43:35,970 nesta versión, ademais do nomear cambiando para DON un? 887 00:43:35,970 --> 00:43:41,110 O que parece diferente estruturalmente sobre iso contra o outro? 888 00:43:41,110 --> 00:43:41,932 Si? 889 00:43:41,932 --> 00:43:43,890 Audiencia: É a forma de parte superior do guión agora? 890 00:43:43,890 --> 00:43:46,570 DAVID Malan: Si, o formulario está na parte superior do guión, por algún motivo curioso. 891 00:43:46,570 --> 00:43:48,736 Entón esta é a primeira cousa que salta para fóra de min, tamén. 892 00:43:48,736 --> 00:43:50,990 E, por sorte, polo menos, esta parte é idéntica. 893 00:43:50,990 --> 00:43:53,470 Entón, o único que parece para ser diferente é esta. 894 00:43:53,470 --> 00:43:55,296 >> Entón aquí está o que é puro sobre JavaScript 2. 895 00:43:55,296 --> 00:43:57,420 E iso fai que sexa difícil de entender a primeira vista, 896 00:43:57,420 --> 00:44:00,670 especialmente para proxectos finais, se está mirando para o código de exemplo en liña, 897 00:44:00,670 --> 00:44:04,200 pero todo se reduce a un características sintácticas básicas. 898 00:44:04,200 --> 00:44:06,230 Aquí, de novo, é de que documento variable global. 899 00:44:06,230 --> 00:44:09,540 Aquí, de novo, é que o método ou función que di obter o elemento por ID. 900 00:44:09,540 --> 00:44:11,570 Esta vez quero obter o ID de chamada de demostración. 901 00:44:11,570 --> 00:44:12,490 Onde queda iso? 902 00:44:12,490 --> 00:44:15,400 Isto é aparentemente seguro aquí, o propio formulario. 903 00:44:15,400 --> 00:44:20,010 >> E agora conta que, ao parecer, se eu recibir de volta ese nó da árbore que 904 00:44:20,010 --> 00:44:22,940 representa o xeito en si, non é un campo de texto, 905 00:44:22,940 --> 00:44:26,970 verifícase que forma, que nó ou rectángulo da árbore, 906 00:44:26,970 --> 00:44:30,450 ten o que chamaremos dunha propiedade, moi, moi, moi semellante 907 00:44:30,450 --> 00:44:35,390 en espírito a un struct en C. É só membro de datos dentro deste rectángulo. 908 00:44:35,390 --> 00:44:38,300 >> Entón eu teño o xeito aquí, e eu estou anexando, 909 00:44:38,300 --> 00:44:44,650 ou eu estou atribuíndo, a súa en Enviar manipulador ou mellor, en Enviar propiedade 910 00:44:44,650 --> 00:44:45,740 a seguinte función. 911 00:44:45,740 --> 00:44:49,000 E este é, de lonxe, o máis tolo cousa, ata agora, sintaticamente. 912 00:44:49,000 --> 00:44:53,610 Acontece en JavaScript e en PHP e, sinceramente, para que o asunto en C, 913 00:44:53,610 --> 00:44:58,990 aínda que non faga iso, pode engadir sen nome, anónimo, ou aka lambda 914 00:44:58,990 --> 00:45:03,000 funcións que non teñen un nome pero pode ser chamado aínda así. 915 00:45:03,000 --> 00:45:07,050 >> Entón o que eu estou facendo aquí é que eu estou atribuíndo Por esta Enviar propiedade, que 916 00:45:07,050 --> 00:45:14,330 É dentro deste nodo miña árbore DOM, un función, a función de punteiro se quere. 917 00:45:14,330 --> 00:45:16,310 Esta función non ten nome, pero que non fai 918 00:45:16,310 --> 00:45:19,110 importa, porque imos ver nun momento como chamalo. 919 00:45:19,110 --> 00:45:21,780 Cando esta función é chamada, este código é executado, entón 920 00:45:21,780 --> 00:45:24,210 false é retornado como antes. 921 00:45:24,210 --> 00:45:25,800 >> Pero teña en conta o que eu fixen. 922 00:45:25,800 --> 00:45:27,830 Neste punto o historia, eu teño un formulario. 923 00:45:27,830 --> 00:45:30,190 Ten unha identificación única chamada de demostración. 924 00:45:30,190 --> 00:45:33,740 Aquí abaixo, eu teño unha etiqueta script que executa o código a continuación. 925 00:45:33,740 --> 00:45:37,720 El atribúe a este nodo a árbore é en Enviar 926 00:45:37,720 --> 00:45:40,260 propiedade esta función aquí. 927 00:45:40,260 --> 00:45:44,310 E, así, por natureza, de como os navegadores funcionan, cando clic agora Enviar ou prema Intro, 928 00:45:44,310 --> 00:45:45,889 que a función será pagado. 929 00:45:45,889 --> 00:45:48,680 Ela non precisa dun nome, porque quen diaños lle importa o que se chama. 930 00:45:48,680 --> 00:45:52,540 A única vez que nunca vai chegar chamado é cando enviar o formulario. 931 00:45:52,540 --> 00:45:55,130 Non hai ningunha necesidade para min, o creador humana, 932 00:45:55,130 --> 00:45:57,330 realmente chamalo en calquera outro lugar. 933 00:45:57,330 --> 00:46:00,720 >> Agora só como unha provocación, como se iso non foron ocupar dobrar o suficiente, 934 00:46:00,720 --> 00:46:03,330 podemos incluso facelo mirar con máis enigmática 935 00:46:03,330 --> 00:46:05,850 unha biblioteca super popular chamado jQuery. 936 00:46:05,850 --> 00:46:08,760 De feito jQuery e JavaScript son moitas veces confundidos. 937 00:46:08,760 --> 00:46:12,790 E o que imos facer o mércores é inicio empregando esta linguaxe e esas bibliotecas 938 00:46:12,790 --> 00:46:16,030 para construír cada vez máis asíncrono e aplicacións dinámicas 939 00:46:16,030 --> 00:46:18,950 como mapa recibindo aplicacións, aplicacións 940 00:46:18,950 --> 00:46:22,360 que actualizar a páxina web en tempo real tempo, moi parecido ao Facebook ou Gchat 941 00:46:22,360 --> 00:46:27,130 facer, e non nos limitar a que bate Enviar por un get ou só post 942 00:46:27,130 --> 00:46:27,630 só. 943 00:46:27,630 --> 00:46:29,055 Entón eu vou te ver o mércores. 944 00:46:29,055 --> 00:46:31,805 945 00:46:31,805 --> 00:46:35,550 >> [Música tocando] 946 00:46:35,550 --> 00:48:09,728