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:joe@example.org, 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/