Internet/WWW

Internet

• Wikipedia: http://en.wikipedia.org/wiki/Internet
• conexión de redes de ordenadores que usan el Protocolo Internet (IP)
• capas de protocolos de comunicación: IP → TCP/UDP → HTTP/FTP/POP/SMTP/SSH...
• ¿Cuál es la diferencia entre Internet y la World Wide Web (WWW)?

Breve historia

• empezó como una red del US Department of Defense llamado ARPANET (1960s-70s)
• servicios iniciales: electronic mail, file transfer
• abierto a intereses comerciales a finales de los 80s
• creación de WWW en 1989-91 por Tim Berners-Lee
• navegadores web populares ofertados: Netscape 1994, IE 1995
• Amazon.com abre en 1995; Google January 1996
• página web Hamster Dance creada en 1999
• La Evolución de la Web

Aspectos clave de Internet

• las subredes pueden valerse por sí mismas
• los ordenadores se pueden unir y abandonar la red de forma dinámica
• construído sobre estándares abiertos, cualquiera puede crear un nuevo dispositivo Internet
• falta de control centralizado (la mayoría)
• se puede utilizar con un software sencillo y comúnmente disponible

Componentes de Internet

Internet

Piezas

• Internet: "red de redes"
  • ISPs interconectados
• protocolos que controlan el envío, recepción de mensajes
  • p.e. TCP, IP, HTTP, FTP, SMTP, 802.11
• estándares de Internet
  • RFC: Request for comments
  • IETF: Internet Engineering Task Force

Vista servicio

• Infraestructura que proporciona servicios a aplicaciones:
  • Web, VoIP, email, games, e-commerce, redes sociales, ...
• proporciona interfaz de programación a aplicaciones
  • soportes que permiten a los programas de aplicaciones de envío y recepción a "conectarse" a Internet
  • proporciona opciones de servicio, similar al servicio postal

Arquitectura de comunicación

• En redes y comunicaciones entre ordenadores resultan fundamentales dos conceptos: Protocolos y Arquitectura de comunicación
• Los protocolos se utilizan para la comunicación entre entidades de diferentes sistemas.
  • ejemplo de sistemas son ordenadores, terminales y sensores remotos
  • una entidad es algo capaz de enviar o de recibir información y un sistema es un objeto que contiene una o más entidades
  • un protocolo puede definirse como el conjunto de reglas que gobiernan el intercambio de datos entre 2 entidades.

Arquitectura de comunicación: Modelo OSI

• Modelo de referencia para la Interconexión de Sistemas Abiertos
  • marco de referencia para definir estándares que permitan comunicar ordenadores heterogéneos. Adoptado en 1983.
• Características:
  • define una arquitectura de comunicación estructurada en siete niveles verticales.
  • Cada nivel ejecuta un subconjunto de las funciones que se requieren para comunicar con el otro sistema.
  • Cada nivel se apoya en los servicios que le ofrece el nivel inmediato inferior y ofrece sus servicios al nivel que está por encima de él.
  • Idealmente, los cambios que se realicen en un nivel no deberían afectar a su nivel vecino mientras ni se modifiquen los servicios que le ofrece.

Arquitectura en capas

Internet usa una arquitectura en capas de hardware/software (llamada "modelo OSI"):

• capa física: dispositivos como ethernet, cable coaxial, líneas de fibra óptica, modems
• capa enlace datos: protocolos básicos hardware (ethernet, wifi, DSL PPP)
• capa red / internet : protocolo básico software (IP)
• capa de transporte : añade fiabilidad a la capa de red (TCP, UDP)
• capa de aplicación: implementa la comunicación específica para cada tipo de programa (HTTP, POP3/IMAP, SSH, FTP)

El modelo TCP/IP

• su diseño responde a criterios de fiabilidad en tanto que la red sea capaz de sobrevivir a la pérdida del hardware de subred
• la arquitectura de la capa de aplicación puede ser:
  • cliente-servidor
  • peer-to-peer (P2P)

Protocolos en TCP/IP

• la pila TCP/IP incluye protocolos de aplicación tales como:
  • TELNET para el acceso interactivo de una terminal a un host remoto
  • FTP ("File Transfer Protocol") para transferencias de alta velocidad de un disco a otro
  • SMTP ("simple mail transfer protocol") como sistema de correo de Internet
  • SNMP ("simple network management protocol") permite gestionar redes TCP/IP
  • DNS
  • HTTP
• comandos de diagnóstico de red en Windows

Arquitectura Cliente - Servidor

• Servidor
  • equipo con el recurso
  • dirección IP permanente
• Cliente
  • solicita el recurso
  • comunica con el servidor
  • puede tener dirección IP dinámica

Arquitectura P2P

• no siempre en servidor; comunicación directa entre puntos arbitrarios
• Los puntos solicitan servicio desde otros puntos y suministran servicio en devolución a otros puntos
  • auto escalabilidad - nuevos puntos aportan nueva capacidad de servicio, así como nuevas demandas de servicio
• Los puntos se conectan intermitentemente y cambian de dirección IP
  • administración compleja

Organizaciones y Normas

• Internet Engineering Task Force (IETF): estándares del protocolo internet
• Internet Corporation for Assigned Names and Numbers (ICANN): decide nivel superior de nombres de dominios
• World Wide Web Consortium (W3C): estándares web

Internet Protocol (IP)

• protocolo simple para enviar datos entre dos ordenadores
• en IPv4 cada dispositivo tiene una dirección de 32-bits escrita como cuatro bytes o números de 8-bit (0-255)
  
• para averiguar la dirección IP local:
  • via Web: whatismyip.com
  • en un terminal, escribir: ipconfig (Windows) o ifconfig (Mac/Linux)
  • dirección especial: 127.0.0.1 (localhost), sirve para probar el funcionamiento de TCP/IP
• la nueva especificación IPv6 consta de un direccionamiento de 128-bits escrita como 8 grupos de números hexadecimales.
  • ejemplo: 2001:0db8:85a3:08d3:1319:8a2e:0370:7334

Transmission Control Protocol (TCP)

• añade multiplexado, garantizando la entrega de mensajes encima de IP
• multiplexación: múltiples programas usan la misma dirección IP
  • puerto: número dado a cada programa o servicio
  • puerto 80: navegador web (puerto 443 para navegación segura)
  • puerto 25: email
  • puerto 22: ssh
  • puerto 5190: Mensajería Instantánea AOL
  • más puertos comunes
• algunos programas (juegos, streaming media) usan un protocolo simple UDP en lugar de TCP

Domain Name System (DNS)

• conjunto de servidores que asocian nombres a direcciones IP
  • Ejemplos: web.unican.es → 193.144.193.64
  •                   www.rediris.es → 130.206.13.20
  • el comando: nslookup nombre_servidor permite obtener tal asociación
• muchos sistemas mantienen una caché local llamado hosts file
  • Windows: C:\Windows\system32\drivers\etc\hosts
  • Mac: /private/etc/hosts
  • Linux: /etc/hosts

Uniform Resource Locator (URL)

• identificador para la localización de un documento en un sitio web (web site)
• URL básico:

  
  http://personales.unican.es/corcuerp/sistinf/bibliografia.html
  ~~~~   ~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  protocolo    host                path
  

• al especificar este URL en el navegador, haría:
  • preguntar al servidor DNS por la dirección IP de personales.unican.es
  • conectar con la dirección IP en el puerto 80
  • solicitar al servidor GET /corcuerp/sistinf/bibliografia.html
  • mostrar la página resultante en la ventana del navegador
• https (Hypertext Transport Protocol Secure):
  • utiliza un cifrado basado en la seguridad de textos SSL/TLS para crear un canal cifrado (depende del servidor y del navegador)
  • utiliza el puerto 443 por defecto

https://personales.unican.es/corcuerp/sistinf/
~~~~~   ~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~
protocolo    host                path

Más sobre URLs

• anchor: salta a una sección dada de una página web

  
  https://personales.unican.es/corcuerp/ingweb/slides/2_html.html#slide89
  

  • busca 2_html.html y salta a la parte de la página etiquetada slide89
• port: para servidores web en puertos distintos que el asignado por defecto 80

  http://www.asnt.org:8080/Test.html
  

• query string: conjunto de parámetros pasados a un programa web

  http://www.google.com/search?q=miserable+failure&start=10
  

  • parámetro q asignado a "miserable+failure"
  • parámetro start asignado a 10

Web y HTTP

• una página web consiste de objetos
• un objeto puede ser un fichero HTML, imagen JPEG, script JavaScript, fichero de audio, ...
• una página web consiste de un fichero base HTML que incluye varios objetos referenciados
• cada objeto es direccionado por una URL

Servidores Web y Navegadores

• servidor web: programa que acepta (escucha) las peticiones de páginas web
  • Apache
  • Microsoft Internet Information Server (IIS) (parte del SO Windows)
  • NGINX
• navegador web: recoge/muestra los documentos enviados por servidores web
  • Mozilla Firefox
  • Microsoft Internet Explorer (IE)/Edge
  • Google Chrome
  • Apple Safari
  • Opera

Servicio HTTP

• El servicio HTTP es un servicio basado en el modelo cliente-servidor sobre Internet, donde el cliente es un navegador Web y el servidor es un servidor Web
• ambos utilizan para su entendimiento el protocolo de aplicación HTTP (Hypertext Transfer Protocol)
• el servidor Web se configura, por defecto, para escuchar solicitudes en el puerto 80
• el recurso que se ofrece lo constituyen documentos de texto denominados páginas HTML (lenguaje empleado para su codificación)
• al ser un protocolo petición/respuesta, el servidor no mantiene información de peticiones anteriores del cliente

HyperText Transport Protocol (HTTP)

• protocolo de aplicación, basado en texto y del tipo solicitud-respuesta
• consiste en un conjunto de métodos enviados desde un navegador y aceptados por un servidor web
• Sintaxis del formato de una solicitud HTTP:

  <Método HTTP>  <URI>  <Protocolo>
  <Cabecera>
  <Línea en blanco>
  [<Cuerpo>]
  

• donde:
  • Método HTTP indica la acción que se solicita al servidor (p.e. GET, POST, PUT)
  • URI (Uniform Resource Identifier) es la forma normalizada de referenciar un recurso. Es parte de la URL que incluye el tipo de servicio, la dirección del servidor y el puerto
  • Protocolo indica el nombre y versión del protocolo que espera el cliente
  • Cabecera sirve para indicar diferentes parámetros que modifican la forma en que se realiza la solicitud o respuesta. Finaliza con una línea en blanco. El formato de cada parámetro es:
    <etiqueta>: <valor>\r\n
  • Cuerpo es opcional y permite enviar información adicional junto con la solicitud

Métodos de HTTP

• algunos de los principales métodos HTTP (el navegador los envia internamente) son:
  • HEAD : solicita la cabecera del recurso referenciado
  • GET  : solicita un recurso mediante una URI
  • POST : solicita un recurso y pasa información en el cuerpo de la solicitud
  • PUT  : solicita que el servidor almacene la información enviada con el nombre indicado en la URI
• lista completa de métodos de HTTP
• simulación de un navegador web desde una ventana terminal:

  $ telnet web.unican.es 80
  Trying 128.208.3.88...
  Connected to 128.208.3.88 (128.208.3.88).
  Escape character is '^]'.
  GET /index.html
  
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 ...">
  <html>
  ...
  

Códigos de error HTTP

• cuando algo va mal, el servidor web retorna un "código de error" al navegador, consistente en un número especial, posiblemente seguido de un documento HTML
• códigos de error comunes:

  Number	Meaning
  200	OK
  301-303	página movida(permanentemente o temporalmente)
  403	acceso prohibido a esta página
  404	página no encontrada
  500	error interno del servidor
  lista completa

Representación MIME

• MIME(Multipurpose Internet Mail Extension) es un mecanismo de representación de datos
• los recursos incluídos en páginas HTML que no son de tipo texto (fichero gráfico, video, sonido) deben ser convertidos de un formato binario a texto, siendo necesario especificar su tipo
• cada tipo MIME consiste de un tipo de categoría amplia y un subtipo separado por una barra /

  tipo MIME	sufijo fichero
  text/html	.html
  text/plain	.txt
  image/gif	.gif
  image/jpeg	.jpg
  video/quicktime	.mov
  application/octet-stream	.exe

• Lista de tipos MIME

Lenguajes/Tecnologías Web

• Hypertext Markup Language (HTML): usado para escribir páginas web
• Cascading Style Sheets (CSS): información del estilo para páginas web
• Javascript (lado cliente) : añade interactividad a las páginas web
• PHP Hypertext Processor (PHP): creación dinámica de páginas en un servidor web
• eXtensible Markup Language (XML): metalenguaje para organizar datos
• Asynchronous JavaScript and XML (Ajax): acceso de datos para aplicaciones web
• JavaScript Object Notation (JSON): formato de fichero para organizar datos legibles por humanos
• REST APIs (lado cliente): servicios web que gestionan y responden a las solicitudes de los clientes en el servidor
• Structured Query Language (SQL): interacción con bases de datos

Herramientas para desarrollo web

• Editores: Brackets
• Chrome DevTools
• Firefox Developer Tools

Referencias

• Web Programming Step by Step, 2 ed., Jessica Miller, Victoria Kirst, Marty Stepp. Lulu. 2012
• Herramientas Web para la enseñanza de protocolos de comunicación
• Web Protocols basics
• Computer Networking: a top-down approach, 6 ed., F. Kurose, K. Ross, Addison-Wesley, 2012
• Internet & World Wide Web How to Program, , H. Deitel, P. Deitel, Pearson