Introducción a la Web.

Notas del curso:
Técnicas para la enseñanza de
D esarrollo W eb
Liliana G utiérrez Flores
Enero de 2016
El objetivo de la asignatura Desarrollo Web es que el alumno desarrolle
aplicaciones W eb , incluyendo aplicaciones con acceso a bases de datos. Los
temas se enumeran a continuación, entre paréntesis se anota el lenguaje acordado a
utilizar para el semestre 2016-II en la junta de materia de noviembre de 2015.
Temas:
1.
2.
3.
4.
5.
6.
Introducción.
HTML
CSS
JavaScript.
PHP y mySQL.
Servicios Web.
1. Introducción.
1.1. Internet y la W eb.
Internet es un sistema global de redes de computadoras interconectadas que
intercambian datos utilizando la Suite de Protocolos de Internet (TCP/IP). Por su
parte la World Wide Web (WWW o simplemente la Web), de acuerdo a la
definición d la W3C (World Wide Web Consortium), es un espacio de
información en el cual los objetos de interés, referidos como recursos, son
identificados por identificadores globales llamados URI (Uniform Resource
Identifiers[1].
1.2. A rquitectura de la W eb.
El World Wide Web Consortium (W3C) es una comunidad internacional
integrada por varias organizaciones, que cuenta con personal de tiempo completo y
que se apoya del trabajo del público en general para el desarrollo estándares de la
Web. El W3C, dirigida por Tim Berners-Lee (el inventor de la Web) y CEOJeffrey
Jaffe, tiene la misión llevar a la Web al máximo de su potencial [2]. La actividad
principal de la de W3C es el desarrollo de protocolos y guías para asegurar el
crecimiento a largo plazo de la Web. El proceso para desarrollar las especificaciones
técnicas y guías, está diseñado para maximizar el consenso en relación al contenido
técnico y asegurar la máxima calidad técnica y editorial.
De acuerdo a la recomendación técnica de la W3C Architecture of the
W orld W ide W eb del 2004 [1], la arquitectura de la Web incluye: (i)
identificación de recursos, (ii) representación de recursos y (iii) protocolos para la
interacción entre agentes y recursos. Las personas o software que interactúan en
este espacio de información, por ejemplo usuarios, servidores o browsers se conocen
como Agentes Web.
1.2.1. Identificación de recursos: U R I, U R L.
Los Uniform Resource Identifiers (URI) son una piedra angular de la
arquitectura Web, proporcionan una identificación para los recursos que es común
en toda la Web. Una URI identifica un sólo recurso y cada recurso debe tener una
URI. El término recurso es utilizado en un sentido general para cualquier cosa que
pueda ser identificada por una URI; por ejemplo http://www.w3.org/. El "http"
que aparece antes de los dos puntos es el esquema del URI. Hay diferentes
esquemas y cada uno tiene una especificación que define el mecanismo por el cual
los identificadores son asociados con un recurso, por ejemplo el esquema "http"
utiliza servidores DNS y HTTP para identificar y resolver el recurso. Otros
ejemplos de URI´s son mailto:[email protected], ftp://example.org/aDirectory/aFile
y
news:comp.infosystems.www.
La Internet Assigned Numbers Authority (IANA) es responsable de
responsable de coordinar elementos clave que mantienen el funcionamiento de
Internet sin problemas. Mantiene un registro de los esquemas URI y sus
especificaciones [3].
Una URI puede ser clasificada como de localización o de nombre. El término
URL (Uniform Resource Locator) se refiere al subconjunto de URI además de
identificar el recurso, proporcionan mecanismos de localización del recurso
mediante la descripción de su mecanismo de acceso, por ejemplo su localización en
la red. Una URI http es una URL, la sintaxis de muestra a continuación:
http:// host [ ":" port ] path [ "?" query ] [ "#" fragment ]
El host identifica el servidor con el que se establecerá la comunicación, port
indica el puerto (protocolo basado en socket), el puerto por omisión para acceder a
los servicios http es el puerto 80 y no es necesario especificarlo, el path es la
ubicación del recurso, query se utiliza para el paso de datos adicionales y fragment
contiene información para un acceder a una porción o subconjunto del recurso.
1.2.2. Protocolo H TTP .
Muchos esquemas URI definen un protocolo de interacción para acceder al
recurso identificado (por omisión). Los protocolos de la Web están basados en el
intercambio de mensajes, que incluyen datos y metadatos del recurso.
HTTP es un protocolo a nivel de aplicación para sistemas de información de
hipertexto distribuidos y colaborativos; se basa en el paradigma solicitud-respuesta
que define la arquitectura cliente/servidor y se basa en TCP/IP (protocolos de
transporte y red de Internet), los servidores HTTP se quedan en escucha de
peticiones en un puerto (por defecto el 80). Un cliente (navegador en este caso)
establece conexiones con el propósito de enviar peticiones. Un servidor acepta las
conexiones y atiende las peticiones.
Al igual que otros protocolos de la Web es orientado a mensajes, el protocolo
HTTP define la semántica de los mensajes de solicitud, encabezados de archivos,
códigos de estatus de respuestas y encabezados de respuestas y los mecanismos
para la negociación de los contenidos. HTTP es un protocolo sin estado, es decir no
guarda ningún tipo de información sobre las conexiones realizadas con anterioridad;
utiliza tipos MIME (Multipart Internet Mail Extension) que proporcionan una
representación de los datos extensible y permiten que la comunicación entre
clientes y servidores esté abierta a negociación.
Según la especificación del protocolo, un mensaje es la unidad básica de la
comunicación HTTP y consiste de una secuencia estructurada de octetos ordenados
con formato válido y transmitido por la conexión. Hay dos tipos de mensajes,
petición o solicitud (Request) y respuesta (Response), cada uno con su estructura.
Un mensaje de solicitud contiene una línea de petición, cero o más líneas de
encabezado y el cuerpo del mensaje. La línea de petición incluye uno de los
métodos del protocolo, el URI y la versión del protocolo. Los métodos indican al
servidor que se debe hacer con la URI, los más utilizados son GET, HEAD, POST
y PUT. Por ejemplo GET http://www.unam.mx/index.html/ HTTP/1.0 en
una línea de petición utilizando el método GET. Por su parte las líneas de
encabezado permiten aportar información adicional sobre la solicitud, cada una de
las líneas está formada por un nombre que describe el tipo de encabezado, seguido
de dos puntos (:) y el valor del encabezado, HTTP 1.1 especifica 46 tipos de
encabezado (por ejemplo Server: Content-Type: ), consulte una lista de
encabezados en [4].
HTTP GET se utiliza para obtener una representación de un recurso, por su
parte HTTP HEAD obtiene toda la información del recurso pero sin el cuerpo;
HTTP POST o PUT se utilizan para cambiar el estado actual del recurso y HTTP
DELETE para eliminar representaciones del recurso.
Utilizando HTTP GET tenemos los beneficios del direccionamiento de la URI
(URI addressability) es decir que la URI en sí misma es suficiente para que un
agente pueda utilizarla para interactuar con el recurso. Con HTTP POST
intentamos cambiar el estado del recurso con información en los encabezados y no
en la propia URI.
Un mensaje de respuesta contiene la versión, el código y una descripción.
Ejemplos típicos de mensajes de repuesta son: 200 OK, 301 Moved
Permanently, 400 Request Bad, 404 File Not Found.
1.2.3. R epresentación de un recurso.
La representación de un recurso es un conjunto de datos que contienen la
información de la representación del estado del recurso. Los agentes (navegadores)
utilizan la URI para acceder a una representación al recurso referenciado, este
proceso se conoce como de-referenciar el recurso. El navegador analiza la URI y
determina que el esquema es http; abre una conexión de red por el puerto 80 al
servidor y envía un mensaje de solicitud tipo GET, tal como lo indica el protocolo
HTTP, para solicitar la representación del recurso. El servidor interpreta el
encabezado de la solicitud y envía un mensaje de repuesta al navegador, éste lee los
encabezados del mensaje e identifica el tipo de representación. En particular en
encabezado Content-type utiliza tipos registrados llamados MIME types (conocidos
como Media Types), que se especifican de la forma tipo/subtipo (por ejemplo
text/html e image/png), para que la especificación del formato del recurso,
esto implica un acuerdo para la correcta interpretación del recurso.
HTML son las siglas de HyperText Markup Language, es un lenguaje de
marcado de hipertexto utilizado para crear páginas Web. Una página Web es un
tipo de recurso de la WWW, es un documento electrónico capaz de contener texto,
sonido, video e imágenes; es accesible desde un navegador de Internet mediante el
URI. Un sitio Web normalmente está compuesto de varias páginas Web.
Una de las características que definen los documentos a la Web es el uso de
hipertexto, es decir que permite referencias a otros recursos a través del URI, estas
referencias pueden ser absolutas o relativas, por ejemplo:
<a href="http://www.example.com/foo"> es una referencia absoluta, por
su parte <a href="foo"> y <a href="foo#anchor"> son relativas.
1.3 Ortogonalidad de las especificaciones.
Los
tres
elementos
básicos
de
la
arquitectura:
Identificación,
interacción y representación son conceptos ortogonales, esto significa que las
tecnologías utilizadas para identificación, interacción y representación pueden
evolucionar independientemente. Cuando dos especificaciones son ortogonales, los
cambios en una no representan cambios en la otra, aun cuando están relacionadas;
la ortogonalidad incrementa la flexibilidad y evolución de la Web.
Referencias:
D ocum entación de la W eb:
[1] http://www.w3.org/Consortium/Help/ Acerca del W3C.
[2] http://www.w3.org/TR/webarch/ Architecture of the World Wide Web,
Volume One, W3C Recommendation, 15 December 2004.
[3] http://www.iana.org/assignments/uri-schemes/uri-schemes.xhtml#uri-schemes1 Uniform Resource Identifier (URI) Schemes.
[4] https://tools.ietf.org/html/rfc7231#section-3.1.1.1 Hypertext Transfer Protocol
(HTTP/1.1): Semantics and Content
[5] http://tools.ietf.org/html/rfc3986#section-3.2 Uniform Resource Identifier
(URI): Generic Syntax
[6] https://www.w3.org/TR/url/ URL W3C Working Draft.
[7] https://url.spec.whatwg.org/ URL Living Standard.
[8] http://www.iana.org/assignments/media-types/media-types.xhtml Media types.
[9] https://www.w3.org/2001/tag/doc/whenToUseGet.html URIs, Addressability,
and the use of HTTP GET and POST
D escargas de herram ientas:
https://notepad-plus-plus.org/