[Powered by Google Translate] [Semana 7, continuación]
[David J. Malan, Harvard University]
[Esta es CS50.] [CS50.TV]
Está bien. Welcome Back. Esto es CS50,
y este es el fin de semana 7.
Así que una de estas pequeñas cosas estúpidas que va alrededor de la Internet
y sorbió, y ahora debe hacer un poco de sentido geeky para ti.
Bueno, era más divertido con este tipo de lo que era para ustedes.
Hablando de eso, bien, chicos,
hoy es el cumpleaños de Nate.
Para que te hagas una idea de lo bien que Nate y yo somos
en el desarrollo web basada en la clase del lunes y se basa ahora en esto,
Pensé que tire hacia arriba la página de Nate casa, si usted no lo ha visto todavía.
Esto aquí ia Nate HTML.
Así que ver a su código fuente si quieres ver cómo se hace esto, y Nate,
si pudiera avergonzar a sólo brevemente, el personal que tienes un poco de algo
si te gustaría compartir un postre con algunos de los chicos de la clase aquí.
Si a usted le gustaría venir para abajo.
Todos ustedes aplauden y están muy bien, pero no hay nadie sentado en cualquier lugar cerca de Nate,
por alguna razón, en esa zona de nuevo.
Así que tal vez usted puede encontrar algunas personas a disfrutar de estos con.
Happy Birthday, Nate.
>> Holas adicionales: Mostramos un par de clips de nuestros estudiantes CS50x.
Si a usted le gustaría ver quién más está en el mundo
que está siguiendo, usted puede dirigirse a la siguiente dirección URL,
donde José, uno de nuestros TFS, ha creado un montaje de tipo
de todos los que han venido presentando estos videos, entre ellos Rick Astley.
Y si se desplaza a través de estos, es realmente muy inspirador
ver la diversidad de países y ciudades desde donde la gente está de llamada.
Así que si quieres echar un vistazo a eso, que será de hasta hasta el final del semestre.
Hoy continuamos nuestra mirada en la web, programación web, HTML y similares,
y también almorzar venir este viernes
si lo desea, y sobre todo, no lo han hecho antes.
El tema de este viernes será el cumpleaños de Nate,
así que si usted quisiera tener almuerzo de cumpleaños con Nate
y otros, algunos de nuestros amigos de la industria,
por favor diríjase a la dirección allí.
El espacio, como siempre, es limitada. También, si lo has olvidado,
darse cuenta de que la próxima semana se cumple el plazo para el problema de conjunto 4 de búsqueda del tesoro,
por lo que tras recuperar todos esos archivos JPEG de card.raw,
usted y sus compañeros de sección, si lo desea, puede intentar fotografiar
como muchos de los científicos de la computación de que la tarjeta de memoria como sea posible,
y usted y su sección a continuación, va a ganar un fabuloso premio.
Refiérase a la especificación del conjunto de procesadores 4 en cuanto a qué presentar y cuándo.
También, si usted desea tener su obra inmortalizada
en la página web de la asignatura y su historia de la ropa,
Sabemos que eres bienvenido para empezar a presentar diseños
Para este año las camisetas y sudaderas y similares.
Haremos nuestro mejor esfuerzo para incluir a todos los que podamos,
pero vamos a tener algunos miembros del personal de revisión de todos los diseños
para asegurarse de que son compatibles con las especificaciones,
y luego elige generalmente un puñado de ellas para ser expuestas.
Así que si usted es el tipo de construcción, sólo sé que los requisitos
para los gráficos PNG son, por lo menos 200 DPI,
no debe ser más de 4000 x 4000 pixeles,
y no más de 10 MB, pero le invitamos a usar cosas como
Photoshop o GIMP o varios programas de diseño gráfico, de
lo que tengas a tu disposición.
>> También en el horizonte es el proyecto final. El proyecto final es realmente la culminación de 50 años,
por lo cual todas las tareas en curso,
es tu oportunidad de realmente hacer su propia cosa.
Y eso puede ser simplemente para hacer algo para la diversión,
que puede ser para resolver un problema acuciante su grupo de alumnos tiene,
por alguna nueva página web, un mecanismo para la nueva colección de datos.
Puede ser una aplicación móvil para Android, para iOS.
Realmente, el cielo es el límite, y, a lo largo de las próximas semanas
mientras hacemos la transición de C a idiomas de alto nivel como PHP y JavaScript,
usted se encontrará cada vez más familiarizados con algunas técnicas del mundo real,
algunas herramientas del mundo real, y como complemento a que,
Sabemos que el curso tiene una historia de seminarios,
por lo que en las semanas siguientes, algunos miembros del personal docente
y amigos nuestros desde el campus ofrecerá seminarios optativos
que van más allá de lo que normalmente se hace en la sección
para presentarle a cosas como la programación Android,
para presentarle a cosas como iOS programación
o más avanzadas técnicas de desarrollo Web.
Hay toda una historia de estas ya en línea.
Si usted va a cs50.net/seminars, hemos estado haciendo esto desde hace algunos años,
y verás que archivan aquí con archivos PDF y videos y similares
son videos de varias docenas de seminarios.
El año pasado, por ejemplo, tuvimos un seminario sobre sobresalir en sus entrevistas técnicas,
si en realidad estás mirando para salir y hacer una pasantía o actuación a tiempo completo.
Desarrollo de Windows Mobile, Android desarrollo, Google Maps,
API, CSS, desarrollando para el BlackBerry, Emacs.
De verdad, te invitamos a echar un vistazo a cualquiera de estos seminarios a su conveniencia.
Y vamos a celebrar unas nuevas este semestre, también.
>> Entonces, ¿qué es continuar con el proyecto final?
Bueno, en primer lugar, a pesar de que esta fecha es algo inminente,
esto es sólo una oportunidad para empezar a pensar en el proyecto final bastante realista.
Sabemos sólo el comienzo de algo de lo que todavía va a estar cubriendo en el curso,
HTML, PHP y similares, pero todos estamos familiarizados con la Web,
y el sesgo de esta conversación hacia la Web sólo porque
la mayoría de la gente termina haciendo basados ​​en la web los proyectos finales,
pero que no es en absoluto necesaria.
Uso de C está bien, el objetivo de C, Java,
cualquier otro idioma que sepa o quiera saber es muy fina.
Sin embargo, para sacarle jugo al principio, vamos a esperar la presentación de una propuesta preliminar
que, por el formato PDF en el sitio web, que ahora está en cs50.net,
y en la parte superior izquierda verás proyecto final
es la especificación para el proyecto final,
y en que hay detalles sobre la propuesta preliminar y similares.
Todo se reduce más o menos abajo a un correo electrónico a su compañero de enseñanza
simplemente entablar una conversación con él o ella acerca de lo que estás pensando.
En projects.cs50.net es un repositorio de ideas de la gente en el campus
si usted está luchando para llegar a una idea,
y manual.cs50.net/APIs es un repositorio de enlaces a las API.
>> ¿Cuál es, sin embargo, es un API?
¿Qué es un API? Lo he dicho por lo menos dos veces,
de acuerdo con las transcripciones de las últimas semanas.
¿Qué es eso? [Estudiante, ininteligible]
>> Bien, bien. Así que algo interfaz de programación.
Interfaz de programación de aplicaciones, y esto puede tomar varias formas,
pero lo que esto se reduce realmente reduce a código
que alguien hs escrito o datos de que alguien más ha recogido
que se pone a disposición de alguna manera programática.
Se puede escribir código en C, PHP, Python, Ruby,
cualquiera que sea el idioma de su elección normalmente es,
y de alguna manera se puede aprovechar la funcionalidad de otra persona
o algún otro conjunto de datos.
Por ejemplo, si voy a este enlace aquí,
y verás un par de enlaces en la página siguiente
por lo cual tenemos APIs propio CS50, que son muy centrada en Harvard, y luego de terceros API.
Entre las API de terceros son cosas realmente útiles
como ser capaz de enviar a la gente a los SMS,
ser capaz de recibir mensajes de texto SMS de la gente.
Y cosas por el estilo que pueda tener ni idea de cómo poner en práctica a ti mismo,
pero gracias a los servicios, algunos, libre y comercial alguna
usted puede construir sobre esos y hacer algo de su interés.
Entre las API CS50 son estas cosas centradas en el campus como
Cursos de Harvard, energía, alimentos, eventos, mapas, noticias, tweets y Shuttleboy propio,
y estas son las API que mirar un poco algo como esto.
>> Déjame sacar la API HarvardFood.
Si alguna vez has estado a la página web de HUD, usted probablemente ha estado allí
para ver lo que hay para cenar o para ver lo que el horario es para algunos d-hall.
Bueno, no es particularmente fácil de navegar,
y así lo hicimos hace un tiempo se le escribimos software,
que pasa a ser en PHP, que en realidad la pantalla raspa la totalidad del sitio web de HUD.
Para detectar algo rasguño significa escribir un programa en un lenguaje como PHP
que pretende ser un navegador, aunque es posible que se ejecute en un intérprete de comandos,
que pretende ser un navegador, se conecta a un sitio web,
descarga el HTML, el lenguaje en que está escrito,
y luego se lee, o más específicamente, se analiza
de arriba a abajo, de izquierda a derecha.
Y lo que hicimos fue que escribimos nuestro código, de tal manera que
en cualquier momento que vio algo en que HTML que se parecía a algo en el menú,
como hamburguesas, entonces tendríamos que importar a nuestra propia base de datos.
Y cada vez que vimos el contenido nutricional, tendríamos que importar a nuestra propia base de datos.
Y lo que hizo fue aprovechar el hecho de que el sitio web de HUD,
aunque podría ser un poco un desafío para nosotros los humanos a navegar
debajo de la capucha, todo el HTML es generada por sus propios programas informáticos.
Así que todo su código HTML, aunque al principio puede parecer complicado,
como la mayoría de sitios web debajo de la campana se sigue un patrón.
Así que nos pasamos un par de horas averiguar que el patrón
de modo que, al final, tiramos todo el HTML desordenado,
todo de la estética de orientación negrita y en cursiva y similares,
y lo que son capaces de hacer es exponer esos mismos datos.
Por ejemplo, de esta manera.
Así que, de acuerdo con la documentación aquí,
han informado al mundo que si usted solicita una URL
que se parece a esto, food.cs50.net / algo,
y proporcionar ciertos parámetros, lo que vamos a hablar hoy,
como el tiempo de fin fecha, la fecha de inicio del tiempo, la comida y así sucesivamente,
lo que nuestros servidores se volverá a vosotros, por ejemplo,
es un archivo CSV, comma separted valores como un archivo de Excel,
que contiene todo lo necesario para el desayuno en esta fecha en particular en marzo del año pasado
cuando se me ocurrió escribir esta documentación.
>> Para quienes están familiarizados, CSV no es el único formato.
Hay otro formato que sea aún más versátil
llamado JSON, notación JavaScript Object.
Los datos se pueden volver a aparecer en ese formato.
Así que la comida para llevar es que si te sumerjas en esta API
o cualquier otro de CS50 o algo por ahí en Internet,
o nada en absoluto, se dan cuenta de que el mundo ha comenzado a normalizar cada vez más
cómo las máquinas están comunicados entre sí.
Utilizamos formatos de datos estándar como CSV o JSON.
¿Y qué significa esto para usted es que usted puede escribir la parte interesante de un programa
que permite al usuario buscar en un menú de comedor-salón,
que les permite crear listas de favoritos que les permite recibir alertas de texto
cuando su comida favorita está a punto de ser servido en algunos d-hall
mediante el uso de otra persona y la creación de conjuntos de datos en la parte superior de sus APIs.
Así que más que en la forma de seminarios y la documentación que tienes aquí en línea.
Así que estos son, entonces, las API.
>> Esto nos lleva de nuevo a HTML. Resumen rápido.
¿Qué es HTML?
[Estudiante, ininteligible] >> Bien. HyperText Markup Language.
Alguien más, ¿cuál es Hypertext Markup Language?
HyperText Markup Language.
Bien. Entonces, HTML, hypertext.
Hipertexto sólo se refiere a la Web, en su mayor parte.
Marcado significa que no es realmente un lenguaje de programación HTML.
No es un lenguaje que se puede expresar la lógica pulg
No tiene bucles. No tiene condiciones.
No tiene funciones, per se.
Más bien, tiene estas cosas llamadas etiquetas, o más propiamente, elementos.
Y esos elementos tienen etiquetas de inicio y fin,
o etiquetas de apertura y etiquetas cerradas, y lo que esas etiquetas generalmente significa que un navegador es,
empezar a hacer algo y luego dejar de hacer algo, aunque hay excepciones a esto.
A veces es sólo 'poner un salto de línea aquí ", por ejemplo.
Y hemos visto ejemplos de ello el otro día, entre orientada al atrevido,
saltos de línea, y luego un par de otras etiquetas.
Así que HTML es el lenguaje en el que las páginas web están escritas.
Así que si me voy a algo así como Google.com
y tire hacia arriba sólo su página de inicio,
recordar que si hace clic o haga clic en el control
y mirar en la fuente visualización de la página, por lo general
es un completo desastre en estos días bajo el capó, pero eso es porque
equipos no se preocupan por el espacio en blanco, por lo que no tiene que mirar bastante.
Pero si nos centramos en algunas de sus partes,
cuenta de que Chrome, sólo para ser amable, ha codificados por color las cosas.
De hecho, esta es la primera etiqueta que vimos en una página web.
Y de nuevo, HTML 5, la última versión de este lenguaje,
tiene esto en el inicio,
<! DOCTYPE html, ya sea en minúsculas o mayúsculas,
pero eso es sólo una especie de norma que dice: hey mundo, aquí viene un archivo HTML en la versión 5.
>> La parte interesante empieza aquí. Así <html, y luego había dos niños
de los elementos HTML última vez.
¿Cuáles fueron los dos hijos principales?
Cabeza y cuerpo, al igual que el tipo con el tatuaje hace un momento.
Hay dos partes de la página web, la cabeza y el cuerpo,
y recordar, pues, que tal vez la más simple página web que podríamos hacer el siguiente aspecto.
Y lo he sangría sólo para ser una especie de limpia y ordenada, con mi código,
pero lo que es realmente importante aquí es que hay una cierta jerarquía a esto.
Y cualquier etiqueta que he abierto yo han cerrado y que no hay por lo tanto esta simetría
a todas las marcas que he creado.
Así que la última vez que empecé a escribir páginas web en mi propio ordenador portátil.
Abrí edición de texto, he guardado el archivo como hello.html,
Luego arrastró el archivo en el navegador, y listo, yo tenía una página en Internet.
Ahora, no es exactamente así, tenía una página en mi disco duro,
y yo estaba literalmente la única persona en el mundo que ver que la página web en un navegador.
>> Así que hoy, presentamos un servidor web real
y la noción de hecho al servicio de los contenidos en Internet
y cómo todo empieza a encajar.
Así resulta que todo este tiempo en el aparato CS50
usted ha tenido un servidor web en tu ordenador.
Hemos, en equidad, solo lo usamos para gedit, para Clang, para GDB y similares,
pero también instalados por nosotros para que en el aparato es un servidor web,
y ese servidor web pasa a ser gratuito, de código abierto,
uno de los más populares en el mundo, llamado Apache.
Su nombre técnico es más HTTPd, siendo d el demonio por aquí,
que es una palabra técnica para un servidor.
Así instalada en el aparato CS50 es un servidor web, y qué significa eso?
Bueno, un servidor web es, conceptualmente, algún servidor en Internet que sirve de contenido web.
Cuando se le preguntó a un archivo, lo escupe el código HTML que compone ese archivo, y listo.
Usted ve alguna página del sitio web de origen.
Sin embargo, un servidor es, más precisamente, una pieza de software.
No tiene que ser en una máquina física, que sólo tiene que ser una pieza de ejecutar software.
Así el aparato CS50, por supuesto, es una pieza de software
a pesar de que es una especie de pretender ser una máquina.
Está haciéndose pasar por un ordenador dentro de un ordenador,
pero eso sólo significa que el aparato sin duda puede manejar las cosas como servidores web.
En realidad, puede ejecutar servidores de correo electrónico.
Podemos ejecutar un servidor de mensajería instantánea en el aparato si quisiéramos,
y, de hecho, lo hacemos correr otro tipo de servidor, conocido como servidor de base de datos, MySQL.
Pero más sobre esto la próxima semana.
Esto significa que en realidad se puede visitar las páginas web
dentro de mi dispositivo mediante un navegador dentro del aparato
o incluso en mi propio ordenador portátil, mi Mac y mi PC.
Entonces, ¿qué significa esto? Resulta que cada vez se está ejecutando un equipo con Linux,
su apodo es "host local".
No tiene un nombre de dominio, porque no hemos comprado un nombre de dominio
algo así como el aparato, por lo que su nombre predeterminado es el anfitrión local.
>> Pero con el fin de conseguir el aparato para iniciar servir las páginas web,
tenemos que crearla primero.
Así que vamos a hacer eso. Déjame entrar en una ventana de terminal aquí
y nota que estoy en mi sistema típico John Harvard.
Déjenme seguir adelante y escribir ls, y vamos a ver algunas cosas familiares de este semestre,
escritorio, descargas, dropbox y así sucesivamente,
pero ahora empezamos a dirigir nuestra atención a una pareja.
En muchos servidores web Linux existe esta carpeta llamada pública html,
pero vamos a omitir que uno por el momento y centrarse en esta vhosts,.
Alguien sabe lo que es un host virtual?
Sólo jerga estúpida por máquina virtual,
y lo que esto significa es que en un servidor normal
en realidad se puede alojar múltiples sitios web.
Usted puede comprar un nombre de dominio como foo.com, y se puede alojar en el servidor.
Pero también se puede comprar bar.com y alojarlo en el mismo servidor.
La razón es que los navegadores son lo suficientemente inteligentes como para informar al servidor
cuando un usuario solicita alguna página web, nombre de dominio que el usuario desea la página de inicio.
Así que lo bueno de esto es que no es necesario un servidor físico
o un CS50 aparato para cada sitio web es posible que desee crear.
Puede utilizar el mismo servidor y desarrollar un centenar de diferentes sitios web.
Y de hecho, si usted es una persona que intenta iniciar un sitio web,
ya sea por diversión o por negocios, por lo general podrás salir a la Internet,
y que tendrá que pagar a alguien diez dólares al mes, unos cientos de dólares al mes
para alojar su sitio web para ti.
Y la forma en que funciona es que están cobrando otras personas
diez dólares al mes o cien dólares al mes
para alojar sitios web de otras personas de su mismo servidor.
La razón por la que puede hacer eso es debido a esta característica se llama bhosts,
pero más de eso cuando llegue el momento de los proyectos finales.
>> Por ahora, vamos a bucear allí. Así vhosts cd, y si me escriba ls ahora,
cuenta de que hay una carpeta que se llama host local.
Eso es porque, de forma predeterminada, las cifras de electrodomésticos
alguna vez se va a ejecutar un sitio web en un aparato.
Esto no es realmente el mundo real, no es un servidor web del mundo real.
Así que déjame entrar en host local, y ahora vamos a ver ahí
un último directorio llamado HTML.
Así que es un poco más profundo, la jerarquía, pero siempre y cuando
decide iniciar el desarrollo de varios sitios web en los próximos n meses o años,
este tipo de estructura de carpetas tiende a ser útil.
Ahora vamos a entrar en HTML como acabo de hacer,
ls tipo, y no hay nada.
Así que ahora vamos a seguir adelante y hacer esto. Permítanme abrir Chrome
en el interior del aparato, y me dejó ir a http://localhost.
Así que, literalmente, el nombre de mi aparato, entrar, y me da índice de /.
Esto no me está mostrando nada de interés,
pero resulta que lo que estamos viendo es esa carpeta, HTML.
No hay nada dentro de esa carpeta en este momento,
así que en vez, lo que voy a tener que hacer es crear primero un archivo.
Cree un archivo HTML como lo hicimos el lunes, pero esta vez lo puso dentro del aparato.
Para aquellos de ustedes que están tratando de seguir junto con las computadoras portátiles ahora,
déjame hacer un aparte que va a ser cubiertos en el conjunto de procesadores basado en la web,
pero a fin de conseguir que esto funcione, por vez primera,
usted va a tener que ejecutar el siguiente comando: sudo service httpd inicio.
Y esto, de nuevo, se repite en el conjunto de procesadores pasado,
pero si estás jugando junto a casa ahora, el servidor web
se apaga el aparato, y eso es lo que no savia de la memoria RAM
y la memoria durante 7 semanas del semestre cuando no lo necesita.
Así que hay que ejecutar este comando una vez, y obtendrá una salida así.
Entonces usted debe ser capaz de jugar a lo largo de aquí.
Ahora vamos a ir de nuevo en esta carpeta.
Esta carpeta está vacía, así que voy a empezar a crear un archivo,
gedit hello.html.
>> Está bien. Gedit está abierta, como de costumbre. Déjame hacer doctype, html,
html, déjame salir adelante de mí mismo y empezar a cerrar mis etiquetas de antelación.
Ahora tengo la cabeza. Déjenme seguir adelante y cerrar la cabeza,
ahora voy a hacer el título de la página, hola mundo como la última vez,
Título de cerca, ahora déjame hacer un cuerpo.
De aquí que voy a decir hola, mundo con algunas exclams
para dejar claro que se trata de una cadena diferente.
Cerrar cuerpo, y ahora quiero seguir adelante y Guardar archivo.
Déjame volver a mi ventana de terminal, y si me escriba ls,
Debería, probablemente, ver hello.html. Y lo hago.
Así que ahora vamos a volver a mi navegador, haga clic en recargar,
y se puede ver que son de hecho dentro de esta carpeta HTML.
No estoy viendo una página web con todo, lo que es Apache, el servidor web,
me acaba de mostrar los contenidos de la lista de este directorio.
Al igual que Mac OS o Windows normalmente se hace en su propio disco duro local.
Así que si quiero ver esta página web, puede hacer clic en este enlace poco aquí, hello.html,
y, de hecho, eso es lo que yo estaba esperando ver.
Ahora, de nuevo, esto no es una URL que cualquiera de ustedes puede visitar en este momento,
porque por ti, host local, si usted tiene una computadora portátil aquí,
que se refiere a su propia instancia del aparato.
Esto es en mi aparato personal,
pero esto es un poco tonto para mí tener, tener
un usuario como yo, haga clic en hello.html para ver realmente los contenidos de esta página.
Resulta que los servidores web como Apache permitirá tener un archivo por defecto para cualquier servidor web.
Tenga en cuenta que aquí tenemos hello.html.
¿Cuál es el comando en Linux para cambiar el nombre de un archivo?
>> MV, por mudanza. Así que vamos a hacer eso,
y dejar que me cambie el nombre hello.html a index.html.
Déjame escribir ls para confirmar que ha cambiado de nombre.
Ahora bien, esto va a - si me vuelvo a host local,
notar ahora que estoy viendo automáticamente esa página web.
Esto es idéntico a mi realmente haciendo / index.html,
pero lo bueno es que el servidor web está pensando,
oh, si usted tiene un archivo que, por convenciones humanas, se llama index.html,
permítame mostrarle al usuario que el archivo por defecto
en lugar de algún listado de directorios estúpido que no es en absoluto fácil de usar.
De hecho, la mayoría de los sitios web que visita en Internet no tiene una lista de archivos que se haga clic en,
simplemente le mostrará el contenido. Así es como podemos hacer eso, index.html.
Así que esto es todo diversión y buena, pero esta es una página web muy simple.
Déjenme seguir adelante y abrir index.html en mis vhosts,
los anfitriones locales, directorio html y Let añadir algo de mayor interés.
Así que hola mundo, vamos a decir en lugar 'Esto es CS50, Harvard College. . .
Así que el comienzo de la descripción de catálogo curso de algún tipo allí.
Ahora bien, si vuelvo a cargar, debería ver esto en mi página de inicio.
Bueno, y yo creo que eso, pero supongamos que quiero enumerar ahora algunos más contenido en este archivo.
Podría seguir aquí y decir que ninguno requisitos previos,
aunque algunos de ustedes probablemente como, 'Ja, ja, ja, hay requisitos previos.
Pero - oficialmente. Así que recargar, y ahora tenemos la peculiaridad mismo que vimos la última vez.
Pero ¿por qué es eso? Es una solución simple.
¿Por qué esta página rota?
[Estudiante, ininteligible] >> Sí, hemos resuelto esto antes
explícitamente diciendo al navegador poner un salto de línea aquí.
Y eso es porque, de nuevo, un navegador sólo va a hacer
explícitamente cuál es el lenguaje de marcado que dice que haga,
así que, aunque es posible que haya pulsa enter una vez o dos veces o incluso diez veces,
que va a combinar todo eso en un solo espacio, sólo por convención.
Así que si usted realmente desea un salto de línea, usted tiene que utilizar la etiqueta br,
y ahora fíjense, como lunes, pongo el interior / de esta etiqueta,
sólo porque esto simplemente no se siente bien
para iniciar un salto de línea después dejar sin nada en medio.
>> Así que la convención en HTML es abrir y cerrar una etiqueta a la vez.
Como acotación al margen, verás un montón de sitios web en los libros no hacen eso.
Es correcto hacer o no hacer, pero se argumenta que
que el diseño inteligente y estilísticamente, esto es sólo una mejor
porque entonces cada etiqueta es a la vez abierto y cerrado de alguna manera.
Así que ahora vamos a guardar y volver a cargar. Volver al navegador, de acuerdo.
Ahora estamos haciendo algunos progresos, pero no es suficiente.
Vamos a seguir adelante y empezar a escribir en un cuerpo más largo del texto.
Así que vamos a decir, 'Un rápido zorro marrón salta sobre el perro perezoso.
Y ahora permítanme simplemente copia y pega esto unas cuantas veces
de modo que tenemos un párrafo de texto.
Déjame volver por aquí. Por lo que no se ve muy bien.
Tengo un salto de línea, así que está bien,
pero ahora, una vez que estamos llegando al punto de tener una página web
que tiene un montón de contenido y las líneas individuales no sólo para demostrar HTML,
podemos empezar a pensar en estas cosas como párrafos reales.
Y podemos empezar a estructurar nuestra página web un poco más limpia.
Y, en efecto, lo que puedo hacer es subir aquí dentro de mi cuerpo de la etiqueta,
y sabes qué, si "Esta es CS50. . . realmente deMarks el principio de un párrafo,
bueno, vamos a etiquetar como tal.
Déjame sangrar el texto, sólo por convención, permítanme decir
que este párrafo termina aquí,
y entonces en vez de hacer este salto de línea, permítanme decir
que esto pertenece allí y como un nuevo párrafo,
y sólo voy guión rápidamente con sólo clobbering todas estas cosas.
>> Así que ahora tenemos un párrafo con sangría allí,
y ahora nuestro margen de beneficio está empezando a conseguir un poco más
semánticamente consistente con lo que estamos tratando de hacer.
Tenemos un párrafo, por lo que vamos a llamarlo un párrafo con la etiqueta p.
Tenemos un segundo párrafo, por lo que vamos a llamarlo un párrafo con la etiqueta p.
Y ahora, lo que el navegador suele hacer
Es como en un libro de Inglés o ensayo,
donde se suele ver algunos saltos de línea entre párrafos.
Navegadores lo hará por usted automáticamente.
Así que ahora tenemos dos párrafos y podemos continuar con esto.
Pero, por supuesto, en la Web, cuando tienen cuerpos de texto
no es por lo general sólo gotas enormes de texto.
A menudo los hipervínculos de allí.
Así que si queremos, por ejemplo, incluir algunos enlaces allí,
Supongo que lo que podría ser de interés en cualquier página web que estoy creando aquí es -
déjame ir a Google.com,
y déjame buscar un rápido zorro marrón.
Ir a las imágenes de Google, y, ¿qué tal - esto es lindo.
Vamos a ir con esto. Así que aquí tenemos una rápida zorro marrón salta sobre el perro perezoso.
Así que lo que voy a hacer aquí, sólo por el bien de la demostración,
se supone que esta imagen fue en mi servidor,
y yo había estado creando estas imágenes.
Lo que hizo fue simplemente haga clic derecho o control Haga clic en la imagen,
y lo que vas a ver en la mayoría de los navegadores es un pequeño menú -
dejar de hacer eso - un pequeño menú que permite elegir la ubicación Copiar el enlace o URL de copia.
Así que permítanme volver ahora a mi HTML, y supongamos que quiero
a este hipervínculo a otra página web.
>> ¿Cuál fue el tag llamado para eso?
[Estudiante, ininteligible] >> Si. Así que a href para referencia hiperactivo.
Déjame ir por delante y pegar el pulg
Es una URL muy larga, así que permítanme reducir.
Cerrar paréntesis, por lo que ahora cuenta de que estoy hasta aquí
porque esa URL resultó ser bastante largo.
Permítanme desplazarse por aquí hasta el final del rápido zorro marrón,
y entonces permítanme concluir con esta etiqueta </ ​​a,
donde sólo se cierra el nombre de la etiqueta.
Ahora voy a seguir adelante y guardar el archivo, vuelva a cargar la página web,
y ahora, por defecto, esto va a ser subrayados en azul para mí,
pero en realidad, ahora puede hacer clic sobre éste y voila. Ahí está esa imagen.
Y no tenía por qué ser una imagen, sino que podría haber vinculado
a algún otro sitio web al azar a través de Internet.
Yo podría hacer esto, por ejemplo, con CS50, por lo que un último ejemplo aquí.
'Esto es CS50' podría tener sentido para ir a, href =
http://www.cs50.net, Cierre de comillas, ancla cerca.
Así que ahora que es un URL aún más corto, y esta vez no vamos a vincular a una imagen.
Estamos en vez de ir a un vínculo a otra página.
Ahora, tenemos una imagen aquí.
Siento que podemos hacer algo mejor que un simple enlace a una imagen.
¿Qué pasa si queremos realmente encarnar en nuestra página web?
>> Bueno, lo que puedo hacer aquí es, más que un enlace a este gráfica,
déjame cortar en lugar de la URL, y vamos a deshacernos de ese hipervínculo y limpiar esto.
Y vamos a ir por aquí y librarse de esto.
En realidad no necesitamos todas esas frases ahora, así que permítanme abreviar la página un poco.
Y aquí me dejó ir por delante en un nuevo párrafo,
decir que no desea que el texto ahora, yo quiero una imagen cuyo origen va a ser esa URL.
Una imagen, como un salto de línea, está allí o no lo es.
Así que permítanme cerrar inmediatamente esa etiqueta.
Déjame ir adelante ahora y cerrar el párrafo que estoy dentro,
y si todo va bien con hello, world, si vuelvo a cargar ahora,
Yo, de hecho, ver a la derecha dentro de mi propia página web una imagen.
Así que ahora tenemos una etiqueta de imagen, una etiqueta de ancla y similares,
y por si acaso, me deja hacer otra cosa que a menudo se descuida
en los sitios web en estos días: Vamos a proporcionar un texto descriptivo para esta imagen
para las personas que están en un dispositivo móvil
y por lo tanto no podría ser capaz de descargar esta imagen en forma rápida
para las personas ciegas y podría no ser capaz de ver la imagen
pero podrían tener un lector de pantalla que se les puede decir lo que esta imagen es de.
Y para hacer eso, hay otro atributo para las etiquetas de imagen
alt llamado, por un texto alternativo.
¿Y qué puedo hacer aquí es decir: 'Esto es un rápido zorro marrón.
Así que, incluso si el humano no puede ver la imagen en la pantalla,
él o ella puede oír al menos, como con alguna pieza de software,
lo que realmente hay en la pantalla.
>> Eso no va a cambiar la estética de la página,
pero es ciertamente una buena práctica para los usuarios.
Muy bien, vamos a salir de esta página web en su forma actual,
pero vamos a ver si ahora no podemos introducir
algunas aproximaciones mejores a escribir estas páginas web,
algunas lecciones que nos van a servir bien como nuestras páginas se vuelven más y más complejas.
Lo que no vamos a hacer en los próximas semanas
Se le guiará a través de todas las varias docenas de etiquetas HTML que hay.
Al igual que en cero de nuevo en la semana 0, probablemente será suficiente
para dar una visión general de alto nivel de algunos de los conceptos,
un rápido recorrido por algunos de los bloques que probablemente eran capaces,
bastante cómodamente, para navegar por su cuenta, las piezas del rompecabezas diferentes.
Y eso va a suceder de nuevo en HTML, lo más probable,
por lo cual hay amplios recursos en la Web que le indicaremos los casos,
varios libros de texto, si usted prefiere leer un libro de texto,
que le guiará a través de todas las diversas cosas que usted puede hacer con HTML,
pero la verdad es que hemos visto hasta ahora en HTML mayoría de los conceptos fundamentales.
Tenemos la idea de que se abran las etiquetas, las etiquetas están cerradas.
Algunas etiquetas que son abiertas y cerradas
en el sentido de que están vacíos, no debe haber nada dentro de ellos
como una etiqueta de imagen o un salto de línea, que sólo están ahí.
También vimos ya en la noción de un atributo, como alt o fuente.
Tenga en cuenta que estas palabras tienden, por convención, para ser corto y conciso.
>> No tenemos facultades para decidir sobre lo que estas cosas se llaman,
otra persona que inventó HTML subió con estos nombres.
Así que sólo tienes que empezar a conocer o buscar, cada vez que los necesite,
lo que son los nombres de estas etiquetas y atributos.
En el caso de estos atributos, atribuye generalmente
modificar el comportamiento de algunos etiqueta.
En este caso, el atributo fuente le dijo a la etiqueta de imagen
cuál es la fuente de la imagen debe ser.
El atributo href indica la etiqueta de anclaje lo que realmente debe ser enlazado.
Pero en términos de la estructura de una página web, aunque Facebook
y Google y la mirada como como un completo desastre
debajo de la capilla, a primera vista, si usted comienza a leer a través de él
más metódicamente, todos siguen esta estructura básica y básica.
Pero podemos mejorar la estilización de estas cosas.
Así que déjame ir a algunos ejemplos que he preparado con antelación.
Déjenme seguir adelante y copiarlos de otra carpeta aquí
y los puso en este directorio.
De antemano, lo que hice fue preparar algunos archivos:
search0, término1, término2, y search3 y 4.
Déjenme seguir adelante y abrir el primero de esos archivos,
y vamos a ver si podemos empezar a crear nuestro propio motor de búsqueda.
En la parte superior de este archivo, como suele ser el caso en clase, sólo un montón de comentarios.
En HTML, sin embargo, los medios por los cuales se inicia un comentario
es <- y luego te encuentras dentro de un comentario, un comentario de varias líneas.
Cuando estés listo para dejar ese comentario, puedes hacerlo ->.
Así que todo en la parte superior en azul es sólo un comentario.
>> Esta es mi declaración DOCTYPE, que a su vez,
usted puede copiar y pegar en la fe, por ahora.
Este dice al navegador: "Aquí viene algo de HTML 5.
Más abajo, en la línea 14, es el primero de mis etiquetas reales,
y esto sólo dice, como antes, aquí viene un poco de HTML,
aquí viene la cabecera de mi página, aquí viene el título,
y luego, a la inversa, esto es todo por el título, que es para la cabeza.
Aquí ahora viene el cuerpo de la página.
Así que un par de nuevas etiquetas h1 ahora: las siglas de la rúbrica 1.
Hay una tradición en HTML desde hace muchos años atrás
de tener diferentes tamaños de texto.
Y de vuelta en el día, cada uno entiende, en general, sólo grande y en negrita.
Pero también hay h2, que es grande, pero no es tan grande y en negrita.
Hay h3, que es un poco grande pero no tan grande y en negrita,
y así sucesivamente, hasta el final abajo a h6.
Estos días, sin embargo, h1, h2 y h3 son realmente significaba
tener más significado semántico para ellos,
por el que h1 es realmente un título: el título de una página web,
el encabezado de una columna o algo por el estilo del texto.
Así que me he dicho deliberadamente h1 CS50 búsqueda> h1
para especificar que este es realmente el título, el título de mi página.
No es el título en el sentido de barra de título,
pero el título que en realidad se ve en la propia página web, en el cuerpo.
Ahora bien, esto, que es fácil adivinar lo que es,
aunque tenemos algunas piezas nuevas de sintaxis.
Esta es una forma. Así que la web realmente se pone interesante
cuando sitios web obtener información de los usuarios.
En esta clase, en el conjunto de problemas de programación web,
no vamos a hacer un sitio web, per se,
con contenido estático que muestra las fotografías que ha tomado,
o esta es mi hoja de vida, y las cosas sobre mí,
porque esas cosas son relativamente fáciles de armar.
Es difícil hacer las cosas bellas de la Web,
pero al menos la colocación de contenido es bastante trivial.
Pero las cosas se ponen interesantes cuando alguien visite su sitio web
y proporcionar información y puede llenar formularios,
Puede marcar casillas y pueden interactuar con su sitio web.
Y de hecho, probablemente todos los sitios web que te importa
estos días, en detalle, es de alguna manera interactiva.
Facebook, Google, y similares, que tienen la entrada del usuario
y producir una salida personalizada.
>> Así que vamos a empezar a hacerlo ahora. Transición Vamos ahora
de poco uso de HTML para el marcado de contenido estático
ya que en lugar de un mecanismo de entrega de contenido dinámico.
Y con ese fin, vamos a implementar nuestro propio motor de búsqueda.
Vamos a hacerlo de la siguiente manera. Aquí está la etiqueta de formulario.
El atributo action especifica que cuando el usuario rellene este formulario
con su teclado, que será presentado a esta URL aquí.
Así que yo soy una especie de trampa. Esto nos va a tardar un poco más
de una clase para implementar el motor de búsqueda conjunto,
así que sólo voy a hacer la parte delantera, por así decirlo.
Vamos a hacer la parte que permite al usuario buscar, y vamos a una especie de patada de despeje de Google
la parte más difícil de encontrar resultados de búsqueda,
pero, en concreto, voy a hablar con el servidor web de Google
utilizando uno de dos métodos muy populares.
Uno se consigue, sí, que finalmente va a ver, ser enviados,
aunque hay otros que son menos utilizados.
Así que sólo evoca la idea de, quiero conseguir algo de contenido, obtener algunos resultados de búsqueda.
Esto, tal vez usted puede adivinar lo que hace.
Esta es una especie de entrada, es, de hecho, va a parecer un campo de texto,
y el nombre de esa entrada, el nombre de la variable, por así decirlo,
va a ser q la consulta por convención.
Y de nuevo, el tipo de esta entrada no va a ser una casilla de verificación;
no va a ser un menú, sino que va a ser un campo de texto
como se indica mediante este atributo aquí, y este cuadro de texto,
como un salto de línea, es allí o no.
Así que tenemos un elemento vacío con la barra dentro de esa etiqueta.
Entonces me voy a poner un salto de línea, y usted puede, tal vez, supongo que lo que esto va a hacer.
Este es otro tipo de entrada del formulario.
>> Éste va a ser utilizado para enviar el formulario.
Así que esto va a ser el gran botón que el usuario puede hacer clic para enviar el formulario,
y la etiqueta del botón que va a ser 'CS50 Buscar ".
Cerrar Modelo, el cuerpo de cierre, HTML.
Vamos a ver lo que tenemos en el formulario de esta página web.
Así que me voy a mi navegador,
déjame ir, todavía, a host local.
Esto sigue siendo index.html, así que si quiero ver el archivo llamado search0,
Simplemente puedo hacer / search0.html, introduzca -
y el primero de mis errores.
¿Qué está pasando? Yo claramente no tiene permiso
para acceder a este archivo, por alguna razón.
Pero eso es porque, a diferencia del trabajo que hemos hecho hasta ahora en C,
donde los programas que escriben se supone que son runable por usted,
ejecutable por usted, eso no es realmente el caso en la Web,
por lo cual a veces es posible que desee crear archivos en un servidor,
pero usted no quiere que todo el mundo pueda verlos.
Más bien, quiere que el mundo vea algunos archivos
pero no en otras, sólo por el bien de la privacidad.
Así que es más de una base opt-in cuando estás haciendo las cosas en la Web.
Por eso, ¡realmente me escriba ls aquí,
y ver los archivos que tengo, pero recuerda que si lo hago ls-l por mucho tiempo,
Voy a conseguir un listado más largo que me da algunos detalles más sobre estos archivos
que ahora son, en realidad, por primera vez, relevante para nosotros.
Tenga en cuenta que en la extrema derecha son los nombres de mis archivos,
y después del momento en que la última modificación o copiado.
Este número es el qué? ¿Recuerdas?
El tamaño en bytes, el tamaño del archivo es.
>> Así que me parece que tienen algún tipo de logo aquí que es más grande que todos los otros archivos.
Esto es lo que soy, esto es lo que soy y lo que el grupo que me encuentro
Pero entonces, por aquí a la izquierda es un poco críptico de secuencia,
y hablamos, creo que, en pocas palabras acerca de esto en el pasado,
pero esto tiene que ver con los permisos.
Y aunque eso es un poco confuso,
RW probablemente significa leer y escribir.
Así que resulta que estos guiones denotan conjuntos de permisos diferentes para diferentes personas.
Y el patrón es, esencialmente, de la siguiente manera.
Cuando usted ve una secuencia de guiones aquí, se ven de la siguiente manera.
Hay un guión, luego hay otros tres guiones,
luego hay otros tres, entonces hay otros tres.
La primera de ellas es o bien un guión o un anuncio para su directorio.
Así que uno es bastante fácil. Si se trata de una carpeta, se dice d, de lo contrario es un guión.
Hay un par de otros casos, pero por ahora sólo tendremos que cuidar sobre los archivos y directorios.
Estos próximos tres guiones - y he insertado artificialmente los espacios.
Eran, evidentemente, no existe cuando los vimos hace un momento.
Estos son los permisos del propietario del archivo,
y recordar desde hace un segundo que se leer y escribir.
Eso era porque yo, como la persona que creó el archivo hace un momento,
Yo, sólo por defecto, en un equipo Linux,
tienen la capacidad de seguir leyendo y escribiendo ese archivo.
>> Así que el sistema operativo sólo me da RW de forma automática.
Los medios se refieren a mi grupo, el de los estudiantes,
que es una especie de sentido en el aparato porque soy la única persona que usa el aparato.
Así que permítanme saludar a mis manos en eso por ahora.
Sin embargo, los últimos son los más importantes para la Web.
Se trata de todos los demás en el mundo, y el hecho de
que eso está --- significa que nadie más en el mundo
cuenta con todos los permisos de este fichero.
Es evidente que un problema, así que tengo que arreglar esto
de alguna manera dar al mundo qué? Leer y escribir?
Eso es probablemente tonta, ¿verdad? Yo no quiero que nadie en la Web
para ir a visitar mi página y cambiar de alguna manera ese archivo,
a pesar de que realmente no podía con un archivo HTML,
pero sólo en principio, probablemente sólo quiero que sean capaces de leerlo.
¿Qué significa para leerlo? Esto no quiere decir que van a preocuparse por el código HTML actual,
pero el navegador tiene que ser capaz de analizar ese lenguaje de marcado,
de arriba a abajo, de izquierda a derecha.
Así que alguien en la Web tiene que ser capaz de leer, así que mínimamente necesario darle r.
Puedo hacer esto en diferentes maneras, pero quizás
el más simple es ejecutar este comando aquí.
Chmod, el modo de cambio, entonces a + r para todo todo el mundo, en el mundo + leer
y luego el nombre del archivo, search0.html.
>> Y si hago ls-l otra vez, note que ese archivo ha cambiado,
y de hecho, me he convertido en r para todos.
También lo he encendido para mi grupo, pero eso está bien,
porque si yo me convirtiera en el de todos, mi grupo es un subconjunto de eso.
Así que eso también está bien. Esto sólo significa que el ordenador ha hecho que ahora sea legible.
Ahora voy a volver a mi navegador, haga clic en recargar.
Ah-ha. Ahora tenemos CS50 Buscar.
Me he acercado un poco artificial - Motor de búsqueda bastante horrible.
Pero vamos a ver si realmente funciona.
En primer lugar, permítanme hacer una simple comprobación rápida, déjame controlar y haga clic en ver el código fuente de página.
Tenga en cuenta que dentro de Chrome ahora estamos viendo el mismo HTML que yo mismo he creado.
No se confunda aquí, sin embargo. No puedo empezar a cambiar el código aquí,
porque el navegador tiene una vista de sólo lectura de este código.
El navegador acaba de pedir host local para un archivo llamado search0.html.
Ahora es casualidad que el aparato
pasa a estar en el mismo equipo que mi navegador.
Yo sólo podría tener, de manera equivalente, han escrito en www.facebook.com/search0.html,
y si Facebook tiene un archivo llamado así, entonces me estaría viendo su HTML.
Y, por supuesto, no puedo cambiar el archivo que regresa de Facebook, tampoco.
Así que ahora estamos especie de desdibujar las líneas.
El aparato es a la vez un servidor, servir las páginas web,
pero también es un cliente en el sentido de que yo estoy usando un navegador
que hablar con ese servidor.
Así que vamos a ver si mi motor de búsqueda de Google funciona.
Déjenme seguir adelante y buscar rápido zorro marrón, introduzca.
Y voilá, ahora tengo mi propio motor de búsqueda.
>> Pero, ¿cómo funciona esto?
Un poco de un tramo, pero - y ahora no puedes ver, precisamente, la parte que es de su interés.
Observa lo que sucede.
Observe la URL. Resulta que ese método,
llamado conseguirlo, es súper simple.
Cuando se especifica en una forma que usted quiere "obtener" resultados de algún servidor,
lo que va a hacer es tomar lo que usted escribe en la forma
y lo puso en la URL.
Va a estandarizar la forma en que se pone en la URL de la siguiente manera.
Tenga en cuenta que esta es la URL que fue el valor del atributo de mi acción.
Ahí es donde yo quería que la forma de terminar.
Pero a continuación, observe este signo de interrogación.
Esta es una convención en la Web mediante el cual hacer aportaciones usuario
a un sitio web, añadir a la URL de un signo de interrogación,
y entonces usted tiene un montón de pares clave-valor.
El nombre de una tecla, también conocido como un parámetro en la Web,
entonces usted tiene un signo igual, entonces usted tiene el valor de ese parámetro.
Así que es esencialmente un nombre de variable y un valor variable,
pero los nombres de variables y valores de vino de la forma HTML.
¿Por qué son las cosas positivas allí, qué te parece?
Porque no escribir + entre mis palabras.
[Estudiante, ininteligible]
>> Sí, es sólo para el espaciamiento. Las probabilidades son, cada vez que he visto una URL,
Nunca hay espacios en él, aunque sólo sea porque
si lo hubiera, realmente no se podía copiar y pegar
en un mensaje instantáneo o en un correo electrónico, ya que se rompería.
Usted quiere que el asunto de ser una cadena de caracteres contiguos.
>> Así que el navegador es lo suficientemente inteligente como para darse cuenta, uh-uh.
No sólo hay que poner un espacio allí. Déjame codificar el espacio de alguna manera estándar.
Una de las convenciones para hacerlo es hacer que el navegador
poner automáticamente un + en la que de otro modo tendría un espacio.
Así que ahora, observe Google ha tenido la gentileza de fácil de usar.
Desde luego, no ha creado esta página web,
pero se han rellenado previamente su propio campo de texto
con lo que, precisamente, he escrito pulg
Supongamos que desea buscar otra cosa, como un perro perezoso.
Sólo puedo escribir esto aquí, de investigación.
Observe que la dirección URL cambia aquí,
notar entonces que en realidad se puede buscar lo que quiera
sólo mediante la comprensión de cómo funcionan los URLs.
Que podía hacer gato perezoso, entrar,
y noto ahora me estoy poniendo un poco flojo - debemos? Siento que debería.
Tengo un gato muy perezoso.
Está bien. Esta es una de las cosas más estúpidas que he hecho.
Pero eso es un gato perezoso.
De todos modos, ¿cuál es el punto clave aquí?
Ahora estamos en una especie de juego en el mundo de HTTP.
HTML es sólo este lenguaje de marcas, la etiqueta abierta, la etiqueta de cierre,
que indica al navegador cómo presentar el contenido de una página web.
Sin embargo, cuando se inicia la transmisión de datos a través de Internet
entre el navegador web y el servidor, que es donde este protocolo
conocido como Protocolo de transferencia de hipertexto se hace cargo.
Este es el tipo de convención humana, cuando Sam y yo nos dimos la mano el lunes,
iniciar una conexión y después de cerrar una conexión, la misma idea aquí.
¿Cómo son los resultados de Google vuelve a mí?
¿Cómo está mi envío del formulario de ir a Google?
Bueno, recuperará el otro día que lo que realmente está pasando
debajo de la capucha cuando se solicita una página web es,
su navegador está enviando un mensaje un tanto críptico, como
GET / HTTP/1.1 para la página de inicio predeterminada.
>> O, en este caso, porque específicamente solicitado anteriormente
search0.html, este sería entonces el mensaje algo críptico-
que el navegador envía al aparato.
O, en este caso de Google, lo que realmente envió
es una petición a / de búsqueda y luego? q = gato perezoso, con una ventaja allí.
Así que este mensaje, que yo, el ser humano, nunca estoy escribiendo,
pero está siendo enviado por el navegador, así es como HTTP que pasa.
Esto es el equivalente a nuestras manos después de haber sacudido.
Esta es la petición, y el servidor está a punto de enviar una respuesta.
Así que vamos a echar un vistazo a esto bajo la campana.
Al igual que antes, se puede abrir este campo especial en un navegador.
Ver página, inspeccionar elementos.
Así, de acuerdo inspeccionar elemento, observe que lo que ha ocurrido en Chrome,
y el IE y Firefox tienen mecanismos similares,
tenemos estas herramientas de desarrollo accesibles para nosotros.
La gente normal no utilizar estas fichas.
Pero, ahora, está interesado en lo que está pasando
debajo de la capucha en el nivel de red.
Así que si me levanto el nivel de la red aquí,
déjame seguir adelante y ampliar esta ventana,
abrir esta entrada aquí, y mira las cabeceras.
Entonces, ¿qué sucede cuando solicito un archivo de un servidor web
es mi navegador envía un montón de cosas.
Y déjame ver el código fuente. Así, bajo los encabezados de solicitud,
Y esto es sólo Chrome mostrarme alguna salida de diagnóstico,
algo así como un depurador de algún tipo,
cuenta de que lo que he destacado aquí es precisamente lo que
Chrome está enviando al servidor con el fin de generar un archivo llamado search0.html.
Es revelador que el servidor lo que piensa que es su nombre,
gracias a este campo de dos puntos de acogida, a continuación, hay algunos
algo bastante esotérico aquí, como algo que ver con fechas y horas,
algo que ver con las lenguas que el navegador entiende,
pero las líneas son muy importantes estos primeros dos aquí.
>> ¿Qué hace el servidor responde con? Bueno, si nos desplazamos hasta aquí
y ver el código fuente de esta cosa, observe que el servidor
ha respondido con un mensaje algo críptico, así, no 304 modificado.
Eso es un poco extraño, me dejó realmente tratar de solucionar este problema.
Que me mantenga presionada la tecla MAYÚS y haga clic en recargar hasta aquí
para forzar al navegador para hacer realidad esta solicitud por primera vez.
Entonces déjame acercar, y vamos a ver ahora que la respuesta del servidor,
porque he tenido cambio, es 200 OK.
Así que usted probablemente nunca ha visto el número 200
en números el contexto de la Web, pero lo que
¿ha visto a veces inesperadamente de un servidor?
404, archivo no encontrado, 403, prohibido; 500, error del servidor.
Así que hay estos códigos numéricos que el mundo se utiliza en la Web
para indicar los errores, al igual que las funciones de C
puede devolver errores y principal puede devolver códigos de salida.
200, sin embargo, rara vez se ve porque significa que todo está bien.
Y 304 que probablemente nunca vea porque lo que se lo que significa?
Eso nada tiene - vamos a ver si podemos simular esto de nuevo -
Oh, ahora no está cooperando. 304 dijo que no se modifica,
así que ¿por qué el servidor incluso de funcionar?
Pues bien, de la eficiencia, un servidor web de forma automática,
Si el archivo no ha cambiado, no va a retransmitir el archivo HTML conjunto.
Simplemente voy a decirle al navegador que no ha cambiado.
Sólo tiene que utilizar la copia que ya tiene.
Así que esta noción de almacenamiento en caché en la Web
para el funcionamiento, para que no pierdas el tiempo y ancho de banda de los residuos
la descarga de archivos de nuevo y de nuevo innecesariamente.
>> Pero esta página web, ahora, era súper simple,
y sólo me muestra el código HTML que regresó.
Vamos a utilizar realmente la ficha red ahora para hacer una búsqueda en Google como quick brown fox.
Permítanme continuación, haga clic CS50 búsqueda,
y ahora, fíjate en el fondo aquí un montón de cosas volvieron
porque cuando visita un sitio web real como Google.com,
que tienen imágenes, tienen texto, tienen un lenguaje llamado JavaScript allí.
Así que cada fila de esta tabla aquí abajo
representa algo que Google escupir en respuesta a mi solicitud única.
El que más me preocupa, sin embargo, es la primera.
Y si me voy a la búsqueda, solicitud, haga clic aquí ver el código fuente,
cuenta de que, efectivamente, el mensaje críptico que el navegador envía
a Google fueron estas dos líneas aquí,
seguida de alguna información aquí arcano que vamos a ignorar por ahora.
Pero nótese también que Chrome es bastante práctico con,
también está mostrándome la cadena de consulta que fue enviado pulg
Así que en lugar de volver a mostrar este, que fue enviado literalmente,
si veo lo decodifica, Chrome, sólo para propósitos de depuración,
para los desarrolladores como nosotros, se me acaba de mostrar una versión humana de usar de -
no es así como se escribe zorro, al parecer.
Estoy notando esto ahora - pero le está mostrando lo que, al parecer, escribió.
Mientras tanto, la respuesta que volvió del servidor es de nuevo 200 OK.
Pero se incluye en la respuesta que, por supuesto,
si en realidad ver la página HTML -
lo siento, este es un atajo de teclado poco ido mal hoy.
>> Yo me ocuparé de eso más tarde. Así que si realmente ver el código fuente de la página,
que puedo hacer aquí abajo haciendo clic en la respuesta,
esto es lo que realmente escupir de nuevo, además de que críptico mensaje 200 OK del servidor.
Un poco críptico, pero ¿dónde está todo esto viene?
Bueno, vamos a hacer otra cosa aquí. Otro comando-algo críptica,
pero este tipo de uno de ordenada en que se nos revela exactamente lo que está pasando debajo de la capucha.
Así que estoy de vuelta en mi Mac aquí, he conectado
a través de un programa llamado SSH, Secure Shell, a otro servidor
porque la mayoría de las computadoras de Harvard bloquear el comando que vamos a ejecutar
porque hay este comando en algunos servidores de traceroute llamado
que le permite rastrear la ruta entre los puntos A y B,
y hasta el momento hemos estado tomando completamente por sentado
que puedo escribir en Google.com y de alguna manera obtener datos de vuelta
desde el otro lado del país o al otro lado del mundo.
Con traceroute en realidad podemos bucear un poco más profundo
en cuanto a cómo funciona Internet, y ver lo que pasa debajo del capó.
Así que vamos a seguir adelante y arbitrariamente trazar una ruta, digamos, Stanford.edu,
que está al otro lado del país, y pulsa enter.
Este comando puede ser super-rápido o muy lento,
pero lo que estamos viendo ahora, línea por línea,
es cada uno de los pasos o saltos entre nosotros y Palo Alto, o Stanford,
donde tienen su servidor web.
Entonces, ¿qué significa cada una de estas líneas representan más concretamente, ¿no?
Un pedazo de jerga de Internet? [Estudiante, ininteligible]
>> ¿Qué es eso? [Estudiante, ininteligible]
>> Oh, así que hay veces, pero ¿qué significa cada fila - ¿qué es lo que quiero decir con hop?
>> Bueno, hay estas cosas en el Internet llamados routers.
Y routers, como su nombre indica, la información de ruta del punto a al punto b.
Pero hay varios puntos más allá de a y b.
Hay c y d, ey f entre la fila 1,
que pasa a ser la dirección IP de mi computadora,
o mi dirección numérica que identifica de forma exclusiva el ordenador,
y el paso 15, que es realmente el servidor web sexto,
al parecer, que estoy inferir de esto, o la versión 6 de su servidor web en Stanford.
Pero lo que es muy guay es que podemos ver el camino
que mi 0 y el 1 se toma de mi ordenador a Stanford.
Así que el paso 1 es la dirección de mi propia computadora.
Cada ordenador en Internet tiene un identificador único que se parece a esto.
Number.number.number.number.
En algún lugar de este campus, probablemente en el centro de la ciencia,
es un router gateway llamado Core 2-te83, sea lo que sea,
por lo que este es uno de los grandes routers de lujo de Harvard que dirige un gran parte de su tráfico.
He aquí otro de los routers de Harvard, este es un Border Gateway,
significado frontera es probablemente en la periferia del campus en alguna parte.
Entonces hay una nox, fila 4, que es encrucijada del Norte,
que es un gran ISP, Internet Service Provider,
que lugares como Harvard conectar hasta.
Pero luego las cosas se ponen un poco más interesante en la línea 6.
¿Dónde están mis pedacitos de repente? Kansas.
El mundo tiene la costumbre de utilizar los códigos de aeropuerto en un montón de estas cosas,
o por lo menos abreviaturas de estados o ciudades,
por lo que parece, en sólo 60 ms,
un paquete de información, 0 y 1 es de mi laptop
Tiene todo el camino a Kansas, y de nuevo, en 60 ms.
>> Por otra parte, después de Kansas, se hizo un recorrido a través de Houston, probablemente,
como se sugiere por el nombre de este servidor.
Así como un servidor en Internet debe tener una dirección numérica,
también puede, opcionalmente, dispone de una dirección un poco más amigable que los seres humanos ocurrió.
Ahora, en el paso 8, no sabemos lo que es.
A veces, los routers sólo un poco de te ignoran,
y simplemente no responden a las preguntas, así que está bien.
El de después de la etapa 8 es aparentemente dónde? Los Ángeles
Observe que en sólo 78 ms, lo que nos lleva a los seres humanos como 6 + horas en hacer físicamente,
toma los paquetes de información a través de Internet 78 ms para viajar tan lejos.
Paso 10 se encuentra en Los Ángeles, así, y el paso 11 parece haber ido al norte, hasta cerca de Stanford.
Esta es su enrutador de límite o frontera router.
Un par de pasos de Stanford que nos están ignorando,
y, por último, llegamos al servidor web en tan sólo 87 ms.
Ahora, todas estas cifras, en un aparte,
sólo le dirá cuánto tiempo le toma a los datos a obtener de mí
para cada uno de estos routers, y no es acumulativo.
Lo que este programa hace es, primero envía un mensaje, en esencia, al primer router.
Entonces, un segundo al router; entonces uno al router tercero,
midiendo cada vez. Así que en teoría, estos tiempos serán cada vez más
o al menos muy cerca el uno del otro,
y, de hecho, los que están aquí en el campus son súper pequeño.
Tan pronto como empiece a ir al otro lado del país, se necesitan datos
un poco más de tiempo para viajar, más cercano a 100 ms, más o menos.
Pero vamos a ir en otra dirección ahora. ¿Qué hay de la Universidad de Cambridge en el Reino Unido?
Déjame en lugar de ejecutar traceroute www.cam de Cambridge,
. VCA durante académico, uk., Y pulsa enter aquí.
Eso fue muy muy rápido.
Mis datos literalmente se fue a Cambridge, Inglaterra, en esa fracción de segundo de tiempo.
>> Así que vamos a ver el camino que tomó.
Harvard, Harvard, Harvard, encrucijada del Norte,
que es un proveedor de Internet, y entonces este es encrucijada del Norte, y luego bam.
¿Qué hay entre los pasos 6 y 7, router 6 y 7?
El Océano Atlántico. Y estamos inferir esto por el hecho de que
vamos a partir de aquí a 20 ms 80 ms aquí.
Así que algo tuvo 60 ms, más o menos, de superar.
Y eso fue probablemente un gran cuerpo de agua.
¿Qué pasa después de eso? Bueno, aquí estamos en Londres,
sólo 88 ms después. More London, Londres más,
no sabe dónde es esto, pero vamos a suponer que está fuera de Londres,
Cambridge aquí, y por último -, literalmente, de la Universidad de Cambridge
. Something.net, y luego, finalmente, en la línea 16,
su servidor web está aparentemente llamado Scorpius
debajo de la capilla, a pesar de que lo conocemos como www.
Algo alucinante, creo. La primera vez que hice esto, es totalmente me dejó alucinado.
Desafortunadamente, Harvard bloquea este tipo de tráfico, típicamente, en la red.
Así que no puedes hacer es super fácil.
Darse cuenta, sin embargo, esto aquí es posible.
Está bien. Vamos a tomar nuestro hijo de 5 minutos de descanso aquí. Volveremos y bucear más profundamente.
Así que estamos de vuelta, y hemos de tipo deambulaban alrededor en algunas direcciones diferentes aquí.
Así que vamos a resumir exactamente lo que está pasando aquí.
Comenzamos la conversación hablando de este lenguaje llamado HTML.
Una vez más, no es un lenguaje de programación. Es sólo un lenguaje de marcas
que es en gran parte por la estética y la estructuración de los contenidos en forma de una página web.
Pero HTML, por lo tanto, necesita algún tipo de mecanismo
para viajar entre el navegador y el servidor.
HTML por lo tanto, una especie de paseos en la parte superior de esta otra lengua,
o más correctamente, un protocolo, conocido como HTTP.
>> Y HTTP, como lo hemos visto hasta ahora,
es una especie de análogo a esta convención humana de dar la mano.
Cuando un navegador quiere solicitar una página de un servidor,
manda que "conseguir" solicitud desde el navegador al servidor,
y el servidor responde con un número como 200, todo está bien,
así como el HTML o algún mal número como 404, no se encuentra el archivo.
Pero mientras tanto, HTTP en sí misma no es la Internet, per se.
HTTP es solo un servicio, una característica de la Internet
al igual que G es otro servicio de chat, al igual que el correo electrónico es otro servicio.
Hay todo tipo de cosas que se pueden hacer en Internet.
HTTP es una de esas aplicaciones.
Así que además de - HTTP está en la cima de otra cosa
que no mencionó por su nombre, es posible que haya oído hablar de por su nombre, TCP / IP.
Así que la historia nos dijeron que no se trata
cómo los datos viajan desde el punto a al punto b.
Y en este caso, vimos a un nivel muy bajo
router a router a router a router,
cómo los datos que realmente se transmitió.
Pero en el camino, se va a encontrar varios impedimentos.
Además de estos routers, hay cosas que se llaman servidores de seguridad en Internet,
y lo que los datos, tales como que se acaba de transmitir
de mí a Stanford, de mí a Cambridge,
se envía, a este nivel, algo que se llama una dirección IP.
Lo vimos hace un momento, y una dirección IP
es una dirección numérica de la w.x.y.z forma,
donde cada uno de ellos es entre, más o menos, 0 y 255,
aunque usted no puede usar todos esos números.
Pero cada uno de estos marcadores de posición es un número entre 0 y 255.
Así que una dirección IP estos días es de 32 bits.
>> Ahora, eso nos da cuántas posible las direcciones IP en el mundo?
Aproximadamente 4 mil millones, porque cada vez que estamos contando en potencias de 2
todo el camino hasta el 32 de algo, que por lo general nos da 4 millones de dólares.
Así que eso es un montón de direcciones IP, pero es posible que he leído,
o usted puede notar ahora en la prensa popular,
un impulso hacia una nueva versión de IP denominada IPv6.
En este momento estamos utilizando la versión 4.
En realidad no ha habido una versión de 5, estamos saltando a la derecha 6.
Versión 6 se va a utilizar 128 bits para las direcciones IP, que es el freaking enorme.
No debemos salir corriendo desde hace bastante tiempo,
pero hemos comenzado a quedarse sin direcciones IP versión 4,
porque todos tenemos cosas no sólo como ordenadores portátiles y de escritorio,
muchos de nosotros tenemos teléfonos, muchos de nosotros tenemos otros dispositivos
como TiVo y similares que tienen direcciones IP a sí mismos.
Harvard en sí tiene decenas de miles de ordenadores.
Así que el mundo está realmente quedando sin direcciones IP, por lo menos de esta forma.
Así que en los próximos años, se va a ver las direcciones
en sus propias computadoras probablemente cambian lentamente
como cada vez más empresas y universidades empiezan a apoyar la versión más reciente.
Sin embargo, una dirección IP no es suficiente para una computadora para solicitar datos de ordenador b.
Debido a que el equipo B podría ser un servidor,
y un servidor, como he mencionado antes, puede hacer manojos de cosas.
Se puede alojar páginas web, puede ser un servidor de correo electrónico,
que puede ser un servidor de Skype, puede ser un servidor de chat G.
>> Todos estos diferentes servicios que pueden ser proporcionados en un servidor
todo podría, físicamente, ser en la misma máquina.
Así que además de las direcciones IP,
el mundo tiene cosas que se llaman puertos en el Internet.
Un puerto es sólo un número, de modo que hay un número único para HTTP.
Su número es 80.
HTTP también utiliza el número 443, pero más específicamente, para HTTPS encriptados.
Siempre que vea el s, por seguro, que está usando un número diferente.
Hay otros números, como el 25, que se utiliza para algo llamado SMTP, también conocido como correo electrónico.
Hay algo llamado 22 para SSH,
y hay un montón de puertos que hay por ahí.
Ahora, nosotros los humanos rara vez se ve estos números.
Sin embargo, cuando se escribe en una dirección como http://www.facebook.com,
el navegador está secretamente insertar 80, porque usted está utilizando HTTP.
Si, en cambio, de tipo HTTPS, se inserta en secreto 443.
Y podemos ver este tipo de forma manual si me levanto a brower
e ir a http://www.facebook.com:80.
Por lo tanto no explícitamente citando sólo el nombre de la página web
pero el puerto que quiero hablar, y pulsa enter.
Tenga en cuenta que desaparezca, ya que el navegador asume,
oh, el 80, yo ni siquiera voy a molestar que muestra que a ti.
Pero la razón de esto es que si yo realmente quería enviar a alguien un correo electrónico,
Realmente se va a enviar a ellos en el puerto 25, que es SMTP.
Un poco de una simplificación excesiva, pero algunos de ustedes tienen amigos
que trabajan realmente en Facebook, y ellos, del mismo modo, dispone de servidores que reciben correo electrónico.
>> Cada vez que envíe un email, gmail lo está haciendo por usted
o Outlook o cualquier otro programa que utilice,
es una especie de secreto insertando ese número y, 25, en ese caso.
Es esta combinación de dirección IP y el número que identifica de forma exclusiva
una computadora conectada a Internet y un servicio específico en ese equipo.
Ahora, por supuesto, la mayoría de nosotros probablemente nunca han tecleado manualmente una dirección IP.
Tal vez usted tiene en el aparato, pero en el mundo real, no tanto.
¿Por qué no escribir las direcciones IP en los navegadores?
Se iba a funcionar, de hecho, podemos ver esto, deja que te enseñe
un otro comando que debería funcionar en casi cualquier lugar en el campus de Harvard, en un Mac o un PC.
Hay un comando llamado nslookup, el nombre del servidor de búsqueda.
Si miro hacia arriba www.cnn.com, resulta que la CNN tiene - oh, interesante.
CNN ha empezado a utilizar Amazon Web Services.
Usted puede saber de computación en la nube, uno de Amazon de los grandes jugadores en el cloud computing.
Lo que yo hice fue simplemente, me dijo: 'Dame la dirección del servidor web de la CNN, "
pero resulta que el servidor web de la CNN está gestionado por Amazon,
Amazon Web Services, esto sugiere.
Y la dirección de ese servidor es este aquí.
Así que no estoy seguro de si esto va a funcionar, porque no solía usar Amazonas.
Pero vamos a intentar esto, la dirección http://, IP, entrar, y -
se va a trabajar?
Sí. Se va a trabajar. Internet es súper lento hoy.
Pero, en un momento, verá una historia de noticias.
Ahí vamos. Bank of America está siendo demandado. Está bien.
>> Esto se debe a que esta dirección IP casualmente por sinónimo de www.cnn.com.
Por supuesto, sería comercialización horrible de decir, visítenos en la Web en 50.112.94.127.
Nunca lo recuerdo. Así que incluso hoy en día se puede recordar las cosas
como 1-800-COLLECT o mnemónicos el mundo se acercó con los números de teléfono.
Lo cual, antes de los teléfonos celulares, eran bastante difíciles de recordar
hasta que sólo podía escribir y olvidarse de él.
Así que la Web también tiene esta convención de nombres y direcciones IP,
y hay estas cosas por ahí llamados servidores DNS,
sistemas de nombres de dominio, servidores que traducen las direcciones IP en nombres y viceversa.
Así que eso es lo que pasa debajo del capó.
Al final, tenemos TCP / IP, que es este protocolo de nivel muy bajo
que, en realidad, sólo se pone 0 y 1 al otro lado de la Internet,
y lo hace mediante la puesta en un sobre virtual,
si se quiere, y escrito en la parte exterior del sobre
la dirección IP del destino, así como el número de puerto numérico
del servicio en ese destino que quiere hablar.
Mientras tanto, en el sobre también hay algo que se conoce como la dirección del remitente,
cual es su dirección IP, por lo que cuando CNN recibe un paquete de información de usted,
Se abre el sobre virtual, ve que usted desea la página principal,
conoce de la parte remitente de este envolvente virtual a quién enviar a la parte de atrás HTML.
Así que vamos a echar un vistazo a esto en detalle un poco más.
Esto es de una empresa llamada Ericson, desde hace unos años.
Y tomaron algunas libertades con la forma en la Internet realmente funciona,
pero pinta un cuadro mucho más visual que la tiza simple aquí.
Así que te doy "Un poco de la Internet".
>> [Narrador] Por primera vez en la historia,
las personas y las máquinas están trabajando juntos, realizando un sueño.
Una unión de fuerzas que no conoce límites geográficos.
Sin distinción de raza, credo o color.
Una nueva era donde la comunicación verdaderamente une a las personas.
Es
El amanecer de la red.
¿Quiere saber cómo funciona? Haga clic aquí para comenzar su viaje hacia la red.
Ahora, exactamente lo que sucedió cuando se hace clic en ese enlace?
Usted inicia un flujo de información.
Esta información viaja hacia abajo en su sala de correo personal
donde los paquetes IP que el señor, que califica, y lo envía en su camino.
Cada paquete es limitado en su tamaño.
La sala de correo debe decidir cómo dividir la información
y la forma de empaquetar.
Ahora, el paquete necesita una etiqueta que contiene información importante
tales como la dirección del remitente, la dirección del receptor, y el tipo de paquete que es.
Debido a que este paquete en particular va dirigido a Internet,
sino que también obtiene una dirección para el servidor proxy,
que tiene una función especial, como veremos más adelante.
El paquete es lanzado ahora en su red de área local o LAN.
Esta red se utiliza para conectar todos los equipos locales "
routers, impresoras, etcétera, para el intercambio de información dentro de las paredes físicas del edificio.
La LAN es un lugar nada controlado, y, por desgracia,
accidentes pueden ocurrir.
La carretera de la LAN está repleta de todo tipo de información.
Estos son los paquetes IP, Novell paquetes, paquetes AppleTalk.
Ellos van en contra del tráfico, como siempre.
El router local lee las direcciones y, si es necesario,
levanta el paquete a otra red.
Ah, el router. Un símbolo de control en un mundo aparentemente desorganizado.
[Router murmurando y hablando a sí mismo]
>> [Narrador] Ahí está, sistemático, desinteresado, metódico,
conservador, ya veces no del todo a la velocidad.
Pero al menos es exacto, en su mayor parte.
Cuando los paquetes dejan el ruteador, siguen su camino en el Internet de la empresa
y la cabeza para el interruptor de la fresadora.
Un poco más eficiente que el router, el Switch Ruteador trabaja rápido y suelta los paquetes IP,
hábilmente las rutas a lo largo de su camino.
A 'Pinball Wizard,' digital si se quiere.
[Interruptor Router hablándose a sí misma]
[Narrador] Cuando los paquetes llegan a su destino,
que están recogidos por la interfaz de red,
listo para ser enviado al siguiente nivel.
En este caso, el proxy.
El proxy es usado por muchas empresas como una especie de intermediario
con el fin de disminuir la carga en la conexión a Internet
y por razones de seguridad, también.
Como se puede ver, los paquetes son de varios tamaños, dependiendo de su contenido.
El proxy abre el paquete y busca la dirección web o URL.
Dependiendo de si la dirección es aceptable,
el paquete se envía a la Internet.
Hay, sin embargo, algunas direcciones que no cumplan con la aprobación del Proxy.
Es decir, directrices de la empresa o de gestión.
Estos son sumariamente tratado.
Vamos a tener nada de eso.
Para aquellos que lo hacen, está en el camino otra vez.
>> El siguiente, el servidor de seguridad.
El firewall de la empresa tiene dos propósitos.
Impide algunas cosas bastante desagradables en Internet entre en la Intranet,
y también puede evitar que la información confidencial de la empresa que se envíe a través de Internet.
Una vez a través del firewall, un router recoge cada paquete
y lo coloca en un camino mucho más estrecho o ancho de banda, como decimos.
Obviamente, el camino no es lo suficientemente amplio como para tener a todos.
Ahora, usted puede preguntarse qué pasa con todos esos paquetes que no logran recorrer todo el camino.
Pues bien, cuando el señor IP no recibe un acuse de recibo
que un paquete ha sido recibido en tiempo oportuno,
simplemente envía un paquete de reemplazo.
Ahora estamos listos para entrar en el mundo de Internet.
Una telaraña de redes interconectadas que abarcan nuestro globo entero.
Aquí, los routers y switches establecer vínculos entre las redes.
Ahora, la red es un ambiente completamente diferente de lo que encontrarás
dentro de los muros de protección de la red LAN.
Aquí fuera, es el salvaje oeste.
Un montón de espacio, un montón de oportunidades,
un montón de cosas para explorar y lugares para ir.
Gracias a la muy poco control y regulación,
nuevas ideas encuentran suelo fértil que empuja el desarrollo de sus posibilidades.
Pero debido a esta libertad, algunos peligros también acechan.
Nunca sabrás cuando te encontrarás con el ping temido a la muerte,
una versión especial del paquete Ping normal,
que algún idiota piensa desquiciar servidores insospechados.
La ruta de los paquetes pueden tomar puede ser vía satélite,
líneas telefónicas, inalámbricas, de cable o incluso transoceánico.
Ellos no siempre toman el camino más rápido o más corta posible,
pero van a llegar al final.
Tal vez por eso a veces se llama "The Wait mundial."
Pero cuando todo está funcionando sin problemas,
puede eludir el planeta cinco veces más en la caída de un sombrero, literalmente.
Y todo por el costo de una llamada local o menos.
Casi al final de nuestro destino, vamos a encontrar otro firewall.
>> Dependiendo de su punto de vista como un paquete de datos,
el firewall puede ser un resguardo de seguridad o un terrible adversario.
Todo depende de qué lado estás y cuáles son sus intenciones.
El servidor de seguridad está diseñado para dejar entrar solamente aquellos paquetes que cumplen con sus criterios de búsqueda.
Este firewall está operando en los puertos 80 y 25.
Todos los intentos de entrar a través de otros puertos están cerrados para los negocios.
El puerto 25 es usado para paquetes de correo,
mientras que el puerto 80 es la entrada de los paquetes a través de Internet al servidor web.
En el interior del servidor de seguridad, los paquetes son filtrados mas concienzudamente.
Algunos paquetes que pasan fácilmente por la aduana,
mientras que otros se ven mas bien dudosos.
Ahora, el oficial de firewall no es fácil de engañar,
por ejemplo, cuando este paquete Ping de la muerte trata de hacerse pasar un paquete Ping normal.
[Oficial Firewall hablando con paquetes]
[Narrador] Para aquellos paquetes que tuvieron la suerte de llegar hasta aquí,
el viaje está por terminar.
Es sólo una línea hacia arriba en la interfaz que deben abordarse en el servidor web.
Hoy en día, un servidor web se puede ejecutar en muchas cosas,
desde una computadora central a una web cam en el ordenador en su escritorio.
¿Por qué no tu refrigerador?
Con la configuración adecuada, usted puede averiguar si usted tiene los ingredientes
para Chicken Cacciatore, o si tienes que ir de compras.
Recuerde, este es el amanecer de la red.
Casi todo es posible.
Uno a uno, los paquetes son recibidos,
abierto, y desempaquetado.
La información que contienen, es decir, su solicitud de información,
se envía a la aplicación de servidor web.
El propio paquete es reciclado,
listo para ser utilizado de nuevo, y lleno de la información solicitada,
abordados, y envió en su camino de regreso a ti.
Regresa por el cortafuegos, routers, ya través de la Internet.
Volver través del firewall corporativo
y en su interfaz,
listo para el suministro de su navegador web con la información que has solicitado.
Es decir, esta película.
Satisfecho con su esfuerzo, y confiar en un mundo mejor,
los paquetes de datos fieles cabalgar hacia el atardecer felizmente de otro día,
sabiendo plenamente que han servido bien a sus amos.
Ahora, no es que un final feliz?
[Malan] Bueno, ya es suficiente. Nos vemos la semana que viene.
[CS50.TV]