Você está na página 1de 254

INSTITUTO TECNOLOGICO SUPERIOR DE COATZACOALCOS

Antologa de la materia de:

PROGRAMACION ENTORNO WEB

Licenciatura en Informtica

Antlogos: L.S.C. Israel Castellano Reyes I.S.C. y M.T.I Carlos Daniel Olvera Aguirre

Coatzacoalcos, Ver. 2010

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

INTRODUCCION La asignatura Programacin Entorno Web, busca que los estudiantes que cursan la Licenciatura en Informtica, comprenda las caractersticas de una aplicacin Web y conozca los elementos que interactan con ella. De esta manera comprender los conceptos y elementos bsicos que involucra el desarrollo de aplicaciones Web.

El estudiante pondr en prctica los conocimientos del servidor con acceso a base de datos y los mdulos del lado de cliente, Integrando los Servicios Web XML al desarrollo de aplicaciones. Programacin Entorno Web presenta una estructura de cinco unidades, logrando que el alumno, de manera progresiva, incremente su nivel de programacin. En la primera unidad llamada Introduccin a las tecnologas Web se aborda aspectos tericos que permitan la comprensin de la perspectiva histrica del

Internet conociendo el protocolo de transferencia de hipertexto, tomando en cuenta la arquitectura del WWW , URLs, mtodos HTTP y persistencia en HTTP Cookies, abarcando lo que es HTML como un tipo SGML, los elementos, tablas, formularios en HTML, comprendiendo la evolucin del desarrollo de aplicaciones Web y el

manejo de hojas

de estilo en cascada, de esta manera lograr que el alumno tenga conceptos fundamentales para la creacin y utilizacin de las tecnologas web a nivel profesional.

En esta segunda unidad nos habla del desarrollo de aplicaciones Web en el cual se estudiara la arquitectura de las aplicaciones Web, acompaada de los tipos de lenguajes de programacin del lado del cliente/servidor, dando las herramientas

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

necesarias para la aplicacin del ambiente y utilizando metodologas en los aspectos de seguridad.

En la tercera unidad entramos a lo que es la programacin y procesamientos del lado del servidor, tomando en cuenta los fundamentos bsicos de la herramienta de desarrollo, el adecuado uso de los operadores segn su categora, la utilizacin de las sentencias como de los posibles arreglos que podemos utilizar al programar, la definicin de cada una de las funciones y libreras para tener un pleno conocimiento de la utilizacin cuando a este le corresponda.

En la cuarta unidad es cuando el alumno pone en prctica sus conocimientos para realizar el procesamiento del lado cliente, utilizando los lenguajes script del cliente, estos lenguajes se utilizan fundamentalmente para hacer ms atractivos los interfaces, los modelos de objetos son propiedades y los mtodos que estn

definidos en la clase del objeto, sabiendo ya, lo que es la programacin orientada a objetos vamos a introducirnos en el manejo de objetos en Java script, de esta manera, la interaccin con el usuario se consigue mediante la captura de los eventos que ste produce, los formularios representan una forma rpida y eficaz de enviar informacin desde el ordenador del usuario hasta el servidor web y

Cuando se est creando una web o simplemente un script, es muy recomendable intentar hacerlo lo ms compatible que se pueda a los distintos navegadores existentes.

En la quinta unidad se refieres a los servicio Web XML que es una coleccin de protocolos y estndares empleados para intercambiar datos entre aplicaciones y sistemas, utilizando las tecnologas subyacentes como son SOAP que es fundamentalmente un paradigma de intercambio de mensajes en un slo sentido, WSDL describe la interfaz pblica a los servicios Web. Est basado en XML y

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

describe la forma de comunicacin, es decir, los requisitos del protocolo y los formatos de los mensajes necesarios para interactuar con los servicios listados en su catlogo, y no puede faltar UDDI es uno de los estndares bsicos de los servicios Web cuyo objetivo es ser accedido por los mensajes SOAP y dar paso a documentos WSDL, en los que se describen los requisitos del protocolo y los formatos del mensaje solicitado para interactuar con los servicios Web del catlogo de registros.

El descubrimiento de servicios web es el proceso de localizar e interrogar descripciones de servicios web, que son un paso preliminar para tener acceso a un servicio web. A travs del proceso de descubrimiento, los clientes de servicios web pueden obtener informacin en tiempo de diseo de la existencia de un servicio web, cules son sus funciones y cmo interactuar correctamente con l.

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

INDICE INTRODUCCIN.. JUSTIFICACIN... OBJETIVO GENERAL. UNIDAD I. INTRODUCCIN A LAS TECNOLOGAS WEB. 1.1 Perspectiva histrica del Internet. 1.2 Protocolo http (protocolo de transferencia de hipertexto) 1.2.1 Arquitectura del WWW 1.2.2 URLs. 1.2.3 Mtodos htt. Persistencia en http Cookies 1.3 Introduccin al HTML. Lenguaje de despliegue del web. 1.3.1 HTML como un tipo SGML. 1.3.2 Elementos del lenguaje HTML.. 1.3.3 Tablas en HTML.. 1.3.4 Formularios.. 1.4 Evolucin del desarrollo de aplicaciones Web.. 1.5 Hojas de estilo en cascada e introduccin al XML 77 78 101 105 110 119 2 8 9

10 14 38 45 55

UNIDAD II. DESARROLLO DE APLICACIONES WEB 2.1 Arquitectura de las aplicaciones Web. 2.2 Lenguajes de programacin del lado del cliente... 2.3 Lenguajes de programacin del lado del servidor. 2.4 Ambientes para el desarrollo de aplicaciones

Web.. 2.5 Metodologas para el desarrollo de aplicaciones Web. 2.6 Aspectos de seguridad.. 134 138 141 144 149 153

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

UNIDAD III. PROGRAMACIN DEL LADO DEL SERVIDOR. 3.1 Procesamiento del lado del servidor 3.2 Conceptos bsicos de la herramienta de desarrollo. 3.3 Operadores.. 3.4 Sentencias 3.5 Arreglos 3.6 Funciones y libreras.. 3.7 Ejemplos prcticos.. 3.8 Procesado de formularios. 3.9 Sesiones... 3.10 Conectividad entre el servidor Web y el servidor de base de datos 3.11 Manejo de archivos.. 3.12 Seguridad

159 161 166 180 194 217 221 225 231 237 251 261

UNIDAD IV. PROCESAMIENTO DEL LADO DEL CLIENTE.

4.1 Lenguaje Script del cliente 4.2 Modelo de objetos con lenguaje Script 4.3 Objetos lenguaje Script nter construidos... 4.4 Eventos con lenguaje Script.. 4.5 Validacin de entrada de datos del lado del cliente.. 4.6 Consideraciones del soporte del navegador..

272 273 274 289 299 312

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

UNIDAD V. SERVICIOS WEB XML.

5.1 Visin general de servicios Web XML. 5.2 Tecnologas subyacentes.. 5.2.1 SOAP. 5.2.2 WSDL 5.2.3 UDDI.. 5.3 Publicacin de un servicio WEB... 5.4 Consumo de un servicio WEB. CONCLUSIONES. FUENTES CONSULTADAS..

315 316 316 317 318 318 320 325 326

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

JUSTIFICACION La presente antologa fue realizada con la intencin didctica de proporcionar a los alumnos que cursan la materia de Programacin Entorno Web, material terico de apoyo que les permita consultar en todo momento los temas que se abordan en la asignatura, permitiendo al docente enfocarse ms en aspectos tcnicos prcticos y despreocupndose de la teora que se debe proporcionar durante el semestre.

De esta manera, la creacin de esta antologa es de gran beneficio tanto para alumnos como para los docentes, ya que incluye informacin importante para la formacin del aspirante como desarrollador profesional.

En la actualidad la programacin web es muy importante a nivel empresarial, ya que busca ofrecer calidad a los servicios, innovando y mejorando herramientas de trabajo, de esta manera asegurar a los clientes respuestas inmediatas teniendo como resultado la total satisfaccin a sus necesidades. Por ellos se requiere la necesidad de conocer los lenguajes de programacin como HTML, PHP, XML y GSML, el cual sern abordados en esta antologa.

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

IX

OBJETIVO GENERALES Conocer conceptos de comunicacin de Internet, y desarrollar aplicaciones de base de datos basadas en Web desde el lado del servidor y del cliente.

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

UNIDAD I: INTRODUCCIN A LAS TECNOLOGAS WEB Objetivo: El estudiante comprender las caractersticas de una aplicacin Web y conocer los elementos que interactan con ella. 1.1 Perspectiva histrica del Internet. Internet es una red integrada por miles de redes y computadoras interconectadas en todo el mundo mediante cables y seales de telecomunicaciones, que utilizan una tecnologa comn para la transferencia de datos. El protocolo de comunicaciones que utiliza Internet se denomina TCP/IP (Transmision Transmisin. Historia Despus de la Segunda Guerra Mundial comenz un perodo denominado Guerra Fra, en el cual los pases se dividieron en dos bloques en constante pugna por militares y conquistar espacios dentro y fuera del planeta. Por un lado, Estados Unidos y sus aliados en Amrica y Europa y, por el otro, la Unin de Repblicas Soviticas Socialistas (URSS) y sus aliados comunistas en otros continentes. En 1958 suceden dos importantes eventos en esa carrera armamentista: Rusia lanza su primer satlite artificial, el Sputnik, y el Departamento de Defensa de los Estados Unidos crea la Advanced Research Projects Agency (ARPA), con la idea de hacer de ese pas un lder en tecnologa militar. Esta agencia posteriormente se llamara DARPA. Control Protocol/Internet Protocolo) Protocolo de Control de

10

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

En primer lugar, el proyecto contemplaba la eliminacin de cualquier "autoridad central", ya que sera el primer blanco en caso de un ataque; en este sentido, se pens en una red descentralizada y diseada para operar en situaciones difciles. Cada mquina conectada debera tener el mismo status y la misma capacidad para mandar y recibir informacin. El envo de los datos debera descansar en un mecanismo que pudiera manejar la destruccin parcial de la Red. Se decidi entonces que los mensajes deberan de dividirse en pequeas porciones de informacin o paquetes, los cuales contendran la direccin de destino pero sin especificar una ruta especfica para su arribo; por el contrario, cada paquete buscara la manera de llegar al destinatario por las rutas disponibles y el destinatario ensamblara los paquetes individuales para reconstruir el mensaje original. La ruta que siguieran los paquetes no era importante; lo importante era que llegaran a su destino. Curiosamente fue en Inglaterra donde se experiment primero con estos conceptos; y as en 1968, el Laboratorio Nacional de Fsica de la Gran Bretaa estableci la primera red experimental. Al ao siguiente, el Pentgono de los E.U. decidi financiar su propio proyecto, y en 1969 se establece la primera red en la Universidad de California (UCLA) y poco despus aparecen cuatro organizaciones educativas: el Instituto de Investigaciones de Stanford, la Universidad de California en Los ngeles, la Universidad de California en Santa Brbara y la Universidad de Utah. Naca as ARPANET (Advanced Research Projects Agency NETwork), antecedente de la actual Internet. Gracias a ARPANET, cientficos e investigadores pudieron compartir recursos informticos en forma remota; este era una gran ayuda ya que hay que recordar que

11

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

en los aos 70's el tiempo de procesamiento por computadora era un recurso realmente escaso. ARPANET en s misma tambin creci y ya para 1972 agrupaba a 37 redes. Y sucedi una cosa curiosa ya que empez a verse que la mayor parte del trfico estaba constituido por noticias y mensajes personales, y no tanto por procesos informticos; de hecho, cuando se desarrollaron las listas de correo electrnico (mensajes de correo que se distribuyen a un grupo de usuarios), uno de los primeros temas que abordaron con xito fue el de la cienciaficcin a travs de una popular lista que se llamaba SF-LOVERS (Fanticos de la ciencia-ficcin). El Protocolo utilizado en ese entonces por las mquinas conectadas a ARPANET se llamaba NCP (Network Control Protocol Protocolo de Control de Red), pero con el tiempo dio paso a un protocolo ms sofisticado: TCP/IP, que de hecho est formado no por uno, sino por varios protocolos, siendo los ms importantes el protocolo TCP (Transmission Control Protocol Protocolo de Control de Transmisin) y el Protocolo IP (Internet Protocol Protocolo de Internet). TCP convierte los mensajes en paquetes en la maquina emisora, y los reacomoda en la mquina destino para obtener el mensaje original, mientras que IP es el encargado de encontrar la ruta al destino. La naturaleza descentralizada de ARPANET y la disponibilidad sin costo de programas basados en TCP/IP permiti que ya en 1977, otro tipo de redes no necesariamente vinculadas al proyecto original, empezaran a conectarse. En 1983, el segmento militar de ARPANET decide separarse y formar su propia red que se conoci como MILNET. conocidas como Internet. ARPANET, y sus "redes asociadas" empezaron a ser

12

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

En 1984, la Fundacin Nacional para la Ciencia (National Science Foundation) inicia una nueva "red de redes" vinculando en una primera etapa a los centros de supercmputo en los E.U. (6 grandes centros de procesamiento de datos distribuidos en el territorio de los E.U.) a travs de nuevas y ms rpidas conexiones. Esta red se le conoci como NSFNET y adopt tambin como protocolo de comunicacin a TCP/IP. Eventualmente, a NSFNET empezaron a conectarse no solamente centros de supercmputo, sino tambin instituciones educativas con redes ms pequeas. El crecimiento exponencial que experiment NSFNET as como el incremento continuo de su capacidad de transmisin de datos, determin que la mayora de los miembros de ARPANET terminaran conectndose a esta nueva red y en 1989, ARPANET se declara disuelta. Ya desde 1989, Mxico tuvo su primera conexin a Internet a travs del Instituto Tecnolgico de Estudios Superiores de Monterrey, el cual utiliz una lnea privada analgica de 4 hilos para conectarse a la Universidad de Texas a una velocidad de 9600 bits por segundo! Algo similar suceda en otros pases por lo que se determin que era necesaria una divisin en categoras de las computadoras conectadas. Las redes fuera de los E.U., aunque tambin algunas dentro de ese pas, escogieron identificarse por su localizacin geogrfica, mientras que los dems integrantes de NSFNET se agruparon bajo seis categoras bsicas o dominios : "gov", "mil", "edu", "com", "org" y "net". Los prefijos gov, mil y edu, se reservaron para instituciones de gobierno, instituciones de carcter militar e instituciones educativas respectivamente.

13

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

El sufijo "com" empez a ser utilizado por instituciones comerciales que comenzaron a conectarse a Internet en forma exponencial, seguidos de cerca por instituciones de carcter no lucrativo, las cuales utilizaron el sufijo "org". Por lo que respecta al sufijo "net", este se utiliz en un principio para las computadoras que servan de enlace entre las diferentes sub-redes (compuertas o gateways) . En 1988 se agreg el sufijo "int" para instituciones internacionales derivadas de tratados entre gobiernos. En esa poca, Internet slo permita transmitir texto y datos. En 1990 Tim Berners Lee, del Laboratorio Europeo De Fsica en Partculas, CERN, desarroll la World Wide Web (telaraa mundial), conocida tambin simplemente como Web, que permite comunicar elementos grficos. Este avance es el responsable de la gran popularidad de Internet y ha permitido que la red se ponga al alcance de toso el mundo. Internet es una gran telaraa mundial de computadoras conectadas entre s a nivel mundial. Permite el libre trnsito de datos, imgenes, audio y video. 1.2 Protocolo HTTP (Protocolo de transferencia de hipertexto). Dentro de los protocolos de red y sus tecnologas encontramos los siguientes: Tecnologas y protocolos de red* DNS, FTP, HTTP, IMAP, IRC, NFS, NNTP, Nivel de aplicacin NTP, POP3, SMB/CIFS, SMTP, SNMP, SSH, Telnet, SIP, ver ms Nivel de presentacin ASN.1, MIME, SSL/TLS, XDR, ver ms

14

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Nivel de sesin Nivel de transporte Nivel de red Nivel de enlace

NetBIOS, ONC RPC, DCE/RPC ver ms SCTP, SPX, TCP, UDP, ver ms AppleTalk, IP, IPX, NetBEUI, X.25, ver ms ATM, Ethernet, Frame Relay, HDLC, PPP, Token Ring, Wi-Fi, STP, ver ms Cable coaxial, Cable de fibra ptica, Cable de

Nivel fsico

par trenzado, Microondas, Radio, RS-232, ver ms

Tabla 1 Modelo OSI protocolos y sus tecnologas El protocolo de transferencia de hipertexto (HTTP, HyperText Transfer Protocol) es el protocolo usado en cada transaccin de la Web (WWW). El hipertexto es el contenido de las pginas web, y el protocolo de transferencia es el sistema mediante el cual se envan las peticiones de acceso a una pgina y la respuesta con el contenido. Tambin sirve el protocolo para enviar 'informacin adicional en ambos sentidos, como formularios con campos de texto. HTTP es un protocolo sin estado, es decir, que no guarda ninguna informacin sobre conexiones anteriores. Al finalizar la transaccin todos los datos se pierden. Por esto se popularizaron las cookies, que son pequeos ficheros guardados en el propio ordenador que puede leer un sitio web al establecer conexin con l, y de esta

forma reconocer a un visitante que ya estuvo en ese sitio anteriormente. Gracias a esta identificacin, el sitio web puede almacenar gran nmero de informacin sobre cada visitante, ofrecindole as un mejor servicio. Para hacer uso de los servicios de Internet es necesario tener, al menos, una idea de cmo se asignan los nombres y direcciones a las redes, a los nodos y a las computadoras anfitrionas (Host) que forman parte de la red Internet, as como cules

15

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

son las herramientas principales que facilitan su localizacin. Las dos metodologas empleadas para nombrar a las terminales de la red, proporcionan una direccin nica para cada computadora que se conecta permanentemente a Internet. HTTP dispone de una variante cifrada mediante SSL llamada HTTPS. Transacciones HTTP El protocolo HTTP est basado en el modelo cliente-servidor. Un cliente HTTP abre una conexin y enva su solicitud al servidor, el cual responder con el recurso solicitado si est disponible y su acceso es permitido y la conexin se cierra. El formato tanto del mensaje como de la respuesta es como sigue (separando las lneas con la secuencia retorno de carro-nueva lnea): Cabecera-1: valor-1 ...(Common Object Interface Generator) Cabecera-n: valor-n La lnea inicial es diferente en las solicitudes y en las respuestas. En las solicitudes est formada por tres campos que se separan con un espacio en blanco: "Mtodo recurso versin-del-protocolo". Por ejemplo: "GET /path/to/file/index.html HTTP/1.0". La lnea inicial de una respuesta tiene tres campos separados por un

16

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

espacio: "versin-del-protocolo cdigo-respuesta mensaje". Por ejemplo: "HTTP/1.0 200 OK". Los encabezados estn normados en el protocolo, e incluyen, en el caso de una solicitud, informacin del navegador y eventualmente del usuario cliente; En el caso de una respuesta, informacin sobre el servidor y sobre el recurso. El cuerpo del mensaje contiene el recurso a transferir o el texto de un error en el caso de una respuesta. En el caso de una solicitud, puede contener parmetros de la llamada archivos enviados al servidor. Actualmente viene remplazando al FTP en la transferencia de archivos. El servidor Apache permite el uso de los llamados distributed configuration files, osea ficheros de configuracin distribuidos. Estos permiten personalizar el funcionamiento del servidor en un directorio concreto sin necesidad de modificar el fichero de configuracin principal de Apache, el httpd.conf. Ejemplo de un un socket con el host www.tuhost.example, puerto 80 que es el puerto por defecto para HTTP. www.example.com User-Agent: HTTPTool/1.0

17

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

[Lnea en blanco] La respuesta del servidor est formada por encabezados seguidos del recurso solicitado, en el caso de una pgina web: HTTP/1.0 200 OK Date: Fri, 31 Dec 2003 23:59:59 GMT Content-Type: text/html Content-Length: 1221 Pgina principal de tuHost (Contenido) Al recibirse la respuesta, el servidor cierra la comunicacin. Cabe sealar que los principales navegadores web no muestran al usuario los encabezados HTTP del recurso. Para visualizar tales encabezados pueden utilizarse herramientas conocidas genricamente como "visores HTTP". Son especialmente cmodos de utilizar los

18

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

visores HTTP on-line. Se puede acceder a gran variedad de estas herramientas buscando "http viewer" en cualquier buscador automtico. En la pgina www.cibernetia.com podrs encontrar los encabezados de diferentes sitios que coloques por ejemplo: http://www.esmas.com HTTP/1.0 Temporarily Cache-Control: Server: AkamaiGHost Content-Length: 0 Location: /wap/index.wml Expires: -1 Date: Wed, 27 Aug 2008 Content-Type: charset=ISO-8859-1 Connection: close Set-Cookie: /wap/index.wml HTTP/1.0 200 OK Server: NetscapeEnterprise/4.1 Content-Type: text/vnd.wap.wml PREF=ID=cebb674a623a3d40:TM= 1219862944:LM=1219862944:S=i_ WHm00bLql97uo7; expires=Fri, 27Aug-2010 18:49:04 GMT; path=/; domain=.google.com.mx text/html; 18:42:00 GMT age=0 Date: Wed, 27 Aug 2008 18:49:04 GMT private, max302 Moved http://www.google.com.mx HTTP/1.0 200 OK

19

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Server: gws ETag: 458bfa30" Connection: Close Last-Modified: Fri, 22 Dec 2006 15:30:56 GMT Content-Length: 1910 Accept-Ranges: bytes Date: Wed, 27 Aug 2008 "54d723bf-49-776-

18:42:00 GMT Connection: close Content-Type: text/vnd.wap.wml

http://www.yahoo.com.mx HTTP/1.1 Permanently 301 Moved

http://www.aulaclic.com HTTP/1.1 200 OK Date: Wed, 27 Aug 2008 18:55:55

Date:

Wed,

27

Aug

2008 GMT Server: Apache

18:51:48 GMT Location: http://mx.yahoo.com/ Last-Modified: Sun, 20 Apr 2008

20

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Connection: close Content-Type: charset=utf-8 text/html;

19:38:00 GMT ETag: "9ac038-978-1eec1600" Accept-Ranges: bytes Content-Length: 2424 Connection: close Content-Type: charset=ISO-8859-1 text/html;

http://mx.yahoo.com/ HTTP/1.1 200 OK Date: Wed, 27 Aug 2008

18:51:48 GMT P3P: policyref="http://p3p.yahoo.com/w3c /p3p.xml", CP="CAO DSP COR

CUR ADM DEV TAI PSA PSD IVAi IVDi CONi TELo OTPi OUR DELi SAMi OTRi UNRi PUBi IND PHY ONL UNI PUR FIN COM NAV INT DEM CNT STA POL HEA PRE GOV" Cache-Control: no-cache, private Cache-control: max-age=0

21

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Expires: Mon, 26 Jul 1997

05:00:00 GMT Pragma: no-cache Connection: close Content-Type: charset=utf-8 text/html;

Tabla 2 cabeceras devueltas por los diferentes servidores. Las cabeceras del protocolo http Connection (conexin) Permite especificar diferentes opciones para la conexin. Por ejemplo: Connection: close indica que la conexin debe cerrarse una vez transmitido el mensaje completo Content-Language (idioma del contenido) Esta cabecera indica el idioma de los destinatarios del recurso. Si no existe, se entiende que el recurso est orientado a todos los usuarios, independientemente del

22

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

idioma. Esta cabecera permite listar varios idiomas. Por ejemplo, una herramienta on-line de traduccin ingls-francs, podra incluir en sus pginas la cabecera: Content-Language: es, fr Es importante recalcar que esta cabecera no indica necesariamente el idioma del documento, sino del pblico al que objetivamente se orienta. Una texto sencillo de ingls para estudiantes hispanoparlantes incluira la cabecera: Content-Language: es aunque el contenido pueda estar en ingls (y, por tanto, las meta etiquetas HTML indiquen que se trata de un documento en ingls). Content-Length (longitud del contenido) Indica la longitud del cuerpo del recurso, expresada en nmero de octetos. Content-Location (localizacin del contenido) Direccin complementaria que ofrece el servidor en su respuesta. Esta nueva direccin (una URI absoluta o relativa) no corrige la direccin original del recurso solicitado por el cliente, sino que ofrece una ruta a un recurso que complementa al solicitado originalmente. Content-Type (tipo de contenido) Indica, como su nombre indica, el tipo de contenido del recurso. As, la cabecera Content-Type: text/html; charset=ISO-8859-1

23

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

indica que el recurso es de tipo texto, concretamente cdigo HTML, y codificado segn la especificacin ISO-8859-1. Date (fecha) Indica la fecha de creacin del recurso. Tiene la forma: Date: Tue, 12 Jul 2005 09:32:25 GMT Expect (espera) Meidante esta cabecera, el cliente indica qu tipo de respuesta espera del servidor. Si el servidor no est preparado para responder como el cliente espera, debe indicarlo mediante el envo de un cdigo de estatus 417 (Expectation Failed). Expires (expiracin) Indica la fecha a partir de la cual el recurso debe considerarse obsoleto. Un ejemplo: Date: Tue, 12 Jul 2005 09:32:25 GMT From ("desde") Direccin de correo electrnico del usuario (humano) autor de la solicitud. If-Match ("si cuadra") Se usa junto con la cabecera de mtodo para hacerlo condicional. Esto permite actualizaciones eficientes de la cach. Si el cliente guarda en su cach alguna entidad (algn elemento distinguible) del recurso solicitado puede verificar gracias a

24

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

esta cabecera si esta entidad sigue estando en vigor, es decir, si la copia guardada en la cach sigue siendo vlida. If-Modified-Since ("si se ha modificado desde") Igual que la cabecera IfMatch, If-Modified-Since se usa con la cabecera que indica el mtodo para expresar una condicin. Si el recurso no ha variado desde la fecha indicada por el cliente, el servidor no debe enviarlo. Enviar, en cambio, un cdigo de estatus 304, confirmndole al cliente (navegador, por ejemplo, o robot de un buscador) que la copia que tiene en cach sigue siendo una copia fiel del recurso guardado en el servidor. If-None-Match ("si no cuadra") Igual que las cabecera If-Match e If-Modified-Since, se usa junto con la cabecera de mtodo para someterlo a una condicin. Funciona de forma inversa a if-Match. El servidor no debe ejecutar la solicitud (expresada mediante la cabecera de mtodo) si la entidad expresada por la condicin de IfNone-Match se cumple. IP (remote adress) No es estrictamente una cabecera del protocolo HTTP, sino del protocolo TCP/IP. Expresa la identificacin numrica de una mquina. Host (servidor) Nombre del servidor.

25

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Last-Modified (ltima modificacin) Mediante esta cabecera el servidor informa de la fecha y hora en que el recurso fue modificado por ltima vez. Location (localizacin) Mediante este campo el servidor indica la direccin (la URL) de un recurso cuando no se encuentra en la direccin en que se ha solicitado. De esta forma, el servidor invita al navegador (o al software del cliente en general) a que se redirija a la nueva localizacin. Referer (remitente) Documento desde el cual se ha realizado la solicitud actual. Si desde la URL www.cibernetia.com/index.php clicamos el enlace que lleva a

www.cibernetia.com/headers_manual/index.php, la primera URL figurar como referer en la solicitud de la segunda URL. Request (solicitud)) Indica el fichero (el documento) solicitada y el mtodo y versin del protocolo que se van a emplear para realizar la conexin. Status Code (cdigo de estado) Mediante el cdigo de estado el servidor informa al navegador sobre cmo ha resuelto la solicitud de un documento. Esta cabecera nos indicar, por ejemplo, si se ha servido el documento con xito o se ha producido algn problema, como un error

26

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

interno del servidor, o alguna incidencia, como una redireccin hacia otra URL diferente. UserAgent (agente de usuario) El user-agent identifica el software de la mquina cliente (es decir, se refiere al software instalado en el ordenador que solicita una pgina web). La identificacin se realiza, normalmente, mediante una combinacin de sistema operativo y navegador. Un par

Esta cabecera indica que el cliente est navegando con la versin 6.0 de Internet Explorer

En este caso es un robot el que est solicitando la pgina, concretamente Googlebot, la araa de Google. En Linux, el archivo /etc/protocols contiene la lista de protocolos disponibles y /etc/services contiene la lista de servicios disponibles. Por ejemplo, en la configuracin inicial de la mayora de los sistemas Linux se tiene que: 1. 2. 3. 4. el servicio telnet utiliza el protocolo TCP/IP y se comunica por el puerto 23 el servicio ftp utiliza el protocolo TCP/IP y se comunica por los puertos 20 y 21 el servicio WWW utiliza el protocolo HTTP y se comunica por el puerto 80. el servicio WebDAV para desarrollo en colaboracin utiliza el protocolo HTTP como transporte. 5. CORBA, el marco para compartir objetos y servicios en la red puede utilizar el protocolo HTTP como transporte.

27

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

cliente de que ste puede continuar con su solicitud. El cliente (el navegador, normalmente) tiene dos opciones: enviar las cabeceras que an no haya enviado o, si ya haba completado la cdigo que acepta un cambio en el protocolo de comunicacin con el cliente. El cambio se producir inmediatamente despus de servir este cdigo. Cdigos 2xx Cdigos relacionados Created Como respuesta a una solicitud aceptada por el servidor, ste crea un nuevo recurso, que se servir al cliente inmediatamente.

28

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

para atender la solicitud, pero mediante un cdigo 202 el servidor indica que no se -Authoritative Information Se utiliza muy poco. Con este cdigo, el servidor indica al cliente que al servir el recurso solicitado est alterando la metainformacin original de dicho recurso. Por ejemplo: un servidor responde a una solicitud con un documento en HTML que incluye el texto ntegro del BOE de una fecha determinada, aadiendo meta-informacin adicional que no se incluye en el BOE Content El servidor ha recibido y aceptado la solicitud, pero entiende que no es preciso servir servidor le indica al cliente, normalmente al navegador, que debe recargar el mismo documento que origin la solicitud (p Partial Content Respuesta del servidor a una solicitud parcial de documento. El navegador, previamente, haba solicitado una parte de un recurso, solicitud sta que el servidor ha podido atender correctamente. Un ejemplo: el navegador puede

29

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

solicitar slo una pgina de un documento PDF; de ser aceptada y correctamente atendida esta solicitud, el servidor contestara con un cdigo 206. Cdigos 3xx Cdigos utilizados para informar al navegador de que el documento solicitado existe, pero no se le va a servir desde la con algundo de entre una lista de recursos alternativos. Ha de ser el propio agente de usuario (navegador, normalmente) quien elija entre La URI (direccin relativa) del recurso ya no es la indicada al cursar la solicitud. El servidor ofrece al cliente la nueva direccin (mediante la cabecera "Location"), para que el cliente pueda realizar un cambiado provisionalmente de localizacin (URI). El servidor, como se ha explicado para el cdigo 301, ofrece al cliente la nueva localizacin. Normalmente, el navegador no debera redirigirse hacia la nueva URI sin una confirmacin previa por parte del usuario.

30

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Other Tiene un sentido similar al cdigo 302. De hecho, la versin 1.0. del protocolo HTTP no contemplaba el cdigo 303. Indica que la respuesta a la solicitud se puede encontrar en una localizacin diferente, y es accesible mediante el mtodo GET. La nueva localizacin

servidor entiende que existe una copia en cach, e informa de que el documento no ha cambiado: sigue siendo el mismo que el guardado en la memoria cach. Si no es as, ha de ser la cach la que realice una nueva solicitud no condicionada, es decir, que el servidor debe servidor informa de que se debe acceder al documento en cuestin utilizando un proxy, y

El cdigo 306 existi en anteriores versiones, pero ahora est libre para futuras por la cabecera "Location".

31

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Cdigos 4xx Cdigos relacionados con solicitudes relativas a documentos inexistentes o de acceso problemtico o restringido.

400 Bad Request

La sintaxis de la solicitud es incorrecta.

401 Unauthorized

El acceso al recurso requiere identificacin por parte del usuario.

402 Payment Required

De momento, este cdigo no est suficientemente desarrollado. Se espera que lo est en el futuro.

403 Forbidden

El servidor rechaza la solicitud, sin ni siquiera ofrecer la posibilidad de que el usuario se identifique.

404 Not Found

La sintaxis de la solicitud es correcta, pero el servidor no encuentra ningn recurso cuya URI se corresponda con la de la solicitud.

405 Method Not Allowed

La solicitud se ha hecho empleando un mtodo (GET, POST, HEAD...) que no est permitido.

32

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

406 Not Acceptable

El recurso no cumple las restricciones expresadas por la solicitud. Por ejemplo, se ha solicitado un documento de texto plano con una URI determinada y el servidor, aunque encuentra un documento con esa URI, no lo sirve por no cumnlir con el requisito de ser de texto plano.

407 Proxy Authentication Required

Es parecido al cdigo 401, pero la autentificacin del cliente se debe realizar mediante un proxy.

408 Request Timeout

El cliente ha tardado en realizar la solicitud ms tiempo del que el servidor puede esperar.

409 Conflict

El servidor entiende que existe algn conflicto entre la naturaleza del recurso solicitado y el tipo de solicitud que ha cursado el cliente. Normalmente, el servidor debera ofrecer al cliente informacin suficiente para resolver el conflicto.

410 Gone

El recurso ya no est disponible, y no se espera que lo vuelva a estar en el futuro.

33

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

411 Length Required El servidor no est dispuesto a servir el recurso si el cliente no especifica en su solicitud una cabecera del tipo "Content-Length" que indique cul es la longitud del mensaje de solicitud.

412 Precondition Failed

No se ha cumplido alguna de las condiciones expresadas en las cabeceras de la solicitud cursada por el cliente.

413 Request Entitiy Too Large

El mensaje de solicitud cursado por el cliente es excesivamente largo.

414 Request URI Too Long

La URI (cadena de caracteres que expresa la localizacin del documento) es demasiado larga. Se puede producir cuando el cliente convierte por error un acceso del tipo POST en uno del tipo GET o cuando se entra en ciertos bucles de redirecciones.

415 Unsupported Media Type

El servidor rechaza la solicitud por incompatibilidad entre el mtodo y el formato solicitado y los propios del recurso.

34

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

416 Requested Range Not Satisfable

El servidor no ha podido resolver satisfactoriamente la cabecera "Range" de la solicitud del cliente. La respuesta del servidor debera incluir una cabecera "Content-Range" especificando el tamao actual del recurso solicitado.

417 Expectation Failed

El valor dado por la cabecera "Expect" de la solicitud no ha podido ser resuelto por el servidor. Cdigos 5xx Cdigos relacionados con errores producidos en el servidor o en los servidores implicados en dar respuesta a la solicitud de documento realizada por el cliente.

500 Internal Server Error

Se ha producido un fallo en el servidor, que no ha podido resolver la solicitud.

501 Not Implemented El servidor no implementa alguna funcionalidad necesaria para resolver

la solicitud, por ejemplo, porque no reconoce el mtodo empleado.

502 Bad Gateway

Un servidor que hace de proxy o gateway no ha obtenido una respuesta adecuada de un segundo servidor, al cual necesita acceder para atender la solicitud del cliente.

35

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

503 Service Unavailable

El servidor no puede atender la solicitud debido, por ejemplo, a una sobrecarga o a tareas de mantenimiento que obligan a deshabilitar el servicio. Es preceptivo acompaar este cdigo de una cabecera del tipo Retry-After (Reintentar-Despus), que especifique el tiempo estimado de "cada" del servicio. Si no se especifica, el servidor no debera enviar este cdigo, sino un cdigo 500.

504 Gateway Timeout

El servidor, que hace las funciones de proxy o gateway, no ha obtenido ninguna respuesta de un segundo servidor, al cual, como en el caso explicado para el cdigo 502, necesita acceder.

505 HTTP Version Not Supported

Mediante este cdigo, el servidor informa al cliente de que no est preparado para utilizar la versin del protocolo HTTP que el cliente ha utilizado para lanzar la peticin.

36

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

PROTOCOLO TCP/IP: Conjunto o suite de protocolos utilizados por los diversos servicios de Internet, para facilitar y controlar los procesos de comunicaciones y la transferencia de los datos.

TABLA 3 Conjunto de protocolos bsicos de la suite TCP/IP

37

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

1.2.1 Arquitectura del WWW. Composicin de una direccin de Internet:

Aunque la mayora De las direcciones De pginas Web Comienzan con www.

Extensin que indica el tipo de sitio.

http://www.presidencia.gob.mx

El prefijo indica Que corresponde A una pgina Web.

Es el nombre del sitio Y, por lo general, corresponde a la empresa o Institucin a la que pertenece.

Seala el pas donde Esta la computadora Que aloja el sitio.

figura1.Arquitectura del WWW http:// (Protocolo de Transferencia de Hipertexto). Prefijo que indica que esta direccin corresponde a un recurso de la Web. Protocolo para transferir archivos o documentos hipertexto a travs de la red. WWW: La mayora de la direcciones de la Web comienza de esa manera, pero no es obligatorio que sea as.

38

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Direcciones IP. El primer sistema de direcciones de Internet se denomina IP Address (Internet Protocol Address) o Direcciones IP. Las direcciones IP (IP Address) constituyen el sistema de direccionamiento para identificar a los anfitriones (host) de la red Internet. Se componen de un nmero de 32 bits dividido en cuatro octetos, cuyos valores decimales pueden estar entre 0 y 255, separados por un punto. Ejemplos: 128.9.0.32, 170.12.0.165, o 200.12.165.19. Para lograr mayor claridad en la asignacin de direcciones, se consideraron inicialmente tres clases: A, B y C, de uso general; dos clases para redes diferentes, y se encuentra en estudio el uso de las clases F, G, H y K. Las direcciones de la clase A han sido utilizadas por las grandes redes. En la clase A, el bit de orden superior siempre es 0 (cero), y es el bit ubicado ms a la izquierda. Siguen siete que identifican la red y los siguientes 24 para designar al nodo. La cantidad de direcciones de esta clase que se pueden asignar para las 256 redes diferentes, es de 2563 nodos, (16777216 en total). Las direcciones de la clase B contienen a 10 (uno y cero) como los bits de orden superior, 14 bits para identificar la red y 16 para el nodo. En este caso a cada red le corresponden un total de 2562 nodos (2562 =65 536). Las de la clase C, con bits de orden superior 110 (uno, uno, cero), utilizan 21 bits para identificar a la red y 8 para el nodo, por lo que el total de nodos que puede contener cada red es de 256. La representacin de la direccin decimal 170.12.0.165 en forma binaria se vera como sigue:

39

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Valores decimales correspondientes 170 10101010 12 00001100 0 00000000 165 10100101 Decimal Binario

Nmero binario de 32 bits dividido en cuatro octetos Figura 1.1. La representacin de la direccin decimal 170.12.0.165 en forma binaria.

Direccionamiento en Internet

www.microsoft.com 207.46.230.218 Las direcciones DNS e IP son equivalentes www.microsoft.com.mx 207.21.222.33

Direccin DNS Direccin IP

Direccin DNS Direccin IP

Imagen1.3. Direccionamiento en internet

40

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

DOMINIO La relacin entre una direccin IP y una de nombres de dominios es tan estrecha que da los mismo enviar un correo electrnico o ingresar a una pgina Web con una direccin numrica, que a una con nombre de dominios. La institucin encargada de asignar y controlar el direccionamiento de las grandes redes de Internet es el Centro de Informacin de la Red (Network Information Center, NIC), a travs de la Autoridad para la asignacin de Nmeros en Internet (Internet Assigned Numbers Authority, IANA). Tcnicamente un dominio es una forma sencilla de localizar un ordenador en Internet, pero sobre todo es la garanta de nuestra identidad. Al igual que en el mundo real tenemos diferentes formas de identificarnos, como pueden ser las huellas dactilares, el DNI o el ADN, en Internet el dominio constituye el principal medio de identificacin. Uno de los aspectos ms importantes de los dominios es que son nicos. Es imposible que dos personas u organizaciones tengan simultneamente la misma direccin. TIPOS DE DOMINIOS: Dominios Genricos: (tambin denominados internacionales o globales) estn organizados conceptualmente y son los dominios bsicos en Internet. Cualquier empresa que realice negocios a travs de Internet o que tenga intencin de hacerlo debe registrarse en uno de estos dominios genricos dada la popularidad que han adquirido.

41

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

.biz .com .edu .gov .info

Sitios de Organizaciones de Negocios Sitios Comerciales Sitios Educativos Sitios de Organismos Gubernamentales Sitios de Apertura Libre de Dominios de Nivel Superior TLD

.int .mil

Sitios de Organizaciones Internacionales Sitios de Dependencias Militares Oficiales de los Estados

.name .net .org

Sitios Personales Sitios de Sistemas y Redes Sitios de Organizaciones Tabla 4 dominios genricos en internet

Dominios territoriales: (Tambin denominados geogrficos o ISO3166) son los dominios mantenidos por cada pas. Estos dominios territoriales son utilizados por las organizaciones y

empresas que desean establecerse en Internet o que quieren proteger la identidad de su marca o su nombre comercial en el contexto de un pas concreto.

42

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Dominio Pas geogrfico ar Argentina at Austria au Australia br Brasil be Blgica ca Canad ch Suiza cl Chile co Colombia cr Costa Rica cu Cuba de Alemania dk Dinamarca eo Egipto es Espaa fi Finlandia

Dominio Pas geogrfico fr Francia gb Reino Unido gr Grecia hk Hong Kong ie Irlanda il Israel in India is Islandia it Italia jm Jamaica jp Japn mx Mjico ni Nicaragua nl Holanda no Noruega nz Nueva Zelanda

Dominio Pas geogrfico pe Per ph Filipinas pk Pakistn pl Polonia pr Puerto Rico pt Portugal ru F .Rusa sa Arabia S. se Suecia th Tailandia tr Turqua us EEUU vn Vietnam za Sudfrica

Tabla 5 Dominios territoriales en internet SUBDOMINIO: El sub-dominio, etiquetas opcionales en el nombre, se utiliza para ayudar al usuario a agrupar nombres en sub-dominios o subdivisiones. As, para el dominio com., los sub-dominios podran ser: empresa, divisin, departamento. Por ejemplo: el nombre de una direccin en el sistema ITESM se forma de la siguiente manera: Cuenta Nombre del usuario para Internet @ en campus. Nombre del servidor. mor. Clav e del Estado. itesm. Nombre del Instituto. Mx Dominio Mxico

Tabla 6.Sud-dominio

43

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Esta estructura jerrquica, permite al servidor hacer asignaciones lgicas, de manera que si un usuario en el campus Morelos (campus.mor) quiere enviar un email a otro usuario en el mismo campus, solo necesita conocer el nombre de la cuenta del usuario, y el servidor aadir automticamente el sub-dominio local (@campus.mor.itesm.mx). De la misma manera, si un usuario en Monterrey quiere enviar un e-mail a otro usuario en Quertaro, solo necesita enviarlo a: usuario@campus.qro, y el servidor aadir la parte faltante (.itesm.mx).

Sistema de Nombres de Dominio Divisor de los componentes Nombre de la computadora o nodo Dominios de ms alto nivel

usuario@comp.com.mx Dominio genrico de ms alto nivel Dominio de ubicacin de ms alto nivel Figura 1.4. Sistema de Nombres de Dominio

44

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

1.2.2 URLs. URL significa Uniform Resource Locator, es decir, localizador uniforme de recurso. Es una secuencia de caracteres, de acuerdo a un formato estndar, que se usa para nombrar recursos, como documentos e imgenes en Internet, por su localizacin. Los URL fueron una innovacin fundamental en la historia de la Internet. Fueron usadas por primera vez por Tim Berners-Lee en 1991, para permitir a los autores de documentos establecer hiperenlaces en la World Wide Web (WWW o Web). Desde 1994, en los estndares de la Internet, el concepto de URL ha sido incorporado dentro del ms general de URI (Uniform Resource Identifier Identificador Uniforme de Recurso), pero el trmino URL an se utiliza ampliamente. Aunque nunca fueron mencionadas como tal en ningn estndar, mucha gente cree que las inciales URL significan Universal Resource Locator (Localizador Universal de Recurso). Esta interpretacin puede ser debida al hecho de que, aunque la U en URL siempre ha significado Uniforme, la U de URI signific en un principio Universal, antes de la publicacin del RFC 2396.El URL es la cadena de caracteres con la cual se asigna una direccin nica a cada uno de los recursos de informacin disponibles en la Internet. Existe un URL nico para cada pgina de cada uno de los documentos de la World Wide Web, para todos los elementos de Gopher y todos los grupos de debate USENET, y as sucesivamente. El URL de un recurso de informacin es su direccin en Internet, la cual permite que el navegador la encuentre y la muestre de forma adecuada. Por ello el URL combina el nombre del ordenador que proporciona la informacin, el directorio donde se encuentra, el nombre del archivo y el protocolo a usar para recuperar los datos.

45

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

El formato general de un URL es: protocolo://mquina/directorio/archivo Tambin pueden aadirse otros datos: protocolo://usuario:contrasea@mquina:puerto/directorio/archivo Por ejemplo: http://es.Wikipedia.org/ Esquema URL Un URL se clasifica por su esquema, que generalmente indica el protocolo de red que se usa para recuperar, a travs de la red, la informacin del recurso identificado. Un URL comienza con el nombre de su esquema, seguida por dos puntos, seguido por una parte especfica del esquema. Algunos ejemplos de esquemas LDAP Lightweight Directory Access Protocol insertar pequeos trozos de contenido en los - direcciones E- bsquedas - recusos disponibles en la computadora - el - el esquema para

46

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

documentos Data: URL Algunos de los esquemas URL, como los populares "mailto", "http", "ftp" y "file", junto a los de sintaxis general URL, se detallaron por primera vez en 1994, en el Request for Comments RFC 1630, sustituido un ao despus por los ms especficos RFC 1738 y RFC 1808. Sintaxis Genrica URL Todos los URL, independientemente del esquema, deben seguir una sintaxis general. Cada esquema puede determinar sus propios requisitos de sintaxis para su parte especfica, pero el URL completo debe seguir la sintaxis general. Usando un conjunto limitado de caracteres, compatible con el subconjunto imprimible de ASCII, la sintaxis genrica permite a los URL representar la direccin de un recurso, independientemente de la forma original de los componentes de la direccin. Los esquemas que usan protocolos tpicos basados en conexin usan una sintaxis comn para "URI genricos", definida a continuacin: esquema://autoridad/ruta?consulta#fragmento La autoridad consiste usualmente en el nombre o Direccin IP de un servidor, seguido a veces de dos puntos (":") y un nmero de Puerto TCP. Tambin puede incluir un nombre de usuario y una clave, para autenticarse ante el servidor. La ruta es la especificacin de una ubicacin en alguna estructura jerrquica, usando una barra diagonal ("/") como delimitador entre componentes.

47

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

La consulta habitualmente indica parmetros de una consulta dinmica a alguna base de datos o proceso residente en el servidor. El fragmento identifica a una porcin de un recurso, habitualmente una ubicacin en un documento. Ejemplo: URL en HTTP Los URL empleados por HTTP, el protocolo usado para transmitir pginas web, es el tipo ms popular de URL y puede ser usado para mostrarse como ejemplo. La sintaxis de un URL HTTP es: esquema://anfitrin:puerto/ruta?parmetro=valor#enlace 1. Esquema, en el caso de HTTP, en la mayora de las veces

equivale a http, pero tambin puede ser https cuando se trata de HTTP sobre una conexin TLS (para hacer ms segura la conexin). 2. Muchos navegadores web permiten para el uso de en

esquema://usuario:contrasea@anfitrin:puerto/...

autenticacin

HTTP. Este formato ha sido usado como una "hazaa" para hacer difcil el identificar correctamente al servidor involucrado. En consecuencia, el soporte para este formato ha sido dejado de lado por algunos navegadores. La seccin 3.2.1 de RFC 3986 recomienda que los navegadores deben

mostrar el usuario / contrasea de otra forma que no sea en la barra de direcciones, a causa de los problemas de seguridad mencionados y porque las contraseas no deben mostrarse nunca como texto claro.

48

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

3. Anfitrin, la cual es probablemente la parte que ms sobresale de un URL, es en casi todos los casos el nombre de dominio de un servidor, p.ej.: www.wikipedia.org, google.com, etc. 4. La porcin :puerto especifica un nmero de puerto TCP. Usualmente es omitido (en este caso, su valor por omisin es 80) y probablemente, para el usuario es lo que tiene menor relevancia en todo el URL. 5. La porcin ruta es usada por el servidor (especificado en anfitrin) de cualquier forma en la que su software lo establezca, pero en muchos casos se usa para especificar un nombre de archivo, posiblemente precedido por nombres de directorio. Por ejemplo, en la ruta /wiki/Vaca, wiki sera un (seudo)directorio y Vaca sera un (seudo-)nombre de archivo. 6. La parte mostrada arriba como ?parmetro=valor se conoce como porcin de consulta (o tambin, porcin de bsqueda). Puede omitirse, puede haber una sola pareja parmetro-valor como en el ejemplo, o pueden haber muchas de ellas, lo cual se expresa como ?param=valor&otroParam=valor&.... Las parejas parmetro-valor nicamente son relevantes si el archivo especificado por la ruta no es una pgina web simple y esttica, sino algn tipo de pgina automticamente generada. El software generador usa las parejas parmetro-valor de cualquier forma en que se establezca; en su mayora transportan informacin especfica a un usuario y un momento en el uso del sitio, como trminos concretos de bsqueda, nombres de usuario, etc. (Observe, por ejemplo, de qu forma se comporta el URL en la barra de direcciones de su navegador durante una bsqueda Google: su trmino de bsqueda es pasado a algn programa sofisticado en google.com como un parmetro, y el programa de Google devuelve una pgina con los resultados

49

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

de la bsqueda.) 7. La parte #enlace, por ltimo, es conocida como identificador de fragmento y se refiere a ciertos lugares significativos dentro de una pgina; por ejemplo, esta pgina tiene enlaces internos hacia cada cabecera de seccin a la cual se puede dirigir usando el ID de fragmento. Esto es relevante cuando un URL de una pgina ya cargada en un navegador permite saltar a cierto punto en una pgina extensa. Un ejemplo sera este enlace, que conduce a esta misma pgina y al comienzo de esta seccin. (Observe cmo cambia el URL en la barra de direccin de su navegador cuando hace clic en el enlace.) Otro ejemplo de un URL HTTP se encuentra abajo. Referencias URI El trmino referencia URI se refiere a un caso particular de un URI, o una porcin de ste, tal como es usada en un documento HTML, por ejemplo, para referirse a un recurso particular. Una referencia URI habitualmente se parece a un URL o a la parte final de un URL. Las referencias URI introducen dos nuevos conceptos: la distincin entre referencias absolutas y relativas, y el concepto de un identificador de fragmento. Un URL absoluto es una referencia URI que es parecida a los URL definidos arriba; empieza por un esquema seguido de dos puntos (":") y de una parte especfica del esquema. Un URL relativo es una referencia URI que comprende slo la parte especfica del esquema de un URL, o de algn componente de seguimiento de aquella parte. El esquema y componentes principales se infieren del contexto en

50

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

el cual aparece la referencia URL: el URI base (o URL base) del documento que contiene la referencia. Una referencia URI tambin puede estar seguida de un carcter de numeral ("#") y un puntero dentro del recurso referenciado por el URI en conjunto. Esto no hace parte del URI como tal, sino que es pensado para que el "agente de usuario" (el navegador) lo interprete despus que una representacin del recurso ha sido recuperada. Por tanto, no se supone que sean enviadas al servidor en forma de solicitudes HTTP. Ejemplos de URL absolutos:

http://es.wikipedia.org/w/wiki.phtml?title=URL&action=history http://es.wikipedia.org/wiki/URL#Esquemas_en_URL

Ejemplos de URL r URL#Referencias_URI De acuerdo al estndar actual, en los componentes esquema y anfitrin no se diferencian maysculas y minsculas, y cuando se normalizan durante el procesamiento, deben estar en minsculas. Se debe asumir que en otros componentes s hay diferenciacin. Sin embargo, en la prctica, en otros componentes aparte de los de protocolo y anfitrin, esta diferenciacin es dependiente del servidor web y del sistema operativo del sistema que albergue al servidor.

51

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Un HTTP URL combina en una direccin simple los cuatro elementos bsicos de informacin necesarios para recuperar un recurso desde cualquier parte en la Internet:

El protocolo que se usa para comunicar, El anfitrin (servidor) con el que se comunica, El puerto de red en el servidor para conectarse, La ruta al recurso en el servidor (por ejemplo, su nombre de archivo).

Un URL tpico puede lucir como: ro de puerto de red en el servidor (siendo 80 el valor por omisin para el protocolo HTTP, esta porcin puede ser omitida por bsqueda; esta parte es opcional. Muchos navegadores web no requieren que el usuario ingrese "http://" para dirigirse a una pgina web, puesto que HTTP es el protocolo ms comn que se usa en navegadores web. Igualmente, dado que 80 es el puerto por omisin para HTTP, usualmente no se especifica. Normalmente uno slo ingresa un URL parcial tal como

52

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

www.wikipedia.org/wiki/Train. Para ir a una pgina principal se introduce nicamente el nombre de anfitrin, como www.wikipedia.org. Dado que el protocolo HTTP permite que un servidor responda a una solicitud redireccionando el navegador web a un URL diferente, muchos servidores adicionalmente permiten a los usuarios omitir ciertas partes del URL, tales como la parte "www.", o el carcter numeral ("#") de rastreo si el recurso en cuestin es un directorio. Sin embargo, estas omisiones tcnicamente constituyen un URL diferente, de modo que el navegador web no puede hacer estos ajustes, y tiene que confiar en que el servidor responder con una redireccin. Es posible para un servidor web (pero debido a una extraa tradicin) ofrecer dos pginas diferentes para URL que difieren nicamente en un carcter "#". Ntese que en es.wikipedia.org/wiki/Tren, el orden jerrquico de los cinco elementos es org (dominio genrico de nivel superior) - wikipedia (dominio de segundo nivel) - es (subdominio) wiki - Train; es decir, antes del primer "/" se lee de derecha a izquierda, y despus el resto se lee de izquierda a derecha. Para una discusin ms extensa acerca de HTTP URL y su uso, ver arriba. El trmino URL tambin es usado por fuera del contexto de la World Wide Web. Los servidores de bases de datos especifican URL como un parmetro para hacer conexiones a stos. De forma similar, cualquier aplicacin cliente-servidor que siga un protocolo particular puede especificar un formato URL como parte de su proceso de comunicacin.

53

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Ejemplo de un URL en una base de datos: jdbc:datadirect:oracle://myserver:1521;sid=testdb Si una pgina web es en forma singular y ms o menos permanentemente definida a travs de un URL, sta puede ser enlazada (ver tambin permalink, deep linking). Este no siempre es el caso, p.ej., una opcin de men puede cambiar el contenido de un marco dentro de la pgina, sin que esta nueva combinacin tenga su propio URL. Una pgina web puede depender tambin de informacin almacenada temporalmente. Si el marco o pgina web tiene su propio URL, esto no es siempre obvio para alguien que quiere enlazarse a ella: el URL de un marco no aparece en la barra de direcciones del navegador, y una pgina sin barra de direccin pudo haber sido producida. El URL se puede encontrar en el cdigo fuente o en las "propiedades" de varios componentes de la pgina. Aparte del propsito de enlazarse a una pgina o a un componente de pgina, puede ocurrir que se quiera conocer el URL para mostrar nicamente el componente, o superar restricciones tales como una ventana de navegador que no tenga barras de herramientas o que sea de tamao pequeo y no ajustable. Los servidores web tambin tienen la capacidad de direccionar URL si el destino ha cambiado, permitiendo a los sitios cambiar su estructura sin afectar los enlaces existentes. Este proceso se conoce como redireccionamiento de URL.

54

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

1.2.3 Mtodos http. Persistencia en http Cookies. Una peticin HTTP, en su formato ms bsico, tiene la siguiente sintaxis: Mtodo URI versin El mtodo le indica al servidor que hacer con el URI , por ltimo la versin simplemente indica el nmero de versin del protocolo que el cliente entiende. Una peticin habitual utiliza el mtodo GET para pedirle al servidor que devuelva el URI solicitado: GET /index.html HTTP/1.0

Mtodo GET

Significado Devuelve el recurso identificado en la URL pedida.

HEAD

Funciona como el GET, pero sin que el servidor devuelva el cuerpo del mensaje. Es decir, slo se devuelve la informacin de cabecera.

POST

Indica

al

servidor

que

se

prepare para recibir informacin del cliente. Suele usarse para enviar informacin desde

formularios.

55

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

PUT

Enva el recurso identificado en la URL desde el cliente hacia el

OPTIONS

servidor. Pide informacin

sobre

las

caractersticas de comunicacin proporcionadas por el servidor. Le permite al cliente negociar los parmetros de comunicacin. TRACE Inicia un ciclo de mensajes de peticin. Se usa para depuracin y permite al cliente ver lo que el servidor recibe en el otro lado. DELETE Solicita al servidor que borre el recurso identificado con

el URL. CONNECT Este mtodo se reserva para uso con proxys. Permitir que un proxy pueda en dinmicamente un tnel. Por

convertirse

ejemplo para comunicaciones con Tabla 7SSL. Metodos utilizados en HTTP De entre los tres parmetros el ms importante es el mtodo. HTTP/1.1 incorpora ocho mtodos (tabla), aunque slo obliga a implementar GET y HEAD, siendo todos los dems opcionales. En cualquier caso, los servidores que implementen alguno de los mtodos adicionales, deben atenerse a la especificacin de los mismos. Existe tambin la posibilidad de implementar mtodos extendidos, a los que la especificacin no pone ningn lmite.

56

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

En HTTP/1.0 slo se especificaban tres mtodos, GET, POST y HEAD. Estos son, con diferencia, los tres ms extendidos y utilizados, por ello se comentan un poco ms ampliamente. Una cookie (pronunciado ['ku.ki]; literalmente galleta) es un fragmento de informacin que se almacena en el disco duro del visitante de una pgina web a travs de su navegador, a peticin del servidor de la pgina. Esta informacin puede ser luego recuperada por el servidor en posteriores visitas. Las invent Lou Montulli, un antiguo empleado de Netscape Communications. Al ser el protocolo HTTP incapaz de mantener informacin por s mismo, para que se pueda conservar informacin entre una pgina vista y otra (como login de usuario, preferencias de colores, etc), sta debe ser almacenada, ya sea en la URL de la pgina, en el propio servidor, o en una cookie en el ordenador del visitante. De esta forma, los usos ms frecuentes de las cookies son:

Llevar el control de usuarios: cuando un usuario introduce su nombre de

usuario y contrasea, se almacena una cookie para que no tenga que estar introducindolas para cada pgina del servidor. Sin embargo una cookie no identifica a una persona, sino a una combinacin de computador y navegador.

Ofrecer opciones de diseo (colores, fondos, etc) o de contenidos al

visitante.

Conseguir informacin sobre los hbitos de navegacin del usuario, e

intentos de spyware, por parte de agencias de publicidad y otros. Esto puede causar problemas de privacidad y es una de las razones por la que las cookies tienen sus detractores.

57

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Originalmente, slo podan ser almacenadas por peticin de un CGI desde el servidor, pero Netscape dio a su lenguaje Javascript la capacidad de introducirlas directamente desde el cliente, sin necesidad de CGIs. En un principio, debido a errores del navegador, esto dio algunos problemas de seguridad. Estas vulnerabilidades fueron descubiertas por Esteban Rossi. Las cookies pueden ser borradas, aceptadas o bloqueadas segn desee, para esto slo debe configurar convenientemente el navegador web. Las cookies son utilizadas habitualmente por los servidores web para diferenciar usuarios y para actuar de diferente forma dependiendo del usuario. Las cookies se inventaron para ser utilizadas en una cesta de la compra virtual, que acta como dispositivo virtual en el que el usuario va "colocando" los elementos que desea adquirir, de forma que los usuarios pueden navegar por el sitio donde se muestran los objetos a la venta y aadirlos y eliminarlos de la cesta de la compra en cualquier momento. Las cookies permiten que el contenido de la cesta de la compra dependa de las acciones del usuario. Otro uso de las cookies es identificarse en un sitio web. Los usuarios normalmente se identifican introduciendo sus credenciales en una pgina de validacin; las cookies permiten al servidor saber que el usuario ya est validado, y por lo tanto se le puede permitir acceder a servicios o realizar operaciones que estn restringidas a usuarios no identificados. Otros sitos web utilizan las cookies para personalizar su aspecto segn las preferencias del usuario. Los sitios que requieren identificacin a menudo ofrecen esta caracterstica, aunque tambin est presente en otros que no la requieren. La personalizacin incluye tanto presentacin como funcionalidad. Por ejemplo, las

58

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

pginas de Wikipedia permiten a los usuarios identificados elegir un estilo de presentacin a su gusto; el motor de bsqueda de Google permite a los usuarios (incluso a los no registrados) decidir cuntos resultados de bsqueda quieren ver en cada pgina. Las Cookies se utilizan tambin para realizar seguimientos de usuarios a lo largo de un sitio web. Las cookies de terceros y los errores en servidores web que se explican ms abajo tambin permiten el seguimiento entre diferentes sitios. El seguimiento en un mismo sitio normalmente se hace con la intencin de mantener estadsticas de uso, mientras que el seguimiento entre sitios normalmente se orienta a la creacin de perfiles de usuarios annimos por parte de las compaas de publicidad, que luego se usarn para orientar campaas publicitarias (decidir qu tipo de publicidad utilizar) basadas en perfiles de usuarios. Una posible interaccin entre un navegador web y un servidor, en la que el servidor enva una cookie al navegador y el navegador la devuelve cuando solicita otra pgina. Tcnicamente, las cookies son trozos de datos arbitrarios definidos por el servidor web y enviados al navegador. El navegador los devuelve sin modificar al servidor, reflejando as un estado (memoria de eventos anteriores) en las transacciones HTTP, que de otra manera seran independientes de estado. Sin las cookies, cada peticin de una pgina web o un componente de una pgina web sera un evento aislado, sin ninguna relacin con el resto de peticiones de otras pginas del mismo sitio. Pero devolviendo una cookie al servidor web, el navegador le proporciona un medio para relacionar la solicitud de la pgina actual con solicitudes de pginas anteriores. Adems de ser definidas por un servidor web, las cookies tambin pueden ser

59

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

definidas por un script en un lenguaje como JavaScript, si ste est soportado y habilitado en el navegador web. Las especificaciones de cookies sugieren que los navegadores deben soportar un nmero mnimo de cookies o una cantidad mnima de memoria para almacenarlas. En concreto, se espera que un navegador sea capaz de almacenar al menos 300 cookies de 4 kilobytes cada una y al menos 20 cookies por servidor o dominio. El servidor que establece la cookie puede especificar una fecha de borrado, en cuyo caso la cookie ser borrada en esa fecha. Un sitio de compras podra querer ayudar a clientes potenciales recordando las cosas que haba en su cesta de la compra, incluso si cierran el navegador sin realizar la compra y vuelven ms tarde, para evitar que tengan que buscar los productos de nuevo. En ese caso, el servidor creara una cookie con fecha de borrado segn el deseo del diseador del sitio web. Si no se define una fecha de borrado, la cookie es borrada cuando el usuario cierra su navegador. Por lo tanto, definir una fecha de borrado es una manera de hacer que la cookie sobreviva entre sesiones. Por esta razn, las cookies con fecha de borrado se llaman persistentes . Desde su introduccin en Internet han circulado ideas equivocadas acerca de las cookies. En 2005 Jupiter Research public los resultados de un estudio, segn el cual un importante porcentaje de entrevistados crean cierta alguna de las siguientes afirmaciones:

Las cookies son similares a gusanos y virus en que pueden borrar datos

de los discos duros de los usuarios;

Las cookies son un tipo de spyware porque pueden leer informacin

60

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

personal almacenada en el ordenador de los usuarios;

Las cookies generan popups; Las cookies se utilizan para generar spam; Las cookies slo se utilizan con fines publicitarios.

En realidad, las cookies son slo datos, no cdigo, luego no pueden borrar ni leer informacin del ordenador de los usuarios. Sin embargo, las cookies permiten detectar las pginas visitadas por un usuario en un sitio determinado o conjunto de sitios. Esta informacin puede ser recopilada en un perfil de usuario. Estos perfiles son habitualmente annimos, es decir, no contienen informacin personal del usuario (nombre, direccin, etc). De hecho, no pueden contenerla a menos que el propio usuario la haya comunicada a alguno de los sitios visitados. Pero aunque annimos, estos perfiles han sido objeto de algunas preocupaciones relativas a la privacidad. Segn el mismo informe, un gran porcentaje de los usuarios de Internet no saben cmo borrar las cookies. Configuracin del navegador La mayor parte de los navegadores modernos soportan las cookies. Sin embargo, un usuario puede normalmente elegir si las cookies deberan ser utilizadas o no. A continuacin, las opciones ms comunes: 1. Las cookies no se aceptan nunca. 2. El navegador pregunta al usuario si se debe aceptar cada cookie. 3. Las cookies se aceptan siempre.

61

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

El navegador tambin puede incluir la posibilidad de especificar mejor qu cookies tienen que ser aceptadas y cules no. En concreto, el usuario puede normalmente aceptar alguna de las siguientes opciones: rechazar las cookies de determinados dominios; rechazar las cookies de terceros; aceptar cookies como no persistentes (se eliminan cuando el navegador se cierra); permitir al servidor crear cookies para un dominio diferente. Adems, los navegadores pueden tambin permitir a los usuarios ver y borrar cookies individualmente. La mayora de los navegadores que soportan JavaScript permiten a los usuarios ver las cookies que estn activas en una determinada pgina escribiendo javascript:alert("Cookies: "+document.cookie) en el campo de direccin. La especificacin P3P incluye la posibilidad de que un servidor defina una poltica de privacidad que especifique qu tipo de informacin recoge y con qu propsito. Estas polticas incluyen (entre otras cosas) el uso de informacin recopilada a travs de cookies. Segn la especificacin P3P, un navegador puede aceptar o rechazar cookies comparando la poltica de privacidad con las preferencias del usuario almacenadas, o preguntar al usuario, ofrecindole la poltica de privacidad declarada por el servidor. Privacidad y cookies de terceros Las cookies tienen implicaciones importantes en la privacidad y el anonimato de los usuarios de la web. Aunque las cookies slo se envan al servidor que las defini o a otro en el mismo dominio, una pgina web puede contener imgenes y otros componentes almacenados en servidores de otros dominios. Las cookies que se crean durante las peticiones de estos componentes se llaman cookies de terceros.

62

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Las compaas publicitarias utilizan cookies de terceros para realizar un seguimiento de los usuarios a travs de mltiples sitios. En concreto, una compaa publicitaria puede seguir a un usuario a travs de todas las pginas donde ha colocado imgenes publicitarias o web bugs. El conocimiento de las pginas visitadas por un usuario permite a estas compaas dirigir su publicidad segn las supuestas preferencias del usuario. La posibilidad de crear un perfil de los usuarios se ha considerado como una potencial amenaza a la privacidad, incluso cuando el seguimiento se limita a un solo dominio, pero especialmente cuando es a travs de mltiples dominios mediante el uso de cookies de terceros. Por esa razn, algunos pases tienen legislacin sobre cookies. El gobierno de los Estados Unidos defini estrictas reglas para la creacin de cookies en el ao 2000, despus de que se conociese que la Oficina de Control de Drogas Nacional de la Casa Blanca utilizaba cookies para seguir a los usuarios que tras visitar su campaa anti-drogas, visitaban sitios relacionados con la fabricacin o el uso de drogas. En 2002, el activista por la privacidad Daniel Brandt averigu que la CIA haba estado definiendo cookies persistentes en ordenadores durante diez aos. Cuando les inform de que estaban violando la poltica, la CIA confirm que esas cookies no haban sido creadas intencionadamente, y dej de utilizarlas. El 25 de diciembre de 2005, Brandt descubri que la Agencia de Seguridad Nacional haba estado creando dos cookies persistentes en los ordenadores de sus visitantes debido a una actualizacin de software. Tras ser informada, la agencia deshabilit inmediatamente las cookies.

63

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

La directiva de la Unin Europea de 2002 sobre privacidad en las telecomunicaciones contiene reglas sobre el uso de cookies. En concreto, en el artculo 5, prrafo 3 establece que el almacenamiento de datos (como cookies) en el ordenador de un usuario slo puede hacerse si: 1) el usuario recibe informacin sobre cmo se utilizan esos datos; y 2) el usuario tiene la posibilidad de rechazar esa operacin. Sin embargo, este artculo tambin establece que almacenar datos que son necesarios por motivos tcnicos est permitido como excepcin. Se esperaba que esta directiva hubiese comenzado su aplicacin desde octubre de 2003, pero un informe de diciembre de 2004 dice que no ha sido aplicado en la prctica, y que algunos pases miembros (Eslovaquia, Letonia, Grecia, Blgica y Luxemburgo) ni siquiera la han transpuesto a su legislacin. El mismo informe sugiere un profundo anlisis de la situacin en los estados miembros. Inconvenientes de las cookies Adems de lo relativo a la privacidad que ya se ha mencionado, hay otras razones por las que el uso de cookies ha recibido cierta oposicin: no siempre identifican correctamente a los usuarios, y se pueden utilizar para ataques de seguridad. Identificacin inexacta Si se utiliza ms de un navegador en un ordenador, cada uno tiene su propio almacenamiento de cookies. Por lo tanto, las cookies no identifican a una persona, sino a una combinacin de cuenta de usuario, ordenador y navegador. De esta manera, cualquiera que utilice varias cuentas, varios ordenadores, o varios navegadores, tiene tambin mltiples conjuntos de cookies.

64

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

De la misma manera, las cookies no diferencian entre varias personas que utilicen el mismo ordenador o navegador, si stos no utilizan diferentes cuentas de usuario. Robo de cookies Durante el funcionamiento normal, las cookies se envan de un extremo al otro entre el servidor (o grupo de servidores en el mismo dominio) y el ordenador del usuario que est navegando. Dado que las cookies pueden contener informacin sensible (nombre de usuario, un testigo utilizado como autenticacin, etc.), sus valores no deberan ser accesibles desde otros ordenadores. Sin embargo, las cookies enviadas sobre sesiones HTTP normales son visibles a todos los usuarios que pueden escuchar en la red utilizando un sniffer de paquetes. Estas cookies no deben contener por lo tanto informacin sensible. Este problema se puede solventar mediante el uso de https, que invoca seguridad de la capa de transporte para cifrar la conexin. El scripting entre sitios permite que el valor de las cookies se enve a servidores que normalmente no recibiran esa informacin. Los navegadores modernos permiten la ejecucin de segmentos de cdigo recibidos del servidor. Si las cookies estn accesibles durante la ejecucin, su valor puede ser comunicado de alguna manera a servidores que no deberan acceder a ellas. El proceso que permite a una parte no autorizada recibir una cookie se llama robo de cookies, y el cifrado no sirve contra este tipo de ataque.[10] Esta posibilidad es explotada normalmente por atacantes de sitios que permiten a los usuarios el envo de contenido HTML. Introduciendo un segmento de cdigo

65

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

adecuado en un envo HTML, un atacante puede recibir las cookies de otros usuarios. El conocimiento de estas cookies puede despus ser explotado mediante la conexin a los sitios en los que se utilizan las cookies robadas, siendo as identificado como el usuario a quien se le robaron las cookies Falsificacin de cookies Aunque las cookies deben ser almacenadas y enviadas de vuelta al servidor sin modificar, un atacante podra modificar el valor de las cookies antes de devolverlas. Si, por ejemplo, una cookie contiene el valor total de la compra de un usuario en un sitio web, cambiando ese valor el servidor podra permitir al atacante pagar menos de lo debido por su compra. El proceso de modificar el valor de las cookies se denomina falsificacin de cookies y a menudo se realiza tras un robo de cookies para hacer un ataque persistente. Sin embargo, la mayora de los sitios web solo almacenan en la cookie un identificador de sesin un nmero nico utilizado para identificar la sesin del usuario y el resto de la informacin se almacena en el propio servidor. En este caso, el problema de la falsificacin de cookies queda prcticamente eliminado. Cookies entre sitios (cross-site cooking) Cada sitio debe tener sus propias cookies, de forma que un sitio malo.net no tenga posibilidad de modificar o definir cookies de otro sitio como bueno.net. Las vulnerabilidades de cross-site cooking de los navegadores permiten a sitios maliciosos romper esta regla. Esto es similar a la falsificacin de cookies, pero el atacante se aprovecha de usuarios no malintencionados con navegadores

66

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

vulnerables, en vez de atacar el sitio web directamente. El objetivo de estos ataques puede ser realizar una fijacin de sesin (robo de sesin en un sitio web). Alternativas a las cookies Algunas de las operaciones que se pueden realizar mediante cookies tambin se pueden hacer mediante otros mecanismos. Sin embargo, estas alternativas a las cookies tienen sus propios inconvenientes, que acaban convirtiendo a las cookies en la opcin preferida en la prctica. La mayora de las alternativas descritas a continuacin permiten el seguimiento del usuario, si bien es cierto que no de forma tan fiable. Es por ello que la privacidad sigue siendo un problema, incluso si el navegador rechaza las cookies y el servidor no las define. Direccin IP Una tcnica poco fiable de realizar un seguimiento de usuarios se basa en almacenar la direccin IP del ordenador que solicita las pginas. Esta tcnica ha estado disponible desde los inicios de World Wide Web, al ser necesario para la descarga de pginas que el servidor que las tiene conozca la direccin IP del ordenador en el que corre el navegador, o de su servidor proxy si lo hay. El servidor puede guardar esta informacin, independientemente del uso o no de cookies. Sin embargo, estas direcciones son normalmente menos fiables que las cookies para la identificacin de un usuario, debido a que los ordenadores y proxies pueden estar compartidos por varios usuarios, y el mismo ordenador puede tener asignadas diferentes direcciones IP en diferentes sesiones (caso tpico en conexiones telefnicas, aunque tambin a travs de ADSL y otras tecnologas). La fiabilidad de esta tcnica se puede aumentar mediante el uso de otra caracterstica del protocolo

67

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

HTTP: cuando un navegador solicita una pgina porque el usuario ha seguido un link, la peticin que se enva al servidor contiene la URL de la pgina donde el link estaba localizado. Si el servidor almacena esas URL, se puede rastrear el camino de pginas visitadas por el usuario de forma ms precisa. Sin embargo, estos rastreos son menos fiables que los que proporcionan las cookies, ya que varios usuarios pueden acceder a la misma pgina desde el mismo ordenador, router con NAT o proxy, y despus seguir links diferentes. Adems, esta tcnica slo permite el rastreo, y no puede reemplazar a las cookies in sus otros usos. El seguimiento de direcciones IP puede ser imposible en algunos sistemas que se utilizan precisamente para mantener el anonimato en Internet, tales como Tor. Con tales sistemas, no slo puede un navegador utilizar varias direcciones a lo largo de una sesin, sino que varios usuarios podran aparecer como si utilizasen la misma direccin IP, convirtiendo por lo tanto el uso de las direcciones IP en una tcnica absolutamente intil para el rastreo de usuarios. URL (query string) Una tcnica ms precisa consiste en incrustar informacin en la URL. Normalmente se usa para este fin la query string que es parte de la URL, pero tambin se pueden utilizar otras partes. El mecanismo de sesin de PHP utiliza este mtodo si las cookies no estn habilitadas. Este mtodo consiste en que el servidor web aade query strings a los enlaces de la pgina web que contiene, a la hora de servirla al navegador. Cuando el usuario sigue un enlace, el navegador devuelve al servidor la query string aadidos a los enlaces.

68

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Las query strings utilizadas de esta manera son muy similares a las cookies, siendo ambas porciones de informacin definidos por el servidor y devueltas por el navegador posteriormente. Sin embargo, existen diferencias: dado que una query string es parte de una URL, si la URL es reutilizada posteriormente, se estar enviando al servidor la misma porcin de informacin. Si, por ejemplo, las preferencias de un usuario estn codificadas en la query string de una URL, y el usuario enva esa URL a otro usuario por algn medio, esas preferencias sern utilizadas tambin por ese otro usuario. Adems, incluso si el mismo usuario accede a la misma pgina dos veces, no hay garanta de que se utilice la misma query string en las dos. Si, por ejemplo, el mismo usuario llega a la misma pgina dos veces, una proveniente de otra pgina del mismo servidor web, y otra de un buscador, las respectivas query strings sern normalmente diferentes, mientras que las cookies hubiesen sido idnticas. Para ms detalles, vase query string. Otras desventajas de las query strings estn relacionadas con la seguridad: almacenar en una query string informacin que identifica una sesin permite o simplifica los ataques de fijacin de sesin, ataques de seguimiento de referentes y otros exploits. La transferencia de identificadores de sesin en forma de cookies es ms segura. Otra desventaja de las query strings tiene que ver con la forma en que la web est diseada. Las URL deberan apuntar a recursos y ser "opacas". Vase Representational State Transfer. Si se tiene una URL que incluye una query string, ya no es la ubicacin real del recurso.

69

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Autenticacin HTTP Para la autenticacin, el protocolo HTTP incluye mecanismos tales como el digest access authentication, que permite acceder a una pgina web slo cuando el usuario ha facilitado un nombre de usuario y contrasea correctos. Una vez que se han introducido los credenciales, el navegador las almacena y las utiliza para acceder a las pginas siguientes, sin pedirlas de nuevo al usuario. Desde el punto de vista del usuario, el efecto es el mismo que si se usan cookies: el nombre de usuario y palabra clave slo se piden una vez, y a partir de entonces el usuario obtiene acceso a las pginas del servidor. Internamente, el nombre de usuario y la contrasea se envan al servidor con cada peticin del navegador. Esto quiere decir que alguien que estuviese escuchando este trfico podra leer esta informacin y almacenarla para su uso posterior. Las sesiones, no obstante, normalmente expiran tras un periodo de inactividad determinado, quedando as invalidadas para, por ejemplo, recuperar la sesin que tena el usuario que estaba navegando. Objetos Macromedia Flash almacenados localmente Si un navegador incluye el plugin de Macromedia Flash Player, se puede utilizar la funcin Local Shared Objects del mismo, de una forma muy similar a las cookies. Los Local Stored Objects pueden ser una opcin interesante para los desarrolladores web porque la mayora de los usuarios de Windows tienen Flash Player instalado, el tamao mximo por defecto de los objetos es 100 kb, y los controles de seguridad son distintos de los controles de usuario para las cookies, de forma que los Local Shared Objects pueden estar habilitados cuando las cookies no lo estn.

70

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Persistencia en el cliente Algunos navegadores web soportan un mecanismo de persistencia basado en script que permite que la pgina almacene informacin localmente para su uso posterior. Internet Explorer, por ejemplo, soporta informacin persistente en el historial del navegador, en los favoritos, en un almacenamiento XML, o directamente en una pgina web guardada en disco. Propiedad window.name de JavaScript Si est habilitado el uso de JavaScript, se puede utilizar la propiedad window.name del objeto window para almacenar informacin de forma persistente. Esta propiedad permanece inalterada durante la carga de otras pginas web. Este pequeo hack no es muy conocido, y por lo tanto no ha sido considerado un fallo de seguridad. Adems, el uso de window.name tiene problemas de compatibilidad con navegadores, ya que que algunos, como los basados en Mozilla de los que Mozilla Firefox es un ejemplo, no soportan la persistencia con JavaScript utilizando window.name. Implementacin Creando una cookie La transferencia de pginas Web sigue HTTP. A pesar de las cookies, exploradores piden una pgina de servidores para enviarles un texto corto llamado HTTP. Por ejemplo, para acceder a la pgina http://www.w3.org/index.html, los exploradores se conectan al servidor www.w3.org mandando una peticin que se parece a la siguiente:

71

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

GET /index.html HTTP/1.1 explorador servidor

El servidor responde al enviar la pgina pedida precedida por un texto similar, llamado encabezado HTTP. Este paquete puede contener lneas peticionando al explorador para que guarde cookies: HTTP/1.1 Content-type: Set-Cookie: (content of page) explorador servidor 200 OK text/html name=value

La lnea Set-cookie es solo enviada si el servidor desea que el explorador guarde cookies. De hecho, es una peticin al explorador el guardar la secuencia name=value y enviarla de vuelta en cualquier otro futuro pedido del servidor. Si el explorador soporta cookies y las cookies estn admitidas, cada peticin de cada pgina subsecuente al mismo servidor va a contener la cookie. Por ejemplo, el explorador pide la pgina http://www.w3.org/spec.html enviando al servidor www.w3.org un pedido que se asemeja al siguiente: GET /spec.html HTTP/1.1 Cookie: Accept: name=value */*

explorador

servidor

72

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Este es un pedido para otra pgina del mismo servidor, y se diferencia del primero porque contiene la secuencia que el servidor haba previamente enviado al explorador. Por ende, el servidor sabe que este pedido est relacionado con el previo. El servidor responde al enviar la pgina pedida, posiblemente aandiendo otras cookies tambin. El valor de la cookie puede ser modificada por el servidor al enviar una nueva lnea Set-Cookie: name=newvalue en respuesta al pedido de la pgina. El explorador entonces reemplaza el viejo valor con el nuevo. La lnea Set-Cookie no es tpicamente por el servidor HTTP en s, pero por un programa CGI. El servidor HTTP solo enva el resultado del programa (un documento precedente por el encabezado contiendo cookies) al explorador. Las cookies tambin pueden ser seteadas por JavaScript o scripts similares en el explorador. En JavaScript, el objeto document.cookie es usado para este propsito. Por ejemplo, la instruccin document.cookie = "temperature=20" crea una cookie de nombre temperature y valor 20.[13] Atributos de la cookie Caducidad Cuando las cookies han caducado, estas no son enviadas al navegador; por lo tanto, la caducidad de las cookies puede ser pensada como un lmite de tiempo en el que una de ellas puede ser usadas. La cookie puede luego ser renovada despus de que este lmite haya pasado. Algunos sitios prefieren que las cookies caduquen en

73

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

tiempos ms cortos por razones de seguridad. Las cookies no se envan al navegador si ellas estn bajo estas condiciones:

al finalizar una sesin de usuario: por ejemplo, cuando se cierra el

navegador (si esta no es persistente)

Se ha fijado una fecha de caducidad y esta ha pasado. La fecha de caducidad es cambiada a una fecha anterior (por el

servidor)

esta se borra por orden del usuario.

Nota: La tercer condicin permite que un servidor elimine una cookie explcitamente. Autenticacin Muchos servidores o pginas web utilizan las cookies para reconocer usuarios que ya se hayan autenticado o para personalizar pginas web dependiendo de las opciones que un usuario seleccione. Por ejemplo, esto puede suceder cuando:

El usuario escribe su nombre y contrasea, los cuales son enviados al

servidor

El servidor verifica la informacin proporcionada, y si es correcta

devuelve una pgina de confirmacin con una cookie, guardando as esta informacin en la computadora del usuario.

Cuando el usuario visita una pgina la cual pertenece al servidor, este

verifica la existencia de las cookies y luego comprueba si las cookies existentes son iguales a las que han sido guardadas en el servidor. Si hay coincidencias, el servidor puede identificar el usuario que solicit la pgina.

74

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Este es uno de los mtodos de autenticacin ms habituales, usados por yahoo!, wikipedia, o facebook. Seguimiento Otro uso de las cookies se refiere al seguimiento de una ruta (camino) que un usuario toma cuando navega a travs de pginas web de un servidor o sitio. Esto tambin puede ser obtenido cuando se usa la direccin IP de una computadora, aunque las cookies tienen mejor precisin. Esto se puede realizar de la siguiente manera:

Si el usuario visita una pgina web pero la solicitud no contiene una

cookie, el servidor asume que esta es la primer visita a esa pgina; el servidor crea una serie de carcteres aleatorios, que luego son enviados como una cookie a de ms de la pgina solicitada.

De ahora en adelante, la cookie es enviada al servidor automticamente

por el navegador cada vez que una pgina se ha solicitado. El servidor enva una pgina como siempre, pero la fecha y hora son guardadas en un registro de la visita con la cookie. Si luego se lee el registro, es posible identificar cuando, quin, y la secuencia en la cual un usuario

accedi a que pginas. Cesta Algunas pginas web, en particular pginas de compra o venta de productos permiten que usuarios guarden objetos en una "cesta virtual" as ellos estn fuera de sesin. Una lista de estos objetos puede ser almacenada en una cookie. Por

75

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

ejemplo, cuando el usuario agrega un elemento a su canasta virtual, el servidor agrega el nombre de este objeto a la cookie. Sin embargo, este es un mtodo muy inseguro y puede que la cookie sea fcilmente alterada por otro usuario. Una mejor forma podra ser que se genere una cookie de "seguimiento" aleatoria y luego usarla como una referencia en el servidor. 1.3 Introduccin al HTML. 1.3.1 HTML como un tipo SGML. El HTML (Hyper Text Markup Language) es el lenguaje con el que se escriben las pginas web. Es un lenguaje de hipertexto, es decir, un lenguaje que permite escribir texto de forma estructurada, y que est compuesto por etiquetas, que marcan el inicio y el fin de cada elemento del documento. Como su nombre lo indica, el principal objetivo del lenguaje HTML es el permitir a diversos documentos de texto comunicarse entre ellos por medio de hiperenlaces (HiperText) a nivel local o remoto. Adems, incorpora elementos para la maquetacin y aplicacin de formatos y estilos a esos documentos. Un documento hipertexto no slo se compone de texto, puede contener imgenes, sonido, vdeos, etc., por lo que el resultado puede considerarse como un documento multimedia. Los documentos HTML deben tener la extensin html o htm, para que puedan ser visualizados en los navegadores (programas que permiten visualizar las pginas web).

76

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Los navegadores se encargan de interpretar el cdigo HTML de los documentos, y de mostrar a los usuarios las pginas web resultantes del cdigo interpretado. Existen varias recomendaciones de la W3C para este lenguaje correspondiente a sus diversas versiones; no obstante, podemos decir que los autenticos estndares son los establecidos en las el HTML bsico, el correspondiente al denominado HTML estatico y diseado principalmente para dar formato a los contenidos y permitir la interrelacin entre documentos. se puede decir que la nica interactividad existente con el usuario es la proporcionada por eso hiperenlaces, es decir, la posibilidad de acceder a otros documentos existentes en cualquier lugar de la red. por el dominio DHTML (Dynamic HTML o HTML dinamico) y , entre sus principales caractersticas, esta la utilizacin de nuevas etiquetas y nuevos atributos destinados a proporcionar soporte a las hojas de estilo en cascada ( CSS), al los lenguajes script, la posibilidad de poder incluir programas externos (applets, controles activeX, etc.) , un amplio soporte multimedia y acceso a bases de datos. Las recomendaciones de HTML 3.2; esto nos permitir conocer sus posibilidades y limitaciones.

77

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

1.3.2 Elementos del lenguaje HTML. Los elementos del lenguaje HTML son tratados como objetos, con propiedades y mtodos; por ello, pueden ser programados pudiendo modificar su aspecto y comportamiento mientras se visualiza la pgina, es decir, son objetos dinmicos A lo largo de este tema vamos a aprender a crear una pgina bsica. La estructura bsica de una pgina es: Titulo del documento ...contenido de la seccin de cabecera (metainformacion) ...contenido de la seccin del cuerpo del documento Como puede observar, las etiquetas que representan a un determinado elemento HTML suelen ir por parejas: existe una etiqueta para marcar el ndice del documento

78

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

y otra para indicar su final; entre ambas se situa el contenido. El contenido puede estar formado por otros elementos HTML ( otras etiquetas) o texto. Los elementos HEAD y BODY son contenidos del elemento HTML ( tambin denominado elemento raz del documento) y sirve para delimitar las dos secciones de las cuales consta todo documento HTML. El nombre de las etiquetas inicial y final es el mismo: el correspondiente al elemento va entre las marcas menor que( ). La etiquete de cierre utiliza dems delante el nombre del elemento el smbolo de barra inclinada ( / ). La marca representativa de las etiquetas de cierre es, por lo tanto, son dos caracteres especiales que indican inicio y fin de etiqueta. Si se desea insertar estos caracteres como texto hay que escribir el nombre que los representa: < Se representa con < > Se representa con > Existen otra serie de caracteres que no se visualizan correctamente en algunos navegadores, como es el caso de la y las letras acentuadas, por lo que al igual que ocurre con los caracteres especiales < y >, para insertarlos como texto habra que escribir el nombre que los representa.

81

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Carcter & "

Representacin & "

A continuacin se muestra una lista con algunos caracteres y el nombre con el que han de ser representados: Carcter < > Representacin < >

82

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Tabla 7 Palabras reservadas para agregar caracteres especiales Siempre que se inserta texto en HTML hay que tener en cuenta que si se escriben varios espacios en blanco seguidos slamente se mostrar uno en el navegador. Para conseguir que se muestren varios espacios en blanco seguidos puede sustituirse cada uno de ellos por . Comentarios En ocasiones podemos desear aadir comentarios aclaratorios dentro del cdigo, de manera que no sean visualizados en el navegador, pero s a la hora de editar el documento. Para insertar comentarios dentro del cdigo, basta con insertar el texto entre .

83

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Todo el cdigo que se inserte entre estos smbolos no ser visualizado en los navegadores.

Saltos de lnea En general, cuando trabajamos con un editor de texto se produce un salto de lnea al pulsar la tecla INTRO. Si pulsamos INTRO en un documento HTML, el salto de lnea se producir en el cdigo, pero no se mostrar en el navegador. Para que se produzca el salto de lnea en el navegador, en lugar de pulsar la tecla INTRO hay que insertar la etiqueta donde se desee que se produzca el salto. La etiqueta no precisa ninguna etiqueta de cierre. No hay que insertar la etiqueta despus de ella, ya que dicha etiqueta no existe. Texto preformateado Una forma de asegurarnos de que el texto aparezca en el navegador tal cual ha sido insertado dentro del cdigo, es utilizando las etiquetas y . Utilizando estas etiquetas podemos tener la seguridad de que en el navegador se mostrarn todos los espacios en blanco que se inserten en el texto, as como todos los saltos de lnea resultantes de pulsar la tecla INTRO, sin la necesidad de utilizar la etiqueta . El inconveniente de esta etiqueta es que entre las etiquetas y no se pueden incluir las etiquetas (para incluir imgenes), (para incluir objetos como animaciones), , , ni

84

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Separadores El elemento que suele utilizarse para separar secciones dentro de una misma pgina es la regla horizontal. Para insertar una regla horizontal hay que insertar la etiqueta . Dicha etiqueta no precisa ninguna etiqueta de cierre. Es posible especificar algunos atributos de la regla horizontal: Atributo Align Significado alineacin de la regla dentro de la pgina Posibles valores left right center (centro) Width ancho de la regla un nmero, acompaado de % cuando se desee que sea en porcentaje Size Noshade alto de la regla eliminar el sombreado de la regla Sangrado de texto La sangra es una especie de margen que se establece a ambos lados del texto. Para que un texto aparezca sangrado, se inserta entre las etiquetas y . un nmero no puede tomar valores (izquierda) (derecha)

85

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Esta etiqueta en un principio se defini para delimitar citas pero que como la mayora de los navegadores resuelven la cita incluyendo un sangrado del texto, su uso para sangrar texto se ha generalizado.

El uso de la etiqueta obliga a que el texto aparezca en una nueva lnea. Insertando el texto entre varias etiquetas y se consigue que los mrgenes sean mayores. Formatear el texto Las propiedades del texto pueden modificarse a travs de la etiqueta . Para ello, podemos insertar el texto entre las etiquetas y , especificando algunos de los atributos de la etiqueta: Atributo Face Color Significado Fuente color texto tamao texto del del Posibles valores nombre de la fuente, o fuentes nmero hexadecimal o texto predefinido valores del 1 al 7, siendo por defecto el 3, o desplazamiento respecto al tamao por defecto, aadiendo + o - delante del valor

Size

Tambin es posible definir una fuente para todo el documento. Para ello, hay que insertar la etiqueta despus de la etiqueta . La etiqueta no necesita una etiqueta de cierre, y permite modificar los mismos atributos del texto que la etiqueta .

86

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Este cdigo hara que la fuente del documento fuera por defecto de color azul, de tamao 4 y Arial. Si despus de indicar la etiqueta o , el navegador encuentra otra etiqueta , la que prevalece es siempre la ltima que se encuentra.

Resaltado del texto ... Existen una serie de etiquetas que permiten aplicar diferentes estilos al texto que se encuentra entre ellas, y generalmente se utilizan para resaltarlo. Estos estilos pueden agruparse segn vayan asociados al tipo de letra o a la informacin que represente el texto. No hay que olvidar que todas estas etiquetas necesitan una etiqueta de cierre, y que pueden aplicarse varias etiquetas al mismo texto. A continuacin se muestran algunas etiquetas asociadas al tipo de letra: Etiqueta Significado negrita cursiva subrayado tachado teletipo (mquina de escribir) aumenta el tamao de la fuente disminuye fuente el tamao de la

A continuacin se muestran algunas etiquetas asociadas al tipo de informacin:

87

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Etiqueta

Significado cita ejemplo de cdigo definicin eliminado nfasis insertado teclado muestra destacado subndice superndice variable

Las etiquetas ms utilizadas son las asociadas al tipo de letra, ya que son ms fciles de recordar, y en muchos casos los resultados son los mismos que los de aplicar una etiqueta diferente. Por ejemplo, el resultado de aplicar las etiquetas y es el mismo. Incluso a veces algunos estilos asociados al tipo de informacin pueden representarse de forma distinta segn el navegador. Prrafos ... El texto de una pgina puede agruparse en prrafos. Para ello, el texto de cada uno de los prrafos debe insertarse entre las etiquetas y . No es necesario insertar la etiqueta para que un nuevo prrafo aparezca debajo del anterior, ya que las etiquetas y hacen que se cambie de lnea automticamente.

88

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Tambin es posible cambiar la alineacin del texto de cada prrafo. Para ello se modifica el valor del atributo align, cuyos valores pueden ser left (izquierda), right (derecha), center (centrado) o justify (justificado). Otra forma de cambiar la alineacin del texto es mediante las etiquetas y , para las que tambin existe el atributo align. La etiqueta , al igual que la

etiqueta , se utiliza para agrupar bloques de texto, pero con la diferencia de que la separacin entre ellos es menor. Tambin es posible insertar el texto entre las etiquetas y para que aparezca centrado. Otro par de etiquetas que permiten agrupar bloques de texto, pero que no implican el cambio de lnea (como en el caso de y ), son las etiquetas y volveremos a hablar de estas etiquetas cuando veamos las hojas de estilo. Encabezados ... Existen una serie de encabezados que suelen utilizarse para establecer ttulos dentro de una pgina. La diferencia entre los distintos tipos de encabezado es el tamao de la letra, el tipo de resaltado, y la separacin existente entre el texto y los elementos que tiene encima y debajo de l. Hay que tener en cuanta que el navegador del usuario es el que aplicar el estilo del encabezado por lo que el mismo ttulo se puede visualizar de forma diferente segn el navegador. Existen seis etiquetas que representan seis tipos de cabeceras distintas. Todas estas etiquetas precisan una etiqueta de cierre.

89

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

A continuacin se muestran los distintos encabezados existentes: Etiqueta Ejemplo Ttulo 1: HTML Ttulo 2: HTML Ttulo 3: HTML Ttulo 4: HTML Ttulo 5: HTML Ttulo 6: HTML

Para todas estas etiquetas es posible especificar el valor del atributo align. Marquesinas Las marquesinas son lneas de texto que pueden desplazarse de un lado a otro de la ventana en forma de lnea. Para insertar una marquesina, es necesario insertar el texto entre las etiquetas y . La marquesina, por defecto, se desplaza de derecha a izquierda indefinidamente, pero si lo deseas puedes hacer que estas propiedades varen. A travs del atributo behavior puede modificarse el tipo de movimiento. Puede tomar los valores alternate (de lado a lado de la ventana, como si rebotara en los extremos), scroll (de un lado a otro, continuamente) o slide (de un lado a otro, pero una sola vez). A travs del atributo direction puede modificarse la direccin en la que se mover el texto. Puede tomar los valores down (de arriba a abajo), up (de abajo a arriba), left

90

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

(de derecha a izquierda) o left (de izquierda a derecha). Tambin es posible establecer un color de fondo, a travs del atributo bgcolor. Es posible insertar imgenes, tablas y otros elementos entre las etiquetas y , no slamente texto.

Las listas ... Cada uno de los elementos de una lista ha de insertarse entre las etiquetas y . Todos los elementos de la lista debern encontrarse entre las etiquetas que indiquen si la lista es desordenada (con vietas) u ordenada (numerada) como veremos a continuacin. Lista desordenada Para que una lista sea desordenada, sus elementos debern encontrarse entre las etiquetas y . A travs del atributo type es posible elegir el tipo de vieta, que puede ser circle (crculo), disc (disco) o square (cuadrado). Lista ordenada Para que una lista sea ordenada, sus elementos debern encontrarse entre las etiquetas y . A travs del atributo type es posible elegir el tipo de numeracin, que puede ser 1 (nmeros), a (letras minsculas), A (letras maysculas), i (numeros romanos en minsculas) o I (nmeros romanos en maysculas).

91

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Es posible anidar listas dentro de otras. Estas listas pueden ser tanto desordenadas como ordenadas. Empezamos por la lista ordenada (la ms externa) , esta lista tiene dos elementos Lunes y Martes. El elemento Lunes contiene una lista desordenada con tipo cuadrado que tiene dos elementos Ingles y Frances.

El elemento Martes contiene una lista ordenada de un slo elemento Ingles elemento que contiene a su vez una lista desordenada de tipo letras maysculas con los dos elementos Correccion de ejercicios y Proponer ejercicios Hiperenlace Un hiperenlace, hipervnculo, o vnculo, no es ms que un enlace, que al ser pulsado lleva de una pgina o archivo. Aquellos elementos (texto, imgenes, etc.) sobre los que se desee insertar un enlace han de encontrarse entre las etiquetas y . A travs del atributo href se especifica la pgina a la que est asociado el enlace, la pgina que se visualizar cuando el usuario haga clic en el enlace. Tipos de referencias Existen diferentes formas de expresar una referencia a una pgina a travs del atributo href. Referencia absoluta:

92

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Conduce a una ubicacin externa al sitio en el que se encuentra el documento. La ubicacin es en Internet, en este caso hay que empezar la referencia por http:// , el nombre del dominio y algunas veces el nombre de la pgina. Si no se escribe el nombre de la pgina se cargar la pgina de inicio asociada al dominio.

Referencia relativa al sitio: Conduce a un documento situado dentro del mismo sitio que el documento actual. Un sitio web es un conjunto de archivos y carpetas, relacionados entre s, con un diseo similar o un objetivo comn, estando todos ellos dentro de una misma carpeta, conocida como carpeta raz del sitio. Referencia relativa al documento: Conduce a un documento situado dentro del mismo sitio que el documento actual, pero partiendo del directorio en el que se encuentra el actual. Punto de fijacin: Conduce a un punto dentro de un documento, ya sea dentro del actual o de otro diferente. Para ello el vnculo debe ser "nombre_de_documento#nombre_de_punto". Teniendo en cuenta que el documento se llama t_4_1.htm y el punto de fijacin se llama tipos. Al final de este tema vers cmo definir el punto de fijacin.

93

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Destino del enlace El destino del enlace determina en qu ventana va a ser abierta la pgina vinculada, se especifica a travs del atributo target al que se le puede asignar los siguientes valores: _blank: Abre el documento vinculado en una ventana nueva del navegador.

_parent: Abre el documento vinculado en la ventana del marco que contiene el vnculo o en el conjunto de marcos padre. _self: Es la opcin predeterminada. Abre el documento vinculado en el mismo marco o ventana que el vnculo. _top: Abre el documento vinculado en la ventana completa del navegador. Es interesante utilizar esta opcin cuando la pgina de destino est fuera de nuestro sitio para que cuando el usuario cierre la ventana del explorador, se encuentre automticamente en la pgina desde la que haba salido (que vuelva a nuestro sitio). Formato de los enlaces Los colores de los vnculos pueden especificarse a travs de las propiedades de la pgina, en la etiqueta . Estos colores se asignan a travs de los atributos link (vnculo), alink (vnculo activo), y vlink (vnculo visitado).

94

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

link permite determinar el color de los enlaces sin visitar (enlace que no ha sido pulsado ninguna vez). alink permite determinar el color del enlace activo (enlace que acaba de ser pulsado). vlink permite determinar el color de los enlaces visitados (enlaces que ya han sido pulsados).

Puntos de fijacin. Anclas Cuando se tienen documentos extensos, divididos en varios apartados, es preferible poder ir directamente al apartado deseado, en lugar de ir al comienzo del documento. Para ello se utilizan las anclas, o puntos de fijacin, muy tiles a la hora de crear ndices. Un ancla necesita que se inserten las y , con el atributo name, que puede tomar cualquier valor inventado por el usuario, se recomienda no utilizar caracteres especiales. Otros tipos de enlaces Existen otros tipos de enlaces que no conducen a otra pgina web, los veremos a continuacin: Correo electrnico:

95

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Abre la aplicacin Outlook Express para escribir un correo electrnico, cuyo destinatario ser el especificado en el enlace. Para ello la referencia del vnculo debe ser "mailto:direcciondecorreo". Vnculo a ficheros para descarga: El valor del atributo href normalmente ser una pgina web (con extensin htm, html, asp, php...) pero tambin puede ser un fichero comprimido, una hoja de Excel, un documento Word, un documento con extensin pdf. Cuando el enlace no es a una pgina Web nos aparecer el cuadro de dilogo que seguro habrs visto alguna vez en el que el navegador le pide al usuario permiso para descargar el fichero en su ordenador.

Vnculo vaco: Al pulsar sobre un enlace vaco no se abre ninguna pgina ni archivo, pero el formato es el mismo que el de cualquier otro enlace. El vnculo debe ser el smbolo almohadilla "#". Este tipo de enlace resulta til para trabajar con comportamientos javascript. IMAGEN Todas las pginas web acostumbran a tener un cierto nmero de imgenes, que permiten mejorar su apariencia, o dotarla de una mayor informacin visual. Para insertar una imagen es necesario insertar la etiqueta . Dicha etiqueta no necesita etiqueta de cierre. El nombre de la imagen ha de especificarse a travs del atributo src.

96

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Para trabajar de una forma ms sencilla y ordenada, es recomendable que todos los documentos html se encuentren en un mismo directorio, y que dentro de este directorio existan diferentes carpetas para agrupar otros objetos, como puede ser una carpeta destinada a almacenar imagenes, o una carpeta destinada a almacenar archivos de audio, etc. Formatos de imagen Las imgenes pueden ser de muchos formatos diferentes: bmp, gif, jpg, etc. Pero no todos estos formatos son adecuados para una web, debido a que pueden ocupar mucha memoria o a que no son compatibles con algunos navegadores.

Los formatos ms utilizados son el GIF y el JPG, que a pesar de ser imgenes de menor calidad que las imgenes BMP, son ms recomendables debido a que ocupan menos memoria. Vamos a ver un poco ms sobre estos formatos: son recomendables para imgenes con grandes reas de un mismo color o de tonos no continuos. Suelen utilizarse con gran frecuencia, ya que permiten definir transparencias y

97

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Las imgenes son de mayor calidad que las GIF, al poder contener millones de colores, pero el tamao de la imagen es mayor y tarda ms en descargarse se utilizan ms para fotos. Puedes incluir imgenes en otros formatos, que podrn ser visualizadas en algunos navegadores. Este es el caso de las imgenes BMP y PNG. Puedes cambiar el formato de las imgenes mediante la utilizacin de algn programa de tratamiento de imgenes, como pueden ser Fireworks, Photoshop, Corel Draw, etc. Por ejemplo el Fireworks de Macromedia tiene una opcin, exportar a tipo gif que reduce considerablemente la ocupacin de la imagen sin perder en calidad (siempre que la imagen se adecue al formato).

Dependiendo del programa utilizado existir una mayor o menor cantidad de opciones a la hora de modificar las imgenes. Para realizar modificaciones sencillas, como la de recortar las imgenes y cambiar los colores, puedes utilizar incluso el programa Paint de Windows Texto alternativo Cuando una imagen no puede ser visualizada en el navegador, cosa que puede ocurrir al especificar mal el valor del atributo src, aparece un recuadro blanco con una X roja en su lugar, junto con el nombre de la imagen.

98

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Podemos hacer que en lugar de mostrarse el nombre de la imagen aparezca el texto que nosotros deseemos, gracias al atributo alt. Borde de una imagen En general, al visualizar una pgina en un navegador las imgenes aparecen sin ningn borde alrededor, pero es posible establecer uno a travs del atributo border. El atributo border puede tomar valores numricos, que indican el grosor en pxeles del borde. Tamao de una imagen Cuando insertamos una imagen, esta se muestra en los navegadores con su tamao original, pero por diversos motivos puede interesarnos modificar dicho tamao.

A travs de los atributos width (anchura) y height (altura) puede modificarse el tamao de la imagen. Dicho cambio de tamao no se aplica directamente sobre el archivo de imagen, sino que lo que vara es la visualizacin de la imagen en el navegador. El valor que pueden tomar los atributos width y height ha de ser un nmero, acompaado de % cuando se desee que sea en porcentaje con respecto a la pgina. Alineacin de una imagen

99

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

La alineacin de las imgenes se establece a travs del atributo align. Este atributo indica la alineacin de las imgenes con respecto a la lnea de texto en la que se encuentran. Los valores del atributo align pueden ser los siguientes: Valor absbottom absmiddle baseline bottom left middle right texttop top Significado inferior absoluta medio absoluta lnea de base inferior izquierda medio derecha texto superior superior

1.3.3 Tablas en HTML. En este tema vamos a ver cmo trabajar con tablas. Podremos insertar tablas, filas y columnas, y modificar sus propiedades. Hoy en dia, la mayora de las pginas web se basan en tablas, ya que resultan de gran utilidad al mejorar notablemente las opciones de diseo. Todos los objetos se alinean por defecto a la izquierda de las pginas web, pero gracias a las tablas es posible distribuir el texto en columnas, colocar imgenes al

100

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

lado de un bloque de texto, y otra serie de cosas que sin las tablas seran imposibles de realizarse. Para crear una tabla hay que insertar las etiquetas y . Entre dichas etiquetas habr que especificar las filas y columnas que formarn la tabla. Fila Es necesario insertar las etiquetas y por cada una de las filas de la tabla. Estas etiquetas debern insertarse entre las etiqetas y . Columna o celda Para crear una tabla no basta con especificar el nmero de filas, es necesario tambin especificar el nmero de columnas. Una celda es el resultado de la interseccin entre una fila y una columna, por lo que podremos especificar el nmero de celdas por fila, que equivale a especificar el nmero de columnas por fila.

Es necesario insertar las etiquetas y por cada una de las celdas que compongan cada una de las filas de la tabla. Por lo tanto, habr que insertar esas etiquetas entre las etiquetas y . Entre las etiquetas y se podr especificar el contenido de cada una de las celdas. Formato de la tabla

101

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Es posible modificar los siguientes atributos de una tabla: Atributo Width Significado ancho de la tabla Posibles valores un nmero, acompaado de %

cuando se desee que sea en porcentaje un nmero, acompaado de %

Height

altura de la tabla espacio entre el

cuando se desee que sea en porcentaje

cellpadding contenido de las celdas y el borde cellspacing Border espacio entre celdas grosor del borde alineacin de la tabla

un nmero

un nmero un nmero left right center (centro) nmero hexadecimal nmero hexadecimal nmero hexadecimal (izquierda) (derecha)

Align

dentro de la pgina color de fondo imagen de fondo color del borde

Bgcolor background bordercolor

Formato de las celdas Es posible modificar los siguientes atributos de una celda: Atributo Width Significado ancho de la tabla Posibles valores un nmero, acompaado de %

cuando se desee que sea en porcentaje un nmero, acompaado de %

Height

altura de la tabla

cuando se desee que sea en porcentaje

102

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Align

alineacin horizontal del contenido de la celda

left right center (centro) baseline (lnea de

(izquierda) (derecha)

base) (inferior) (medio)

Valign

alineacin

vertical

del bottom middle top (superior)

contenido de la celda

Bgcolor Backgrou nd Bordercol or

color de fondo imagen de fondo

nmero hexadecimal nmero hexadecimal

color del borde

nmero hexadecimal

Tambin es posible modificar estos atributos de toda una fila, especificndolos en la etiqueta , en lugar de en la etiqueta .

Existe otro atributo que puede establecerse sobre las celdas. Se trata del atributo nowrap, que hace que el contenido de la celda no se ajuste de manera automtica al ancho de la columna sino que el ancho de la celda se adapta al ancho del contenido para que el contenido ocupe una slo fila. Este atributo no toma ningn valor, simplemente se aade o no a las etiqueta . Encabezado de columna

103

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Las etiquetas y se utilizan para definir las celdas de cada una de las filas, pero podemos poner en su lugar las etiquetas y . Para la etiqueta es posible especificar los mismos atributos que para la etiqueta , pero esta nueva etiqueta hace que el texto de la celda aparezca centrado y en negrita, por lo que se utiliza para definir los encabezados o ttulos de las columnas. Ttulo de tabla No solamente es posible establecer ttulos para las columnas, tambin es posible establecer un ttulo para la tabla mediante las etiquetas y . Estas etiquetas han de ir despus de la etiqueta , y puede especificarse el valor de los atributos align (con los valores bottom, center, left, right y top) y valign (con los valores bottom y top).

Combinar celdas Para las etiquetas y existen los atributos colspan y rowspan, que se utilizan para combinar celdas. A travs del atributo colspan se especifica el nmero de columnas por las que se extender la celda, y a travs del atributo rowspan se especifica el nmero de filas por las que se extender la celda.

104

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

1.3.4 Formularios. Un formulario es un elemento que permite recoger datos introducidos por el usuario. Los formularios se utilizan para conocer las opiniones, dudas, y otra serie de datos sobre los usuarios, para introducir pedidos a travs de la red, tienen multitud de aplicaciones. Un formulario est formado, entre otras cosas, por etiquetas, campos de texto, mens desplegables, y botones. Es muy recomendable utilizar tablas para organizar los elementos de los formularios. Utilizando tablas se consigue una mejor distribucin de los elementos del formulario, lo que facilita su comprensin y mejora su apariencia. Los formularios se insertan a travs de las etiquetas y . Entre dichas etiquetas habr que insertar los diferentes objetos que formarn el formulario. la etiqueta tiene los siguientes atributos: El atributo action indica una direccin de correo electrnico a la que mandar el formulario, o la direccin del programa que se encargar de procesar el contenido del formulario.

El atributo enctype indica el modo en que ser cifrada la informacin para su envo. Por defecto tiene el valor application/x-www-form-urlencoded. El atributo method indica el metodo mediante el que se transferirn las variables del formulario. Su valor puede ser get o post.

105

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

El valor get se utiliza cuando no se van a producir cambios en ningn documento o programa que no sea el navegador del usuario que pretende mandar el formulario, como ocurre cuando se realizan consultas sobre una base de datos. El valor post se utiliza cuando s se van a producir cambios, como ocurre cuando el usuario manda datos que deben ser almacenados en una base de datos. Se recomienda utilizar el valor post. reas de texto Las reas de texto permiten a los usuarios insertar varias lneas de texto. Por ello, suelen utilizarse para que incluyan comentarios. Para insertar un rea de texto es necesario incluir las etiquetas y entre las etiquetas y del formulario. Para que el rea de texto tenga algn valor inicial, habr que insertarlo entre las etiquetas y .

El atributo name indica el nombre del rea de texto. Es necesario dar nombres diferentes a cada uno de los elementos de un formulario, para poder identificarlos a la hora de procesarlos.

106

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

El atributo rows indica el nmero de lneas que podrn ser visualizadas en el rea de texto por lo que determina al alto del rea de texto. El atributo cols indica el nmero de caracteres por lnea que podrn ser visualizados en el rea de texto por lo que determina al ancho del rea de texto. Gracias a las barras de desplazamiento, es posible insertar ms lneas de las especificadas en el atributo rows, y ms caracteres por lnea de los especificados en el atributo cols. Elementos de entrada Para insertar un elemento de entrada es necesario incluir la etiqueta entre las etiquetas y del formulario. El atributo name indica el nombre que se desea dar al elemento de entrada, mediante el cual ser evaluado, y el atributo type indica el tipo de elemento de entrada. Vamos a ver los diferentes tipos de elementos de entrada, y el resto de atributos que pueden definirse para cada uno de ellos. Campo de texto: Para insertar un campo de texto, el atributo type debe tener el valor text.

El atributo size indica el nmero de caracteres que podrn ser visualizados en el campo de texto, determina el ancho de la caja.

107

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

El atributo maxlenght indica el nmero de caracteres que podrn ser insertados en el campo de texto. El atributo value indica el valor inicial del campo de texto. Campo de contrasea: Para insertar un campo de contrasea, el atributo type debe tener el valor password. El resto de atributos son los mismos que para un campo de texto normal. La nica diferencia es que todas las letras escritas en el campo de contrasea sern visualizadas como asteriscos. Botn: Para insertar un botn, el atributo type debe tener el valor submit, restore o button. Si el valor es submit, al pulsar sobre el botn se enviar el formulario. Si el valor es restore, al pulsar sobre el botn se restablecer el formulario, borrndose todos los campos del formulario que hayan sido modificados y adquiriendo su valor inicial. Si el valor es button, al pulsar sobre el botn no se realizar ninguna accin. El atributo value indica el texto que mostrar el botn.

Casilla de verificacin:

108

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Para insertar una casilla de verificacin, el atributo type debe tener el valor checkbox. El atributo value indica el valor asociado a la casilla de verificacin. Es necesario poner este atributo, aunque el usuario no pueda ver su valor. Es el valor a enviar. La aparicin del atributo checked indica que la casilla aparecer activada inicialmente. Este atributo no toma valores. Botn de opcin: Para insertar un botn de opcin, el atributo type debe tener el valor radio. El atributo value indica el valor asociado al botn de opcin. Es necesario poner este atributo, aunque el usuario no pueda ver su valor. Es el valor a enviar. La aparicin del atributo checked indica que el botn aparecer activado inicialmente. Este atributo no toma valores. Los botones de opcin se utilizan cuando se desea que una variable del formulario pueda tomar un solo valor de entre varios posibles. Para ello, se insertan varios botones de opcin con el mismo nombre (que indica la variable) y con distintos valores. Slamente uno de estos botones podr estar activado, el que est activado cuando se envia el formulario, su valor ser el que tendr la variable.

109

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Existen otros tipos como el tipo hidden que sirve para definir un campo oculto, campo que no ve el usuario, en este caso habra que incluir el atributo value para que el formulario pase ese valor al programa que recoge los datos del formulario. Para que el usuario envie un fichero suyo a travs del formulario tenemos el tipo file, este tipo hay que utilizarlo con mucho cuidado ya que si permitimos que cualquier internauta nos envie cualquier tipo de fichero nos podramos encontrar con sorpresa no siempre agradables. 1.4 Evolucin del desarrollo de aplicaciones Web. Internet tiene un impacto profundo en el trabajo, el ocio y el conocimiento. Gracias a la web, millones de personas tienen acceso fcil e inmediato a una cantidad extensa y diversa de informacin en lnea. Un ejemplo de esto es el desarrollo y la distribucin de colaboracin del software de Free/Libre/Open-Source (SEDA) por ejemplo GNU, Linux, Mozilla y OpenOffice.org. Comparado a las enciclopedias y a las bibliotecas tradicionales, la web ha permitido una descentralizacin repentina y extrema de la informacin y de los datos. Algunas compaas e individuos han adoptado el uso de los weblogs, que se utilizan en gran parte como diarios actualizables. Algunas organizaciones comerciales animan a su personal para incorporar sus reas de especializacin en sus sitios, con la esperanza de que impresionen a los visitantes con conocimiento experto e informacin libre. Internet ha llegado a gran parte de los hogares y de las empresas de los pases ricos, en este aspecto se ha abierto una brecha digital con los pases pobres, en los

110

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

cuales la penetracin de Internet y las nuevas tecnologas es muy limitada para las personas. Desde una perspectiva cultural del conocimiento, internet ha sido una ventaja y una responsabilidad. Para la gente que est interesada en otras culturas proporciona una cantidad significativa de informacin y de una interactividad que sera inasequible de otra manera. Ocio La pornografa y la industria de los videojuegos representan buena parte del ocio en la WWW y proporcionan a menudo una fuente significativa del rdito de publicidad para otros sitios de la red. Muchos gobiernos han procurado sin xito poner restricciones en el uso de ambas industrias en Internet. Una rea principal del ocio en el Internet es el sistema Multijugador. Muchos utilizan el Internet para descargar msica, pelculas y otros trabajos. Hay fuentes pagadas y gratuitas para todo esto, usando los servidores centralizados y distribuidos, las tecnologas de P2P. Otros utilizan la red para tener acceso a las noticias y el estado del tiempo. La mensajera instantnea o chat y el E-mail son algunos de los servicios de uso ms extendido. Internet y su evolucin Antes Internet nos serva para un objetivo claro. Navegbamos en Internet para algo muy concreto. Ahora quizs tambin pero sin duda alguna hoy nos podemos

111

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

perder por el inmenso abanico de posibilidades que nos brinda la Red. Hoy en da, la sensacin que nos produce Internet es un ruido interferencias un explosivo cmulo de ideas distintas de personas diferentes de pensamientos distintos de tantas y tantas posibilidades que para una mente exceda in extremis. El crecimiento o ms bien la incorporacin de tantas personas a la Red hace que las calles de lo que en principio era una pequea ciudad llamada Internet se conviertan en todo un planeta extremadamente conectado entre s entre todos sus miembros. El hecho de que Internet haya aumentado tanto implica una mayor cantidad de relaciones entre personas pero unas relaciones virtuales. As ahora sabemos que nos relacionamos ms virtualmente y menos personalmente sabiendo este hecho y relacionndolo con la felicidad originada por las relaciones personales podemos concluir que cuando una persona tenga una necesidad de conocimiento popular conocimiento no escrito en libros recurrir a la fuente ms fiable ms acorde a su necesidad y ms accesible que le sea posible. Como ahora esta fuente es posible en Internet dicha persona preferir prescindir del obligado protocolo que hay que cumplir a la hora de acercarse a alguien personalmente para obtener dicha informacin y por ello por elegir no establcer una relacin personal sino virtual slo por ese motivo disminuirn las relaciones personales con respecto al pasado ms inmediato. Este hecho lejos de ser perjudicial para la especie humana, para la supervivencia que es para lo que estamos hechos lejos de obstruir, implica la existencia de un medio capaz de albergar soluciones para problemas que antes eran mucho ms difciles de resolver.

112

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Como toda gran revolucin Internet augura una nueva era de diferentes mtodos de resolucin de problemas creados a partir de soluciones anteriores. Internet produce la sensacin que todos hemos sentido alguna vez produce la esperanza que necesitamos cuando queremos conseguir algo. Produce un despertar de intenciones que jams antes la tecnologa haba logrado en la poblacin mundial. Genera una sensacin de cercana de empata de comprensin, y a la vez de confusin de discusin de lucha y de guerras que no queda otra que afirmar que Internet es Humana Internet es como la vida misma. Trabajo Con la aparicin de Internet y de las conexiones de alta velocidad disponibles al pblico, Internet ha alterado de manera significativa la manera de trabajar de millones de personas. Internet ha permitido mayor flexibilidad en trminos de horarios y de localizacin, contrariamente a la jornada laboral tradicional de 9 a 5 en la cual los empleados se desplazan al lugar de trabajo. Un experto contable que se sienta en un pas puede revisar los libros de otra compaa en otro pas, en un servidor situado en un tercer pas que sea mantenido remotamente por los especialistas en un cuarto. Internet y sobre todo los blogs han dado a los trabajadores un foro en el cual expresar sus opiniones sobre sus empleos, jefes y compaeros, creando una cantidad masiva de informacin y de datos sobre el trabajo que est siendo recogido actualmente por el proyecto de Worklifewizard.org, por el colegio de abogados de Harvard y el programa de Worklife.

113

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Internet ha impulsado el fenmeno de la Globalizacin y junto con la llamada desmaterializacin de la economa ha dado lugar al nacimiento de una Nueva Economa caracterizada por la utilizacin de la red en todos los procesos de incremento de valor de la empresa. Publicidad en Internet Internet, se ha convertido en el medio ms medible y de ms alto crecimiento en la historia. Actualmente existen muchas empresas que obtienen dinero de la publicidad en Internet. Adems, existen muchos valores que la publicidad interactiva ofrece tanto para el usuario como para los anunciantes. Censura Una de sus mayores ventajas, o inconvenientes, es la dificultad de su control de forma global. Algunos gobiernos, de naciones tales como Irn, Cuba, Corea del Norte y la Repblica Popular de China, restringen el que personas de sus pases puedan ver ciertos contenidos de Internet, polticos y religiosos, considerados contrarios a sus criterios. La censura se hace, a veces, mediante filtros controlados por el gobierno, apoyados en leyes o motivos culturales, castigando la propagacin de estos contenidos. Sin embargo, muchos usuarios de Internet pueden burlar estos filtros, pues la mayora del contenido de Internet est disponible en todo el mundo, sin importar donde se est, siempre y cuando se tengan la habilidad y los medios tcnicos de conectar y editar.

114

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Con la introduccin de Internet y del Web en concreto, se han abierto infinidad de posibilidades en cuanto al acceso a la informacin desde casi cualquier sitio. Esto representa un desafo a los desarrolladores de aplicaciones, ya que los avances en tecnologa demandan cada vez aplicaciones ms rpidas, ligeras y robustas que permitan utilizar el Web. Afortunadamente, tenemos herramientas potentes para realizar esto, ya que han surgido nuevas tecnologas que permiten que el acceso a una base de datos desde el Web, por ejemplo, sea un mero trmite. El nico problema es decidir entre el conjunto de posibilidades la correcta para cada situacin. El viejo CGI ha cumplido con el propsito de aadir interactividad a las pginas Web pero sus deficiencias en el desarrollo de aplicaciones y en la escalabilidad de las mismas ha conducido al desarrollo de APIs especficos de servidor como Active Server Pages, ASP, y PHP, que son ms eficientes que su predecesor CGI. Para aprovechar el potencial de estas tecnologas y ofertar una solucin de servidor ms extensible y portable, Sun ha desarrollado la tecnologa llamada servlet. Los servlets Java son muy eficientes, debido al esquema de threads en el que se basan y al uso de una arquitectura estndar como la JVM, Java Virtual Machine. Otra nueva tecnologa viene a sumarse a las que extienden la funcionalidad de los servidores Web, llamada Java Server Pages, JSP. Los JSP permiten juntar HTML, aplicaciones Java, y componentes como las Java Beans creando una pgina Web especial que el servidor Web compila dinmicamente en un servlet la primera vez que es llamada.

115

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Qu es la Web 2.0? La Web 2.0 es la representacin de la evolucin de las aplicaciones tradicionales hacia aplicaciones web enfocadas al usuario final. El Web 2.0 es una actitud y no precisamente una tecnologa. Cuando el web inici, nos encontrbamos en un entorno esttico, con pginas en HTML que sufran pocas actualizaciones y no tenan interaccin con el usuario. La Web 2.0 es la transicin que se ha dado de aplicaciones tradicionales hacia aplicaciones que funcionan a travs del web enfocadas al usuario final. Se trata de aplicaciones que generen colaboracin y de servicios que reemplacen las aplicaciones de escritorio. Todo inici cuando Dale Dougherty de OReilly Media utiliz este trmino en una conferencia en la que comparti una lluvia de ideas junto a Craig Cline de Media Live en la que hablaba del renacimiento y evolucin de la web. Constantemente estaban surgiendo nuevas aplicaciones y sitios con sorprendentes funcionalidades. Y as se dio la pauta para la Web 2.0 conference de 2004. Esta conferencia no solo fue exitosa sino que ya tuvo seguimiento en la Web 2.0 Conference del 2005 celebrada en Octubre. En la charla inicial del Web Conference se habl de los principios que tenan las aplicaciones Web 2.0: La web es la plataforma, la informacin es el procesador, efectos de la red movidos por una arquitectura de participacin. La innovacin surge de caractersticas

116

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

distribuidas por desarrolladores independientes. El fin del crculo de adopcin de software (Servicios en beta perpetuo) La Web 2.0 con ejemplos Qu tecnologas apoyan a la Web 2.0? El Web 2.0 no significa precisamente que existe una receta para que todas nuestras aplicaciones web entren en este esquema. Sin embargo, existen varias tecnologas que estn utilizndose actualmente y que deberamos de examinar con ms cuidado en busca de seguir evolucionando junto al web. Algunas tecnologas que dan vida a un proyecto Web 2.0: Transformar software de escritorio hacia la plataforma del web. Respeto a los estndares del XHTML. Separacin de contenido del diseo con uso de hojas de estilo. Sindicacin de contenidos. Ajax (Asincronical javascript and xml). Uso de Flash, Flex o Lazlo. Uso de Ruby on Rails para programar pginas dinmicas. Utilizacin de redes sociales al manejar usuarios y comunidades. Dar control total a los usuarios en el manejo de su informacin. Proveer A Pis o XML para que las aplicaciones puedan ser manipuladas por otros. Facilitar el posicionamiento con URL sencillos. En qu nos sirve la Web 2.0? El uso de el trmino de Web 2.0 est de moda, dndole mucho peso a una tendencia que ha estado presente desde hace algn tiempo. En Internet las especulaciones han sido causantes de grandes burbujas tecnolgicas y han hecho fracasar a muchos proyectos.

117

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Adems, nuestros proyectos tienen que renovarse y evolucionar. El Web 2.0 no es precisamente una tecnologa, sino es la actitud con la que debemos trabajar para desarrollar en Internet. Tal vez all est la reflexin ms importante del Web 2.0, la nica constante debe ser el cambio, y en Internet, el cambio debe de estar presente ms frecuentemente. Servicios World Wide Web Navegacin Buscadores Wikis Correo electrnico Listas de correo Chat CMS Foros Sevidores FTP Alojamiento web Datos Redes P2P Redes P2M Servicios multimedia Telefona VoIP

Comunicacin

118

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Televisin y radio por internet Webcams Juegos online Comercio electrnico Servicios comerciales Banca electrnica Ingls (35,2%), chino (13,7%), Idiomas ms empleados espaol (9%), japons (8,4%)

alemn (6,9%), francs (4,2%) Usuarios continente (2005) por Asia (34%), Europa (29%),

Amrica del Norte (23%) Tabla 8. Servicos de la web 2.0

1.5 Hojas de estilo en cascada e introduccin al XML. XML es una tecnologa en realidad muy sencilla que tiene a su alrededor otras tecnologas que la complementan y la hacen mucho ms grande y con unas posibilidades mucho mayores. La tcnica XML-CSS, adems de ser la ms simple, permite al diseador de documentos el utilizar al mximo su utilidad creativa. Con XML controlar la estructura y elementos (etiquetas) que van hacer usados en el documento y con CSS definir de forma totalmente personal que estilos sern utilizados por cada uno de esos elementos.

119

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

XML puede definirse como un metalenguaje de marcas, es decir, un lenguaje de marcas con el que se define las marcas que se requieren utilizar. Por tanto, XML permite definir lenguajes propios. Dado que las marcas son establecidas por los propios usuarios de HTML, lo ms adecuado es utilizar marcas que aporten un significado semntico con respecto a la informacin que estn representando. Por su puesto, para que dos aplicaciones distintas puedan utilizar los mismo documentos XML debern conocer y estar de acuerdo con los nombres de las etiquetas o marcas (de forma general, vocabularios). Por tanto, pueden concluirse que XML describe tanto la estructura como la semntica de las marcas y no el formato de representacin. XML, con todas las tecnologas relacionadas, representa una manera distinta de hacer las cosas, ms avanzada, cuya principal novedad consiste en permitir compartir los datos con los que se trabaja a todos los niveles, por todas las aplicaciones y soportes. As pues, el XML juega un papel importantsimo en este mundo actual, que tiende a la globalizacin y la compatibilidad entre los sistemas, ya que es la tecnologa que permitir compartir la informacin de una manera segura, fiable, fcil. Adems, XML permite al programador y los soportes dedicar sus esfuerzos a las tareas importantes cuando trabaja con los datos, ya que algunas tareas tediosas como la validacin de estos o el recorrido de las estructuras corre a cargo del lenguaje y est especificado por el estndar, de modo que el programador no tiene que preocuparse por ello. Nunca debemos olvidar que XML no es lenguaje diseado para la publicacin de documentos y, por lo tanto, ha de recurrir al uso de alguna otra tecnologa para poder mostrar los contenidos de los documentos.

120

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

XML no est slo, sino que hay un mundo de tecnologas alrededor de l, de posibilidades, maneras ms fciles e interesantes de trabajar con los datos y, en definitiva, un avance a la hora de tratar la informacin, que es en realidad el objetivo de la informtica en general. XML, o mejor dicho, el mundo XML no es un lenguaje, sino varios lenguajes, no es una sintaxis, sino varias y no es una manera totalmente nueva de trabajar, sino una manera ms refinada que permitir que todas las anteriores se puedan comunicar entre si sin problemas, ya que los datos cobran sentido. XML es interesante en el mundo de Internet y el e-bussiness, ya que existen muchos sistemas distintos que tienen que comunicarse entre si, pero como se ha podido imaginar, interesa por igual a todas las ramas de la informtica y el tratamiento de datos, ya que permite muchos avances a la hora de trabajar con ellos. Historia del XML El XML proviene de un lenguaje que invent IBM all por los aos 70. El lenguaje de IBM se llama GML (General Markup Language) y surgi por la necesidad que tenan en la empresa de almacenar grandes cantidades de informacin de temas diversos. Imaginar por un momento la cantidad de documentacin que generara IBM sobre todas las reas en las que trabajaba e investigaba, y la cantidad de informacin que habr generado hasta hoy. As pues, necesitaban una manera de guardar la informacin y los expertos de IBM se inventaron GML, un lenguaje con el que poder clasificarlo todo y escribir cualquier documento para que se pueda luego procesar adecuadamente.

121

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Este lenguaje gust mucho a la gente de ISO, una entidad que se encarga de normalizar cuantas cosas podras imaginar para los procesos del mundo actual, de modo que all por el 86 trabajaron para normalizar el lenguaje, creando el SGML, que no era ms que el GML pero estndar (Standar en ingls). SGML es un lenguaje muy trabajado, capaz de adaptarse a un gran abanico de problemas y a partir de l se han creado los siguientes sistemas para almacenar informacin. Por el ao 89, para el mbito de la red Internet, un usuario que haba conocido el lenguaje de etiquetas (Markup) y los hiperenlaces creo un nuevo lenguaje llamado HTML, que fue utilizado para un nuevo servicio de Internet, la Web. Este lenguaje fue adoptado rpidamente por la comunidad y varias organizaciones comerciales crearon sus propios visores de html y rieron entre ellos para hacer el visor ms avanzado, inventndose etiquetas como su propia voluntad les deca. Desde el 96 hasta hoy una entidad llamada W3C ha tratado de poner orden en el HTML y establecer sus reglas y etiquetas para que sea un estndar. Sin embargo el HTML creci de una manera descontrolada y no cumpli todos los problemas que planteaba la sociedad global de Internet. El mismo W3C en el 98 empez y contina, en el desarrollo de XML (Extended Markup Language). En este lenguaje se ha pensado mucho ms y muchas personas con grandes conocimientos en la materia estn trabajando todava en su gestacin. Pretendan solucionar los carencias del HTML en lo que se respecta al tratamiento de la informacin. Problemas del HTML como:

Contenido se mezcla con los estilos que se le quieren aplicar.

122

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

El permite compartir informacin con todos los dispositivos, como

pueden ser ordenadores o telfonos mviles.

La presentacin en pantalla depende del visor que se utilice.

Imagnese, una persona que conoce el HTML y lo difcil que puede llegar a ser entender su cdigo, que tuviese que procesarlo para extraer datos que necesite en otras aplicaciones. Sera muy difcil saber dnde est realmente la informacin que busca, siempre mezclada entre etiquetas , , , etc... Esto es una mala gestin de la informacin y el XML la soluciona. CSS Cascading Style Sheets, Hojas de Estilo en Cascada es un estndar nacido en el ao 1996 y utilizado para la aplicacin de estilos los documentos publicados en internet. CSS es un lenguaje de hojas de estilos creado para controlar el aspecto o presentacin de los documentos electrnicos definidos con HTML y XHTML. CSS es la mejor forma de separar los contenidos y su presentacin y es imprescindible para crear pginas web complejas. Esta tecnologa se suele utilizar combinada con los

lenguajes de marcas HTML, XHTML, XML, etc., para superar sus limitaciones en la definicin de estilos La separacin de los contenidos y su presentacin presenta numerosas ventajas, ya que obliga a crear documentos HTML/XHTML bien definidos y con significado completo (tambin llamados documentos semnticos). Adems, mejora la

123

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

accesibilidad del documento, reduce la complejidad de su mantenimiento y permite visualizar el mismo documento en infinidad de dispositivos diferentes. Mientras que el lenguaje HTML/XHTML se utiliza para marcar los contenidos, es decir, para designar lo que es un prrafo, lo que es un titular o lo que es una lista de elementos, el lenguaje CSS se utiliza para definir el aspecto de todos los contenidos, es decir, el color, tamao y tipo de letra de los prrafos de texto, la separacin entre titulares y prrafos, la tabulacin con la que se muestran los elementos de una lista, etc. Los estilos se definen en una zona especfica del propio documento HTML. Se emplea la etiqueta de HTML y solamente se pueden incluir en la cabecera del documento (slo dentro de la seccin ). USOS DE ARCHIVOS EXTERNOS DE CSS Todos los estilos CSS se pueden incluir en un archivo de tipo CSS que los documentos HTML enlazan mediante la etiqueta , o mediante la etiqueta colocando dentro de ella import como se muestra a continuacion. Ejemplo de estilos CSS en el propio documento

124

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

@import '/css/estilos.css'; El ltimo mtodo para incluir estilos CSS en documentos HTML es el menos utilizado, ya que tiene los mismos problemas que la utilizacin de las etiquetas . El siguiente esquema muestra las partes que forman un estilo CSS muy bsico:

Figura 1.5. Componentes de un estilo CSS bsico Los diferentes trminos se definen a continuacin: Regla: cada uno de los estilos que componen una hoja de estilos CSS. Cada regla est compuesta de una parte de selectores, un smbolo de llave de apertura ({), otra parte denominada declaraciones y por ltimo, un smbolo de llave de cierre (}).

125

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Selector: indica el elemento o elementos HTML a los que se aplica la regla CSS. Declaracin: la declaracin especifica los estilos que se aplicarn a los elementos. Est compuesta por una o ms propiedades CSS. Propiedad: permite modificar el aspecto de una caracterstica del elemento. Valor: indica el nuevo valor de la caracterstica modificada en el elemento. Comentarios La sintaxis de los comentarios CSS se muestra a continuacin: Los comentarios comienzan con los caracteres /*. Los comentarios finalizan con los caracteres */. No se pueden anidar comentarios (es decir, no se puede incluir un comentario dentro de otro comentario). Los comentarios pueden ocupar tantas lneas como sea necesario. SELECTORES BASICOS Selector universal El selector universal se indica mediante un asterisco (*). A pesar de su sencillez, no se utiliza habitualmente, ya que es difcil que un mismo estilo se pueda aplicar a todos los elementos de una pgina.

126

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Selector de tipo o etiqueta Para utilizar este selector, solamente es necesario indicar el nombre de la etiqueta HTML correspondiente a los elementos que se quieren seleccionar. Los selectores se pueden encadenar para aplicar una misma regla a varios elementos diferentes. Para ello, se indican todos los selectores diferentes separados por una coma (,). Selector descendente Permite seleccionar los elementos que se encuentran dentro de otros elementos. Con el selector descendente, un elemento no tiene que ser hijo directo de otro, sino que la nica condicin es que est dentro de ese elemento, sin importar lo profundo que se encuentre. Selector de clase Los selectores de clase son los selectores ms utilizados junto con los selectores de ID. Utilizando este selector, se pueden seleccionar todos los elementos de la pgina cuyo atributo class coincida con el selector. Este selector est formado por un signo de punto (.) y el nombre del atributo class que se quiere seleccionar. Para seleccionar solamente los elementos de un tipo y un atributo class determinado, se indica la etiqueta del elemento y sin dejar ningn espacio, se indica el selector de clase.

127

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Ejemplo de definion de un estilo como clase: .azul{ font-family:arial; Color:red } Selectores de ID Sirve para utilizar un estilo cuyo selector ha sido declarado con el smbolo

almohadilla (#) en un bloque o en una hoja de estilos externas, es decir, los selectores que comiencen con #nombre_estilo{} han de utilizar el atributo ID para poder ser incorporados. El atributo ID puede servir tambin, para identificar un elemento (objeto) de HTML Dinmico; por ello es recomendable definir los estilos como clases. Ejemplo de definicin de un estilo por identificador: Principales atributos y posibles valores

Nombre del atributo FUENTES - FONT color

Posibles valores

Ejemplos

valor RGB o nombre de color

color: color: red;

#009900;

Tabla 9. FuentesFont Sirve para indicar el color del texto. Lo admiten casi todas las etiqetas de HTML. No todos los nombres de colores son admitidos en el estandar, es aconsejable entonces utilizar el valor RGB. xx-small | x-small | small | font-size medium | large | x-large | xx-large Unidades de CSS font-size:12pt; font-size: x-large;

Sirve para indicar el tamao de las fuentes de manera ms rgida y con mayor exactitud. fontfamily serif | sans-serif | cursive | font-family:arial,helvetica;

129

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

fantasy

monospace font-family: fantasy;

Todas las fuentes habituales Con este atributo indicamos la familia de tipografia del texto. Los primeros valores son genricos, es decir, los exploradores las comprenden y utilizan las fuentes que el usuario tenga en su sistema.

Tambin se pueden definir con tipografas normales, como ocurra en html. Si el nombre de una fuente tiene espacios se utilizan comillas para que se entienda bien. normal | bold | bolder | lighter | font-weight 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 fontweight:bold; font-weight: 200;

Sirve para definir la anchura de los caracteres, o dicho de otra manera, para poner negrillas con total libertad.

Normal y 400 son el mismo valor, as como bold y 700. font-style normal | italic | oblique fontstyle:normal; font-style: italic;

Es el estilo de la fuente, que puede ser normal, itlica u oblcua. El estilo oblique es similar al italic. PRRAFOS - TEXT line-height normal y unidades CSS line-height: line-height: normal; 12px;

El alto de una lnea,y por tanto, el espaciado entre lneas. Es una de esas caractersticas que no se podian mofificar utilizando HTML. text-decoration none | [ underline || overline || linethrough ] text-decoration: text-decoration: underline; none;

Para establecer la decoracin de un texto, es decir, si est subrayado, sobrerayado o tachado.

130

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

text-align

left | right | center | justify

text-align: text-align: center;

right;

Sirve para indicar la alineacin del texto. Es interesante destacar que las hojas de estilo permiten el justificado de texto, aunque recuerda que no tiene por que funcionar en todos los sistemas. text-indent Unidades CSS text-indent: text-indent: 2in; 10px;

Un atributo que sirve para hacer sangrado o mrgenes en las pginas. Muy til y novedosa. text-transform capitalize | uppercase | text-transform: text-transform: capitalize; none;

lowercase | none

Nos permite transformar el texto, haciendo que tenga la primera letra en maysculas de todas las palabras, todo en maysculas o minsculas. FONDO - BACKGROUND Backgroundcolor Un color, con su nombre o su valor RGB background-color: background-color: #000055; green;

Sirve para indicar el color de fondo de un elemento de la pgina. background-image: url(mrmol.gif) Backgroundimage El nombre de la imagen con su ; camino relativo o absoluto background-image: url(http://www.x.com/fondo.gif) Colocamos con este atributo una imagen de fondo en cualquier elemento de la pgina, se puede ver una pgina de ejemplo BOX - CAJA Margin-left Unidades CSS margin-left: margin-left: 0,5in; 1cm;

131

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Indicamos con este atributo el tamao del margen a la izquierda Margin-right Unidades CSS margin-right: margin-right: 1in; 5%;

Se utiliza para definir el tamao del margen a la derecha Margin-top Unidades CSS margin-top: margin-top: 10px; 0px;

Indicamos con este atributo el tamao del margen arriba de la pgina Margin-bottom Unidades CSS margin-bottom: margin-top: 1px; 0pt;

Con el se indica el tamao del margen en la parte de abajo de la pgina Padding-left Unidades CSS padding-left: padding-left: 1px; 0.5in;

Indica el espacio insertado, por la izquierda, entre el borde del elemento-continente y el contenido de este. Es parecido a el atributo cellpadding de las tablas.

El espacio insertado tiene el mismo fondo que el fondo del elemento-continente. Padding-right Unidades CSS padding-right: padding-right: 1pt; 0.5cm;

Indica el espacio insertado, en este caso por la derecha, entre el borde del elementocontinente y el contenido de este. Es parecido a el atributo cellpadding de las tablas. El espacio insertado tiene el mismo fondo que el fondo del elemento-continente. Padding-top Unidades CSS padding-top: padding-top: 5px; 10pt;

Indica el espacio insertado, por arriba, entre el borde del elemento-continente y el contenido de este. Padding-bottom Unidades CSS padding-right: 0.5cm;

132

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

padding-right: 1pt; Indica el espacio insertado, en este caso por abajo, entre el borde del elemento-continente y el contenido de este. Border-color color RGB y nombre de color bordercolor: border-color: #ffccff; red;

Para indicar el color del borde del elemento de la pgina al que se lo aplicamos. Se puede poner colores por separado con los atributos border-top-color, border-right-color, borderbottom-color, border-left-color. Border-style none | dotted | solid | double | groove | ridge | inset | outset border-style: border-style: double; solid;

El estilo del borde, los valores significan: none=ningun borde, dotted=punteado (no parece funcionar), solid=solido, double=doble borde, y desde groove hasta outset son bordes con varios efectos 3D. border-width El tamao Unidades CSS del borde del border-width: borderwidth: 0.5in; elemento al que lo aplicamos. 10px;

Para ver otros ejemlos de Box pulsar aqu float none | left | right float: right;

Sirve para alinear un elemento a la izquierda o la derecha haciendo que el texto se agrupe alrededor de dicho elemento. Igual que el atributo align en imagenes en sus valores right y left. clear none | right | left clear: right;

133

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

UNIDAD II. DESARROLLO DE APLICACIONES WEB Objetivo: Comprender los conceptos y elementos bsicos que involucra el desarrollo de aplicaciones Web.

2.1 Arquitectura de las aplicaciones web En la ingeniera software se denomina aplicacin web a aquellas aplicaciones que los usuarios pueden utilizar accediendo a un servidor web a travs de Internet o de una intranet mediante un navegador. En otras palabras, es una aplicacin software que se codifica en un lenguaje soportado por los navegadores web (HTML, JavaScript, Java, etc.) en la que se confa la ejecucin al navegador. Las aplicaciones web son populares debido a lo prctico del navegador web como cliente ligero, as como a la facilidad para actualizar y mantener aplicaciones web sin distribuir e instalar software a miles de usuarios potenciales. Existen aplicaciones como los webmails, wikis, weblogs, tiendas en lnea y la propia Wikipedia que son ejemplos bien conocidos de aplicaciones web. Es importante mencionar que una pgina Web puede contener elementos que permiten una comunicacin activa entre el usuario y la informacin. Esto permite que el usuario acceda a los datos de modo interactivo, gracias a que la pgina responder a cada una de sus acciones, como por ejemplo rellenar y enviar formularios, participar en juegos diversos y acceder a gestores de base de datos de todo tipo.

134

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Los modelos de capas son utilizados por las aplicaciones web dentro de la filosofa ms habituales son las arquitecturas de dos y tres capas. Arquitectura de dos Capas La arquitectura tradicional de cliente/servidor tambin es conocida como arquitectura de dos capas. Requiere una interfaz de usuario que se instala y corre en una PC o estacin de trabajo y enva solicitudes a un servidor para ejecutar operaciones complejas. Por ejemplo, una estacin de trabajo utilizada como cliente puede correr una aplicacin de interfaz de usuario que interroga a un servidor central de bases de datos. Ventajas del Sistema de Dos Capas: El desarrollo de aplicaciones en un ambiente de dos capas es mucho ms rpido que en ambientes anteriores, pero no es necesariamente mas rpido que con el nuevo ambiente de tres capas. Las herramientas para el desarrollo con dos capas son robustas y evaluadas. Las tcnicas de prototipo se emplean fcilmente. Las soluciones de dos capas trabajan bien en ambientes no dinmicos estables, pero no se ejecutan bien en organizaciones rpidamente cambiantes.

135

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Desventajas del Sistema de Dos Capas: Los ambientes de dos capas requieren control excesivo de las versiones y demandan esfuerzo de distribucin de la aplicacin cuando se les hacen cambios. Esto se debe al hecho de que la mayora de la aplicacin lgica existe en la estacin de trabajo del cliente. La seguridad del sistema en un diseo de dos capas es compleja y a menudo requiere administracin de las bases de datos; esto es debido al nmero de dispositivos con acceso directo al ambiente de esas bases de datos. Las herramientas del cliente y de la base de datos, utilizadas en diseos de dos capas, constantemente estn cambiando. La dependencia a largo plazo de cualquier herramienta, puede complicar el servicios Web aparecen juntos. Difcil de separar los datos de la lgica de negocio. Menor seguridad en los datos corporativos. El cliente recibe los datos y la informacin directamente del servidor. Utilizados en esquemas poco complejos (simplicidad del

Arquitectura de tres capas La arquitectura de tres capas es un diseo reciente que introduce una capa intermedia en el proceso. Cada capa es un proceso separado y bien definido

136

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

corriendo en plataformas separadas. En la arquitectura tradicional de tres capas se instala una interfaz de usuario en la computadora del usuario final (el cliente). La arquitectura basada en Web transforma la interfaz de bsqueda existente (el explorador de Web), en la interfaz del usuario final. Ventajas de la Arquitectura de Tres Capas: Las llamas de la interfaz del usuario en la estacin de trabajo, al servidor de capa intermedia, son ms flexibles que en el diseo de dos capas, ya que la estacin solo necesita transferir parmetros a la capa intermedia. Con la arquitectura de tres capas, la interfaz del cliente no es requerida para comprender o comunicarse con el receptor de los datos. Por lo tanto, esa estructura de los datos puede ser modificada sin cambiar la interfaz del usuario en la PC. El cdigo de la capa intermedia puede ser reutilizado por mltiples aplicaciones si est diseado en formato modular. La separacin de roles en tres capas, hace mas fcil reemplazar o modificar una capa sin afectar a los mdulos restantes. Desventajas de las Arquitecturas de Tres Capas y basadas en Web: Los ambientes de tres capas pueden incrementar el trfico en la red y requiere ms balance de carga u tolerancia a las fallas. Los exploradores actuales no son todos iguales. La estandarizacin entre diferentes proveedores ha sido lenta en desarrollarse. Muchas organizaciones son

137

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

forzadas a escoger uno en lugar de otro, mientras que cada uno ofrece sus propias y distintas ventajas. Otras arquitecturas dependiendo de las tecnologas utilizadas. Arquitectura "Open Source": Apache + PHP + MySQL Arquitectura Java: Tomcat + Servlets/JSP Arquitectura Microsoft: ASP.NET. 2.2 Lenguajes de Programacin del lado Cliente Existen numerosos lenguajes de programacin empleados para el desarrollo de Aplicaciones Web,

programacin en s mismo, sino una arquitectura de desarrollo web en la que se pueden usar por debajo distintos lenguajes (por ejemplo VB.NET o C# para ASP.NET o VBScript/JScript para ASP).

138

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Ahora definiremos cada lenguaje del lado cliente. HTML: El lenguaje llamado HTML indica al navegador donde colocar cada texto, cada imagen o cada video y la forma que tendrn estos al ser colocados en la pgina.HTML no es ms que una serie de etiquetas que se utilizan para definir la forma o estilo que queremos aplicar a nuestro documento. JAVASCRIPT: es un lenguaje de programacin utilizado para crear pequeos programitas encargados de realizar acciones dentro del mbito de una pgina web. Se trata de un lenguaje de programacin del lado del cliente, porque es el navegador el que soporta la carga de procesamiento. Su uso se basa fundamentalmente en la creacin de efectos especiales en las pginas y la definicin de interactividades con el usuario. APPLETS DE JAVA: Es otra manera de incluir cdigo a ejecutar en los clientes que visualizan una pgina web. Se trata de pequeos programas hechos en Java, que se transfieren con las pginas web y que el navegador ejecuta en el espacio de la pgina. Los applets de Java estn programados en Java y pre compilados, es por ello que la manera de trabajar de stos vara un poco con respecto a los lenguajes de script como Javascript. Los applets son ms difciles de programar que los scripts en Javascript y requerirn unos conocimientos bsicos o medios del lenguaje Java. La principal ventaja de utilizar applets consiste en que son mucho menos dependientes del navegador que los scripts en Javascript, incluso independientes del

139

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

sistema operativo del ordenador donde se ejecutan. Adems, Java es ms potente que Javascript, por lo que el nmero de aplicaciones de los applets podr ser mayor. Como desventajas en relacin con Javascript cabe sealar que los applets son ms lentos de procesar y que tienen espacio muy delimitado en la pgina donde se ejecutan, es decir, no se mezclan con todos los componentes de la pgina ni tienen acceso a ellos. Es por ello que con los applets de Java no podremos hacer directamente cosas como abrir ventanas secundarias, controlar Frames, formularios, capas, etc. VISUAL BASIC SCRIPT: Es un lenguaje de programacin de scripts del lado del cliente, pero slo compatible con Internet Explorer. Es por ello que su utilizacin est desaconsejada a favor de Javascript.

Est basado en Visual Basic, un popular lenguaje para crear aplicaciones Windows. Tanto su sintaxis como la manera de trabajar estn muy inspiradas en l. Sin embargo, no todo lo que se puede hacer en Visual Basic lo podremos hacer en Visual Basic Script, pues este ltimo es una versin reducida del primero. El modo de funcionamiento de Visual Basic Script para construir efectos especiales en pginas web es muy similar al utilizado en Javascript y los recursos a los que se puede acceder tambin son los mismos: el navegador. FLASH: es una tecnologa, y un programa, para crear efectos especiales en pginas web. Con Flash tambin conseguimos hacer pginas dinmicas del lado del cliente. Flash en realidad no es un lenguaje; Sin embargo, si tuviramos que catalogarlo en algn sitio quedara dentro del mbito de las pginas dinmicas de cliente.

140

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Para visualizar las "pelculas" Flash, nuestro navegador debe tener instalado un programita (plug-in) que le permita visualizarlas. CSS: son las siglas de Cascading Style Sheets, en espaol Hojas de estilo en Cascada, es una tecnologa que nos permite crear pginas web de una manera ms exacta. Gracias a las CSS somos mucho ms dueos de los resultados finales de la pgina, pudiendo hacer muchas cosas que no se poda hacer utilizando solamente HTML, como incluir mrgenes, tipos de letra, fondos, colores... Incluso podemos definir nuestros propios estilos en un archivo externo a nuestras pginas; as, si en algn momento queremos cambiar alguno de ellos, automticamente se nos actualizarn todas las pginas vinculadas de nuestro sitio. 2.3 Lenguajes de Programacin del lado Servidor CGI: Es el sistema ms antiguo que existe para la programacin de las pginas dinmicas de servidor. Actualmente se encuentra un poco desfasado por diversas razones entre las que destaca la dificultad con la que se desarrollan los programas y la pesada carga que supone para el servidor que los ejecuta. Los CGI se escriben habitualmente en el lenguaje Perl, sin embargo, otros lenguajes como C, C++ o Visual Basic pueden ser tambin empleados para construirlos. Perl: es un lenguaje de programacin interpretado, al igual que muchos otros lenguajes de Internet como Javascript o ASP. Esto quiere decir que el cdigo de los scripts en Perl no se compila sino que cada vez que se quiere ejecutar se lee el cdigo y se pone en marcha interpretando lo que hay escrito. Adems es extensible a partir de otros lenguajes, ya que desde Perl podremos hacer llamadas a

141

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

subprogramas escritos en otros lenguajes. Tambin desde otros lenguajes podremos ejecutar cdigo Perl. ASP (Active Server Pages): es la tecnologa desarrollada por Microsoft para la creacin de pginas dinmicas del servidor. ASP se escribe en la misma pgina web, utilizando el lenguaje Visual Basic Script o Jscript (Javascript de Microsoft). PHP: es el acrnimo de Hipertext Preprocesor. Es un lenguaje de programacin del lado del servidor gratuito e independiente de plataforma, rpido, con una gran librera de funciones y mucha documentacin. JSP: es un acrnimo de Java Server Pages, que en castellano vendra a decir algo como Pginas de Servidor Java. Es, pues, una tecnologa orientada a crear pginas web con programacin en Java. Con JSP podemos crear aplicaciones web que se ejecuten en variados servidores web, de mltiples plataformas, ya que Java es en esencia un lenguaje multiplataforma. Por tanto, las JSP podremos escribirlas con nuestro editor HTML/XML habitual. Lenguajes del lado cliente-servidor DHTML no es precisamente un lenguaje de programacin. Ms bien se trata de una nueva capacidad de la que disponen los navegadores modernos, por la cual se puede tener un mayor control sobre la pgina que antes.

Cualquier pgina que responde a las actividades del usuario y realiza efectos y funcionalidades se puede englobar dentro del DHTML, pero en este caso nos

142

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

referimos ms a efectos en el navegador por los cuales se pueden mostrar y ocultar elementos de la pgina, se puede modificar su posicin, dimensiones, color, etc.

DHTML nos da ms control sobre la pgina, gracias a que los navegadores modernos incluyen una nueva estructura para visualizar en pginas web denominada capa. Las capas se pueden ocultar, mostrar, desplazar, etc.

Para realizar las acciones sobre la pgina, como modificar la apariencia de una capa, seguimos necesitando un lenguaje de programacin del lado del cliente como Javascript o VBScript. En la actualidad, DHTML tambin puede englobar la programacin en el servidor. Dentro del concepto de DHTML se engloban tambin las Hojas de Estilo en Cascada o CSS (Cascade Style Sheets), que veremos a continuacin. XML es una tecnologa en realidad muy sencilla que tiene a su alrededor otras tecnologas que la complementan y la hacen mucho ms grande y con unas posibilidades mucho mayores. XML, con todas las tecnologas relacionadas, representa una manera distinta de hacer las cosas, ms avanzada, cuya principal novedad consiste en permitir compartir los datos con los que se trabaja a todos los niveles, por todas las aplicaciones y soportes.

143

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

2.4 Ambientes para el Desarrollo de Aplicaciones Web Existen actualmente ambientes de desarrollo llamados WYSIWYG es el acrnimo de What You See Is What You Get (en ingls, "lo que ves es lo que obtienes"). Se aplica a los procesadores de texto y otros editores de texto con formato (como los editores de HTML) que permiten escribir un documento viendo directamente el resultado final, frecuentemente el resultado impreso. Se dice en contraposicin a otros procesadores de texto, hoy en da poco frecuentes, en los que se escriba sobre una vista que no mostraba el formato del texto, hasta la impresin del documento. En el caso de editores de HTML este concepto se aplica a los que permiten escribir la pgina sobre una vista preliminar similar a la de un procesador de textos, ocupndose en este caso el programa de generar el cdigo fuente en HTML. Ejemplos de editores HTML tipo WYSIWYG son: Dreamweaver, NVU/Kompozer, las versiones de Composer de Netscape y Mozilla, Amaya, Writer (de

OpenOffice.org), Adobe Golive, Frontpage. Tambin existen editores que se pueden integrar en formularios de pginas web como FCKeditor, TinyMCE,

FreeRichTextEditor. En el rea de diseo web existen tambin herramientas WYSIWYG, dentro de los llamados CMS (Content Management System); aunque un CMS no tiene porqu ser WYSIWYG, es decir puede ser un gestor de contenidos cuyo panel de gestin no se corresponda con el diseo final, sino que en este caso se utiliza un back-end o panel de gestin

para crear-modificar los contenidos, que sern reflejados en el front-end o parte final que ven los usuarios. En el grupo de los CMS WYSIWIG hay varias

144

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

aplicaciones, incluso alguna de ellas con tecnologa flash, como por ejemplo Easy Site Manager. Analicemos cada una de ella. Adobe Dreamweaver (Dw) Es una aplicacin en forma de estudio (Basada por supuesto en la forma de estudio de Adobe Flash) pero con ms parecido a un taller destinado para la construccin y edicin de sitios y aplicaciones Web basados en estandares. Creado inicialmente por Macromedia (actualmente producido por Adobe Systems). Es el programa de este tipo ms utilizado en el sector del diseo y la programacin web, por sus funcionalidades, su integracin con otras herramientas como Adobe Flash y, recientemente, por su soporte de los estndares del World Wide Web Consortium. Su principal competidor es Microsoft Expression Web. Tiene soporte tanto para edicin de imgenes como para animacin a travs de su integracin con otras herramientas Hasta la versin MX, fue duramente criticado por su escaso soporte de los estndares de la web, ya que el cdigo que generaba era con frecuencia slo vlido para Internet Explorer, y no validaba como HTML estndar. Esto se ha ido corrigiendo en las versiones recientes. Se vende como parte de la suite Adobe Creative Suite 3 La gran base de este editor sobre otros es su gran poder de ampliacin y personalizacin del mismo, puesto que este programa, sus rutinas ( como la de insertar un hipervinculo, una imagen o aadir un comportamiento) estn hechas en Javascript-C lo que le ofrece una gran flexibilidad en estas materias. Esto hace que los archivos del programa no sea instrucciones de C++ sino, rutinas de Javascript

145

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

que hace que sea un programa muy fluido, que todo ello hace, que programadores y editores web hagan extensiones para su programa y lo ponga a su gusto. Nvu es un editor de pginas web WYSIWYG Multiplataforma basado en Mozilla Composer, pero de ejecucin independiente. Aade caractersticas nuevas como soporte integrado de CSS y mejor gestin del soporte FTP para actualizacin de los ficheros. Este editor facilita el desarrollo de pginas web, gracias a las diferentes visualizaciones disponibles en su interfaz (cdigo fuente, ventana WYSIWYG, visin con tags de HTML realzados), entre los cuales es posible cambiar mediante un sistema de pestaas. Incluye tambin otras caractersticas como gestin de trabajo mediante proyectos, cliente FTP integrado para subir la pgina directamente desde Nvu y soporte para todos los elementos tpicos: marcos, formularios, tablas, plantillas de diseo, hojas de estilo CSS, etc. Nvu est disponible para Linux, Mac OS X y Microsoft Windows, aunque puede compilarse para cualquier plataforma con el Netscape Portable Runtime. Mozilla Composer est todava en desarrollo como parte de la suite Mozilla para otras plataformas. FCKeditor Editor HTML / WYSIWYG de cdigo abierto (Open Source) que provee a la Web del poder de las aplicaciones de escritorio al estilo de editores como el Microsoft Word. Sin la necesidad de instalar ningn componente en la computadora del cliente. Contiene las siguientes caractersticas:

146

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Generacin de cdigo XHTML 1.0 Soporte CSS Incorporar formularios Formateo de Fuente Cortar, copiar, pegar Insercin de imgenes Creacin de tablas Mens contextuales con botn derecho

Bluefish es un software editor HTML multiplataforma POSIX y con licencia GPL, lo que le convierte en software libre. Bluefish est dirigido a diseadores web experimentados y programadores y se enfoca en la edicin de pginas dinmicas e interactivas. Es capaz de reconocer diversos lenguajes de programacin y de marcas. Bluefish corre en muchos de los sistemas operativos compatibles con POSIX (Portable Operating System Interface) tales Linux, FreeBSD, MacOS-X, OpenBSD, Solaris and Tru64. Emplea principalmente las libreras GTK y C posix. La ltima versin que trabaj con GTK 1.0 1.2 es la 0.7. La versin actual requiere como mnimo GTK versin 2.0 (o superior), libpcre 3.0 (o superior), libaspell 0.50 o superior (opcional) para correccin de ortografa y gnome-vfs (opcional) para archivos remotos. Es importante anotar que el programa no es oficialmente parte del proyecto Gnome, pero es utilizado a menudo en dicho entorno.

147

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Los usuarios tambin pueden acceder a los recursos en lnea, tales como servidores FTP o directorios WebDAV, de forma transparente, a travs de Gnome VFS, una capa de abstraccin al sistema de archivos. CMS Una herramienta de CMS es un software que nos permite administrar el contenido de una web de forma automtica: publicar, editar, borrar, otorgar permisos de acceso o establecer los mdulos visibles para el visitante. As, el CMS est formado por 2 elementos: la aplicacin gestora de contenidos (CMA) y la aplicacin dispensadora de contenidos (CDA). El elemento CMA permite al gestor de contenidos o autor, que puede no saber HTML, realizar la creacin, modificacin y eliminacin de contenido en un sitio Web sin necesidad de disponer de la experiencia de un Webmaster. El CDA usa y compila la informacin para actualizar el sitio Web. Las caractersticas de un CMS pueden variar, pero la mayora incluye publicacin basada en Web, indexacin, revisin, bsqueda y recuperacin de la informacin. Un Administrador de Contenidos (o CMS, por sus siglas en ingls), es un sistema creado para facilitar la publicacin de informacin en un sitio web. Esto quiere decir, que permite que muchas personas -con la debida autorizacin- puedan escribir artculos, proponer votaciones, definir el "look & feel" del sitio y mucho ms. Existen CMS para todos los gustos, tamaos y bolsillos: desde los dirigidos a grandes empresas, hasta los de publicacin individual; desde los que cuestan varios miles de dlares hasta los open source; y para servidores Linux, hasta Windows.

148

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

LMS (Learning Management System - Sistema de gestin de aprendizaje): Software que automatiza la administracin de acciones de formacin. Un LMS registra usuarios, organiza los diferentes cursos en un catlogo, almacena datos sobre los usuarios, tambin provee informes para la gestin y desarrolla procesos de comunicacin. Los ltimos LMS permiten posibilidades de autora de contenidos Al igual que ocurre con los CMS, podemos encontrar LMS bajo licencias propietarias y open-source. LCMS (Learning Content Management System = Sistema de gestin de contenidos educativos): Aplicacin de software que combina las capacidades de gestin de cursos de un LMS con las capacidades de almacenamiento de y creacin de contenidos de un CMS.

2.5 Metodologas para el desarrollo de aplicaciones web Existen varias metodologas para construir un sitio web, a continuacin se muestras las principales metodologas. 1. EORM Es una Metodologa de Relacin entre Objeto (Enhanced Object Relationship Methodology), es definido por un proceso iterativo que se concentra en el modelado orientado a objetos por la representacin de relaciones entre los objetos

149

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

(acoplamientos) como objetos, es por ello que fue una de las primeras propuestas para Web centrada en el paradigma de la orientacin a objetos. La adopcin del enfoque orientado a objetos garantiza todas las ventajas reconocidas para esta tcnica de modelado, como la flexibilidad (posible existencia de mltiples formas de relaciones entre nodos) y la reutilizacin, por la existencia de una librera de clases de enlaces que pueden ser reutilizados en diferentes proyectos de desarrollo hipermedia. Podemos mencionar que esta metodologa consta de las siguientes fases segn el siguiente diagrama de flujo:

Fase de Anlisis: Se trata de orientar a objetos al sistema, sin

considerar los aspectos hipermediales del mismo.

Fase de Diseo: Procede a modificar el modelo de objetos obtenido

durante el anlisis aadiendo la semntica apropiada a las relaciones entre clases de objetos para convertirlas en enlaces hipermedia, obteniendo finalmente un modelo enriquecido.

Fase de Construccin: Se transformar los esquemas en cdigo y

guardados en una Base de Datos Orientada a Objetos, y en elaborar formularios de consulta de las clases con la ayuda de un editor grfico de interfaces. Se genera el cdigo fuente correspondiente a cada clase y se prepara la Interface Grfica de Usuario. 2. OOHDM Es un Mtodo de Diseo de Desarrollo en Hipermedia Orientado a Objetos (Object-Oriented Hipermedia Design Method) y abarca las cuatro actividades: El

150

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

modelado conceptual, diseo navegacional, diseo abstracto de interfaz y la puesta en prctica. Estas actividades se realizan en una mezcla de estilo incremental, iterativo y basado en prototipos de desarrollo. 3. SOHDM Es un Mtodo que Desarrolla Diseo en panoramas (scenario) Orientada a Objetos en Hipermedia (Scenario - based Object-oriented Hipermedia Design Methodology). Presenta la necesidad de disponer de un proceso que permita capturar las necesidades del sistema. Para ello, propone el uso de escenarios. A continuacin detallaremos entorno de trabajo y de los actores. La finalidad principal de esta fase es conseguir los Modelado de Objetos: Desarrolla un diagrama de clases que representa la estructura eorganizan los objetos en unidades Navegacional: Se enriquecen dichas vistas definiendo los enlaces e hiperenlaces que existen en mentacin: Se disean las pginas, la interfaz y la base sistema. la que se implementa la aplicacin.

151

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

4. WSDM Es un Mtodo de Diseo para Sitios Web (Web Site Design Method), donde hay un acercamiento al usuario que define los objetos de informacin basado en sus requisitos de informacin para el uso de la Web. En este mtodo se definen una aplicacin Web a partir de los diferentes grupos de usuarios que vaya a reconocer el sistema. Propone cuatro etapas: modelo de usuario, diseo conceptual, diseo de la implementacin e implementacin. El tratamiento de requisitos se lleva a cabo en la etapa inicial, donde, en primer lugar, se identifican y clasifican los usuarios que van a hacer uso de la aplicacin Web 5. RNA Es un mtodo de Anlisis de Navegacin Relacional (Relationship Navigational Anlisis), que define una secuencia de pasos que se utilizarn para el desarrollo de la Web. Es especialmente til para uso de la Web creados en base de sistema de herencia. En este mtodo encontramos cinco fases las cuales son: Anlisis del entorno, donde el propsito de esta fase es el de estudiar las caractersticas de la audiencia, luego encontramos las definiciones de elementos de inters, el anlisis del conocimiento y navegacin y finalmente la implementacin de los anlisis realizados. A continuacin detallaremos cada fase. 8. Fase de Anlisis del Entorno: Se determinar y clasifica a los usuarios

finales de la aplicacin en grupos segn sus perfiles. 9. Fase de Definicin de Elementos: Aqu prosiguen los elementos de

152

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

inters en la cual se han listando dichos elementos de la aplicacin. Por elementos de inters se entienden los documentos, las pantallas que se van a requerir, la informacin, etc. 10. Fase de Anlisis del Conocimiento: Se desarrollar un esquema que represente a la aplicacin. Para ello RNA propone identificar los objetos, los procesos y las operaciones que se van a poder realizar en la aplicacin, as como las relaciones que se producen entre estos elementos. 11. Fase de Anlisis de Navegacin: Se verifica que el esquema obtenido en la fase anterior sea enriquecido con las posibilidades de navegacin dentro de la aplicacin. 12. Fase de Implementacin del Anlisis: Cuando una vez obtenido el esquema final en el que ya se encuentran incluidos los aspectos de navegacin, se pasa el esquema a un lenguaje entendible por la mquina.

2.6 Aspectos de seguridad La creciente importancia que se da a los aspectos de seguridad en los servicios que se ofrecen en Internet hace que en general los administradores de sistemas estn concienciados respecto a la necesidad de dotar a sus servidores de una arquitectura de seguridad que les proteja frente a las amenazas de la red. Sin embargo es por desgracia un hecho frecuente el que los criterios de seguridad se pierdan a la hora de desarrollar las aplicaciones que se ejecutan en los servidores Internet. Si los administradores son conscientes de los peligros de la red los programadores no suelen serlo tanto, por otra parte stos estn sometidos a las presiones de los responsables de negocio para desarrollar nuevos servicios en

153

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Internet en tiempos muy reducidos (Time to Market) por imperativo de mercado Internet. El desarrollo de aplicaciones web seguras se est convirtiendo en una tarea cada vez ms difcil debido a la creciente complejidad y variedad de servicios ofrecidos a travs de Internet. La seguridad de las aplicaciones web no es slo responsabilidad del administrador de sistemas, encargado de la infraestructura y redes, sino tambin del modelado de amenazas se muestran en la figura 1. Se debera definir de forma progresiva el modelo de amenazas repitiendo los pasos 2 a 5. Se podrn agregar ms detalles a medida que se avance por el ciclo de vida de desarrollo de la aplicacin y se descubra ms sobre el diseo de la aplicacin. Arquitectura no preparada para aplicaciones Arquitectura no preparada para entorno Internet actual Protocolo HTTP no pensado para uso con aplicaciones Poca conciencia de buenas prcticas de programacin con enfoque en

seguridad Poca difusin del tema Mala programacin Inyeccin SQL XSS

154

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Los cinco pasos del modelado de amenazas son: Paso 1: Identificar objetivos de seguridad. Aclarar los objetivos le ayudar a centrarse en la actividad de modelado de amenazas y a determinar cunto esfuerzo dedicar a los siguientes pasos. Paso 2: Crear una descripcin general de la aplicacin. Personalizar los actores y las caractersticas importantes de la aplicacin ayudar a identificar las amenazas ms importantes durante el paso 4. Paso 3: Descomponer la aplicacin. Una comprensin detallada de la mecnica de la aplicacin facilita el descubrimiento de amenazas ms relevantes y detalladas. Paso 4: Identificar amenazas. Utilice la informacin que se detalla en los pasos 2 y 3 para identificar las amenazas ms importantes para el contexto y el escenario de la aplicacin. Paso 5: Identificar vulnerabilidades. Revise las capas de la aplicacin para identificar los puntos dbiles relacionados con las amenazas. Utilice las categoras de vulnerabilidad para centrarse con mayor facilidad en las reas en las que tienen lugar los errores ms frecuentes. Primeros pasos En qu consiste el modelado de amenazas? El modelado de amenazas es una tcnica de ingeniera que se puede utilizar para ayudar a identificar amenazas, ataques, vulnerabilidades y contramedidas en el

155

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

contexto del escenario de la aplicacin. La actividad del modelado de amenazas ayuda a: Identificar los objetivos de seguridad. Identificar las amenazas ms importantes. Identificar las contramedidas y vulnerabilidades ms importantes. Marco de seguridad de aplicaciones Web Categora Validacin de la Descripcin Cmo sabe que la entrada que recibe la aplicacin es vlida y segura? La validacin de la entrada se refiere a cmo su aplicacin filtra, anula o rechaza la entrada antes de realizar un procesamiento adicional. Autenticacin Quin es usted? La autenticacin es el proceso en el que una entidad prueba la identidad de otra entidad, normalmente a travs de credenciales, como el nombre de usuario y la contrasea. Autorizacin Qu puede hacer? La autorizacin se refiere a cmo la aplicacin proporciona controles de acceso a los recursos y operaciones. Administracin de la configuracin Quin ejecuta la aplicacin? A qu bases de datos se conecta? Cmo se administra su aplicacin? configuracin? Cmo La se asegura de esta la

entrada y los datos

administracin

156

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Categora

Descripcin configuracin se refiere a cmo controla la aplicacin estos problemas operativos.

Datos confidenciales

Cmo

trata

la Los

aplicacin datos

los

datos se

confidenciales?

confidenciales

refieren a cmo la aplicacin trata datos que se deben proteger mediante la memoria, a travs de la red o de almacenamientos persistentes. Administracin sesin de Cmo trata y protege la aplicacin las sesiones de usuario? Una sesin se refiere a una serie de interacciones relacionadas entre un usuario y la aplicacin Web. Criptografa Cmo mantiene Cmo los secretos los

(confidencialidad)?

altera-prueba

datos o las bibliotecas (integridad)? Cmo proporciona semillas para valores aleatorios que deben ser slidos desde el punto de vista criptogrfico? La criptografa se refiere a cmo la aplicacin aplica confidencialidad e integridad. Manipulacin parmetros de Cmo manipula la aplicacin los valores de los parmetros? Los campos de formulario, los argumentos de cadenas de consultas y los valores de cookies se utilizan con frecuencia como parmetros para una aplicacin. La

manipulacin de parmetros se refiere a cmo la aplicacin salvaguarda la alteracin de estos valores y a cmo la aplicacin procesa los

157

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Categora

Descripcin parmetros de entrada.

Administracin excepciones

de

Cuando

una

llamada

de

mtodo

de

la

aplicacin da error, cmo acta la aplicacin? Cunto revela? Proporciona a los usuarios finales informacin Pasa sobre errores fcil de

entender?

informacin

valiosa

sobre

excepciones a la persona que llama? La aplicacin da error de forma nada aparatosa? Auditora y registro Quin hizo qu y cundo? La auditora y el registro se refieren a cmo la aplicacin registra eventos relacionados con la seguridad. El marco se utiliza para ayudar a identificar amenazas y vulnerabilidades. Durante la identificacin de amenazas, lo utilizar para ayudar a identificar amenazas comunes relativas a la propia arquitectura de la aplicacin. Para ayudar a identificar vulnerabilidades, proceder de forma similar revisando la aplicacin capa por capa, considerando cada una de las categoras de vulnerabilidad de cada capa. Recomendaciones 6. No usar configuracin predeterminada en servidor web y PHP 7. 8. 9. Activar safe_mode en PHP.ini Activar lmites de uso de recursos en PHP No permitir inclusin remota de programas include(), require() y fopen()

10. Comprobar datos obtenidos por $_POST cuantas veces sea necesario

158

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

UNIDAD III. PROGRAMACIN DEL LADO DEL SERVIDOR Objetivo: Desarrollar aplicaciones Web del lado del servidor con acceso a base de datos. 3.1 Procesamiento del lado del servidor. La Programacin del lado del servidor es una tecnologa que consiste en el procesado de una peticin de un usuario mediante la interpretacin de un script en el servidor web para generar pginas HTML dinmicamente como respuesta. Historia Los primeros servidores web permitan visualizar exclusivamente informacin esttica. Esto present pronto una limitacin; sobre todo desde el momento en el que la actividad publicitaria y comercial comenz a concentrarse tambin en Internet. La primera solucin tcnica realizada fue la posibilidad de que el servidor web ejecutase programas residentes en la mquina de servicio. Esta tecnologa, conocida como Common Gateway Interface (CGI) permita lanzar programas escritos principalmente en C o Perl. Si bien la tecnologa CGI resolva el problema de la presentacin exclusiva de informacin esttica, al mismo tiempo presentaba dos limitaciones importantes: el problema de seguridad que poda representar el hecho de que mediante una peticin se pudiesen ejecutar programas indeseados en el servidor y la carga del servidor (si una pgina que lanzaba un programa era llamada desde 100 clientes

159

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

simultneamente, el servidor ejecutaba 100 procesos, uno por cada cliente que solicitaba dicha pgina).

Para resolver estos problemas, se busc desarrollar una tecnologa que permitiera ejecutar, en un nico proceso del servidor, todos los pedidos de ejecucin de cdigo sin importar la cantidad de clientes que se conectaban concurrentemente. As surgieron los denominados servlets, basados en la tecnologa Java de Sun Microsystems, y los filtros ISAPI de Microsoft. stos permitan ejecutar cdigo en un nico proceso externo que gestionaba todas las llamadas realizadas por el servidor web, impidiendo al mismo tiempo que el servidor web pueda ejecutar programas del sistema operativo. No obstante, de este modo se limitaron los problemas de prestacin y seguridad de la tecnologa CGI, y no se resolvi el problema representado por un desarrollo demasiado costoso en trminos de tiempo. Asimismo, se hizo necesario que dos figuras profesionales distintas trabajen en un nico proyecto: el programador (que conoce el lenguaje de programacin utilizado del lado del servidor) y el diseador web (que conoce la parte grfica y el lenguaje HTML). Para resolver estas limitaciones, fueron desarrollados lenguajes que pueden ser incluidos al interno de archivos HTML. Estos comandos pueden ser interpretados (como por ejemplo las pginas ASP o PHP) o precompilados (como en las pginas JSP o ASP.NET). Con la utilizacin de esta tecnologa se buscaba, tambin, desarrollar aptitudes de diseador web en los programadores y de programador en los diseadores (se esperaba con ello el hacer ms fcil y veloz el desarrollo de scripts del lado del servidor).

160

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

3.2 Conceptos bsicos de la herramienta de desarrollo. Macromedia DreamWeaver Abrir y guardar documentos Para abrir un documento, puedes utilizar cualquiera de las siguientes operaciones.

Hacer clic en el botn abrir

de la barra de herramientas estndar.

Pulsar la combinacin de teclas Ctrl+O. Hacer clic sobre el men Archivo y elegir la opcin Abrir. Hacer doble clic sobre el archivo en la ventana del sitio.

Para abrir un documento nuevo, puedes utilizar cualquiera de las siguientes operaciones.

Hacer clic en el botn abrir

de la barra de herramientas estndar.

Pulsar la combinacin de teclas Ctrl+N. Hacer clic sobre el men Archivo y elegir la opcin Nuevo.

161

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Hacer doble clic sobre el archivo en la ventana del sitio.

Despus de esto aparecer una nueva ventana, en la que debers elegir la Categora Pgina bsica, HTML. Para guardar un documento, puedes utilizar cualquiera de las siguientes operaciones.

Hacer clic en el botn guardar

de la barra de herramientas estndar.

Pulsar la combinacin de teclas Ctrl+S. Hacer clic sobre el men Archivo y elegir la opcin Guardar.

La barra de ttulo

Figura 2.1.- Barra de titulo La barra de ttulo contiene el nombre del programa (Marcromedia Dreamweaver 8) y seguidamente el nombre del documento que aparecer en el explorador y entre parntesis, su ubicacin y el nombre del archivo en formato html. En el extremo de la derecha estn los botones para minimizar, maximizar/restaurar y cerrar.

162

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

La barra de mens

Figura 2.2.-Barra de menus La barra de mens contiene las operaciones de Dreamweaver, agrupadas en mens desplegables. Al hacer clic en Insertar, por ejemplo, veremos las operaciones relacionadas con los diferentes elementos que se pueden insertar en Dreamweaver. Muchas de las operaciones se pueden hacer a partir de estos mens, pero para algunas es preferible o indispensable hacerlas desde los paneles. La barra de herramientas estndar

Figura 2.3.-Barra de herramientas estandar La barra de herramientas estndar contiene iconos para ejecutar de forma inmediata algunas de las operaciones ms habituales, como Abrir etc. La barra de herramientas de documento. , Guardar ,

163

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Figura 2.4.-Barra de herramientas de documento

La barra de herramientas de documento contiene iconos para ejecutar de forma inmediata algunas otras operaciones habituales que no incluye la barra de herramientas estndar. Estas operaciones son las de cambio de vista del documento, vista previa, etc. La barra de estado

Figura 2.5.-Barra de estado La barra de estado nos indica en cada momento en qu etiqueta HTML nos encontramos (en la imagen al encontrarnos en un documento en blanco estamos directamente sobre la etiqueta ). Tambin nos es posible alternar entre los modos de seleccin, mano (para arrastrar la pgina), o zoom. En cualquier momento puedes seleccionar el zoom preferido desde el desplegable zoom y ajustar la vista al porcentaje preferido (por defecto siempre viene al 100%). Los paneles e inspectores Dreamweaver utiliza ventanas flotantes similares a las barras de herramientas, que se conocen como paneles o inspectores. La diferencia entre panel e inspector es

164

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

que, en general, la apariencia y opciones de un inspector cambian dependiendo del objeto seleccionado.

A travs de la opcin Ventana, de la barra de mens, es posible mostrar u ocultar cada uno de los paneles o inspectores. Vamos a ver los ms importantes. El inspector de Propiedades

Figura 2.6.-El inspector de propiedades El inspector de Propiedades muestra y permite modificar las propiedades del elemento seleccionado que son usadas de forma ms frecuente. Por ejemplo, cuando el elemento seleccionado sea texto mostrar el tipo de fuente, la alineacin, si est en negrita o cursiva, etc. Pulsando sobre el botn se despliega para mostrar ms opciones. Este botn se

encuentra en la esquina inferior-derecha. Seguramente ser la herramienta de Dreamweaver que ms vayas a utilizar.

165

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

La barra de herramientas Insertar o panel de objetos

Figura 2.7.- barra de herramientas Insertar o panel de objetos La barra de herramientas Insertar o panel de objetos permite insertar elementos en un documento sin la necesidad de recurrir al men Insertar. Los elementos estn clasificados segn su categora: tablas, texto, objetos de formulario, etc. Es posible configurar este panel para que en los botones se muestren los iconos de los objetos (como ocurre en la imagen anterior), para que se muestren los nombres de los objetos, o para que se muestren ambos a la vez. 3.3 Operadores

166

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Un operador es una palabra o smbolo que al aplicarlo uno o ms operandos produce un valor. Los operadores se clasifican en unarios, binarios o ternarios dependiendo del nmeros de operadnos sobre el que acten.

As que puede pensar sobre las funciones o construcciones que devuelven un valor (como print) como operadores, y en aquellas que no devuelven nada (como echo) como cualquier otra cosa. Existen tres tipos de operadores. En primer lugar se encuentra el operador unario, el cual opera sobre un nico valor, por ejemplo ! (el operador de negacin) o ++ (el operador de incremento). El segundo grupo se conoce como operadores binarios; este grupo contiene la mayora de operadores que soporta PHP, y una lista se encuentra disponible ms adelante en la seccin Precedencia de Operadores. El tercer grupo consiste del operador ternario: ?:. ste debe ser usado para seleccionar entre dos expresiones, en base a una tercera, en lugar de seleccionar dos sentencias o rutas de ejecucin. Rodear las expresiones ternarias con parntesis es una muy buena idea. Los diferentes grupos de operadores de que dispone PHP son: Operadores aritmticos Operador + Ejemplo 3+5 7-4 Descripcin Suma entre dos nmeros Diferencia entre do nmeros

167

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

2*3

Multiplicacin nmeros

entre

dos

/%

24/8 7%2

Cociente entre dos nmeros Modulo: Resto de la divisin entera entre dos nmeros

++

++$a $a++

Pre-incremento Post-incremento Pre-decremento Post-decremento

--

--$a $a--

Tabla 10.- operadores aritmeticos Los cuatro primeros operadores aritmticos son los utilizados para sumar, restar, multiplicar y dividir. El siguiente operador, modulo, es una operacin especial que se usa normalmente para general recorridos circulares sobre vectores o matrices de datos. El resultado que devuelve es el resto de la divisin entera entre dos nmeros. La utilizacin de los operadores de incremento o decremento implica la suma o resta de una unidad sobre el nmero que se aplique. Operadores de cadena Operador . Ejemplo $A . $B Descripcin Concatena las cadenas de caracteres $A y $B. Tabla 11.- operadores de cadena Operadores de asignacin

168

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Operador ==

Ejemplo $A == $B

Descripcin True si $A es igual a $B; false si no lo es

===

$A === $B

True si $A es igual a $B y son el mismo tipo (idnticos); false en caso contrario.

!=

$A != $B

True si $A y $B son diferentes; false si son iguales.

!==

$A !== $B

True si $A y $B no son identificados; false en caso contrario.

<

$A < $B

True si $A es menor que $B; false si no lo es.

>

$A > $B

True si $A es mayor que $B; false si no lo es.

= $B

True si $A es mayor o igual que $B; false si no lo es.

Tabla 12.-operadores de asignacin Operadores de comparacin Operador = Ejemplo $Variable=7 Descripcin Asignacin de un valor a una variable += -= *= $A +=5 $A -=5 $A *=5 Equivale a $A=$A+5 Equivale a $A=$A-5 Equivale a $A=$A*5

169

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

/= .=

$A /=5 $B .=Cadena

Equivale a $A=$A/5 Equivale a $B=$B.Cadena(concatenacion)

Tabla13.-Operadores de comparacin

Operadores lgicos Operador and or xor Ejemplo $A and $B $A or $B $A xor $B Descripcin True si lo son $A y $B. True si lo son $A o $B. True si $A o $B son true, pero nunca a la vez. ! !$A Negacion; true si $A es false y false si $A es true. && || $A && $B $A || $B True si lo son $A y $B. True si lo son $A o $B.

Tabla 14.- Operadores lgicos l motivo para tener dos variantes de los operadores and y or es la diferencia existente en la procedencia de operadores. Operadores de bits Operador & Ejemplo $A & $B Descripcin Pone a uno los bits que lo estn en $A y en $B.

170

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

$A | $B

Pone a uno los bits que lo estn en $A o en $B.

$A ^ $B

Pone a uno los bits que lo estn en $A o en $B, pero nunca en los dos (xor). Negacin. Pone a uno de los bits que estn a 0 en $A y a 0 los bits que estn a 1.

$A >> $B

Desplaza tantas

los

bits

de a

$A la

posiciones

derecha como indica $B. Tabla 15.- Operadores de bits Otros Operadores Operador Ejemplo dir > mifich.txt Descripcin Ejecuta desde el SO el

comando que haya entre los acentos graves. @ @introduccion Control de errores: Situado antes de una instruccin; si sta genera cualquier tipo de error, este es ignorado,

continuando la ejecucion y

171

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

almacenamiento

de

la

informacin al respecto en $php_errormsg( activida track_errors). ?: ($a > 5) ? 1 : 0 Se selecciona entre dos la si esta

directiva

expresiones dependiente de una tercera. En caso de que esta sea verdadera, se

evala la primera, mientras que si es falsa, se evala la segunda. En el ejemplo, si $a es mayor que 5, el resultado es 1, y es menor, se evala a 0. Tabla 16.- Otros Operadores Se debe tener cuidado con el operador @, ya que anula la emisin de cualquier error al ejecutar alguna funcin o evaluar una expresin. Esto quiere decir que si se produce un error critico, se puede

llegar a detener la ejecucin del programa sin que se tenga constancia del motivo. Precedencia de Operadores La precedencia de un operador indica qu tan "cerca" se agrupan dos expresiones. Por ejemplo, en la expresin 1 + 5 * 3, la respuesta es 16 y no 18, ya que el operador de multiplicacin ("*") tiene una mayor precedencia que el operador de adicin ("+"). Los parntesis pueden ser usados para marcar la precedencia, si

172

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

resulta necesario. Por ejemplo: (1 + 5) * 3 evala a 18. Si la precedencia de los operadores es la misma, se utiliza una asociacin de izquierda a derecha. La siguiente tabla lista la precedencia de los operadores, con aquellos de mayor precedencia listados al comienzo de la tabla. Los operadores en la misma lnea

tienen la misma precedencia, en cuyo caso su asociatividad decide el orden para evaluarlos.

Precedencia de Operadores Asociatividad no-asociativo izquierda no-asociativos no-asociativos no-asociativos derecha izquierda izquierda izquierda no-asociativos no-asociativos Operadores clone new [ ++ -~ (int) (float) (string) Informacin Adicional clone y new array() incremento/decremento tipos tipos lgicos aritmtica aritmtica, y cadena manejo de bits comparacin comparacin

(array) (object) (bool) @ Instanceof ! */% +-. > < >= == != === !==

173

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Precedencia de Operadores Asociatividad izquierda izquierda izquierda izquierda izquierda izquierda derecha izquierda izquierda izquierda izquierda Operadores & ^ | && || ?: = += -= *= /= .= %= &= |= ^= = And Xor Or , Informacin Adicional manejo referencias manejo de bits manejo de bits lgicos lgicos ternario asignacin lgicos lgicos lgicos varios usos de bits, y

Tabla 17.- Precedencia de Operadores La asociatividad de izquierda quiere decir que la expresin es evaluada desde la izquierda a la derecha, la asociatividad de derecha quiere decir lo contrario. Example #1 Asociatividad

Use parntesis para incrementar la legibilidad del cdigo. Note: Aunque = tiene una menor precedencia que la mayora de los dems operadores, PHP aun permite expresiones similares a la siguiente: if (!$a = foo()), en cuyo caso el valor de retorno de foo() va a dar a $a. 3.4 Sentencias En un principio los programas se componen de una serie de instrucciones que se ejecutan de forma secuencial, una detrs de otra, hasta que se terminan y, por tanto, acaba el programa. Adicionalmente, existe una serie de instrucciones especiales que permiten variar el flujo del programa, esto es, el orden en que se ejecuta el cdigo. Parece claro que si dese escribir cien veces lo mismo, podrimos dar cien veces la orden de impresin o podramos o podramos decirle al programa que repitiera la misma orden cien veces. De esta segunda manera obtenemos un eficiencia ms alta a la hora de codificar y se hace ms legible los programas, dado que no se extienden durante cientos y cientos de lneas. S, nos encontramos con las categoras de sentencias que se tipifican en el programa estructurada: las sentencias secuenciales que forman bloques y que

van separadas por el carcter ; y encerradas entre llaves (salvo que sea el programa principal) salvo que sea el programa principal o tenga

175

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

una sola lnea), la sentencias que muestran alternativas (if y switch) y las repetitivas o pertenecientes a los bucles (for, while, do...while, etc. ). Expresiones Las expresiones son la piedra angular de PHP. En PHP, casi cualquier cosa que escribes es una expresin. La forma ms simple y ajustada de definir una expresin es "cualquier cosa que tiene un valor".

Las formas ms bsicas de expresiones son las constantes y las variables. Cuando escribes "$a = 5", ests asignando '5' a $a. '5', obviamente, tiene el valor 5 , en otras palabras '5' es una expresin con el valor 5 (en este caso, '5' es una constante entera). Despus de esta asignacin, se espera que el valor de $a sea 5 tambin, de manera que si escribes $b = $a, se espera tambin que se comporte igual que si escribieses $b = 5. En otras palabras, $a es una expresin tambin con el valor 5. Si todo va bien, eso es exactamente lo que pasar. Las funciones son un ejemplo algo ms complejo de expresiones. Por ejemplo, considera la siguiente funcin:

176

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Suponiendo que ests familiarizado con el concepto de funciones (si no lo ests chale un vistazo al captulo sobre funciones), asumirs que teclear $c = foo() es esencialmente lo mismo que escribir $c = 5, y has acertado. Las funciones son expresiones que valen el valor que retornan. Como foo() devuelve 5, el valor de la expresin 'foo()' es 5. Normalmente las funciones no devuelven un valor fijo, sino que suele ser calculado. Desde luego, los valores en PHP no se limitan a enteros, y lo ms normal es que no lo sean. PHP soporta tres tipos escalares: enteros, punto flotante y cadenas (los

tipos escalares son aquellos cuyos valores no pueden 'dividirse' en partes menores, no como los arrays, por ejemplo). PHP tambin soporta dos tipos compuestos (no escalares): arrays y objetos. Se puede asignar cada uno de estos tipos de valor a variables o bien retornarse de funciones, sin ningn tipo de limitacin. Hasta aqu, los usuarios de PHP/FI 2 no deberan haber notado ningn cambio. Sin embargo, PHP lleva las expresiones mucho ms all, al igual que otros lenguajes. PHP es un lenguaje orientado a expresiones, en el sentido de que casi todo es una expresin. Considera el ejemplo anterior '$a = 5'. Es sencillo ver que hay dos valores involucrados, el valor de la constante entera '5', y el valor de $a que est siendo actualizado tambin a 5. Pero la verdad es que hay un valor adicional implicado aqu, y es el valor de la propia asignacin. La asignacin misma se evala al valor asignado, en este caso 5. En la prctica, quiere decir que '$a = 5', independientemente de lo que hace, es una expresin con el valor 5. De esta manera, escribir algo como '$b = ($a = 5)' es como escribir '$a = 5; $b = 5;' (un punto y coma marca el final de una instruccin). Como las asignaciones se evalan de derecha a izquierda, puedes escribir tambin '$b = $a = 5'.

177

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Otro buen ejemplo de orientacin a expresiones es el pre y post incremento y decremento. Los usuarios de PHP/FI 2 y los de otros muchos lenguajes les sonar la notacin variable++ y variable--. Esto son las operaciones de incremento y decremento. En PHP/FI 2, la instruccin '$a++' no tiene valor (no es una expresin), y no puedes asignarla o usarla de ningn otro modo. PHP mejora las caractersticas del incremento/decremento hacindolos tambin expresiones, como en C. En PHP, como en C, hay dos tipos de incremento - pre-incremento y post-incremento. Ambos, en esencia, incrementan la variable y el efecto en la variable es idntico. La diferencia radica en el valor de la propia expresin incremento. El preincremento ,

escrito '++$variable', se evala al valor incrementado (PHP incrementa la variable antes de leer su valor, de ah el nombre 'preincremento'). El postincremento, escrito '$variable++', se evala al valor original de $variable antes de realizar el incremento (PHP incrementa la variable despus de leer su valor, de ah el nombre 'postincremento'). Un tipo muy corriente de expresiones son las expresiones de comparacin. Estas expresiones se evalan a 0 o 1, significando FALSO (FALSE) o VERDADERO (TRUE), respectivamente. PHP soporta > (mayor que), >= (mayor o igual que), == (igual que), != (distinto), < (menor que) y A menudo, se desea tener ms de una sentencia ejecutada de forma condicional. Por supuesto, no hay necesidad de encerrar cada sentencia con una clusula if. En vez de eso, se pueden agrupar varias sentencias en un grupo de sentencias. Por ejemplo, este cdigo mostrara a es mayor que b si $a fuera mayor que $b, y entonces asignara el valor de $a a $b: Las sentencias if se pueden anidar indefinidamente dentro de otras sentencias if, lo

cual proporciona una flexibilidad completa para ejecuciones condicionales en las diferentes partes de tu programa. Sentencia for Los bucles for son los bucles ms complejos en PHP. Se comportan como su contrapartida en C. La sintaxis de un bucle for es:

for (expr1; expr2; expr3) sentencia La primera expresin (expr1) se evala (ejecuta) incondicionalmente una vez al principio del bucle. Al comienzo de cada iteracin, se evala expr2 . Si se evala como TRUE, el bucle contina y las sentencias anidadas se ejecutan. Si se evala como FALSE, la ejecucin del bucle finaliza. Al final de cada iteracin, se evala (ejecuta) expr3. Cada una de las expresiones puede estar vaca. Que expr2 est vaca significa que el bucle debera correr indefinidamente (PHP implicitamente lo considera como TRUE, al igual que C). Esto puede que no sea tan intil como se podra pensar, puesto que a menudo se quiere salir de un bucle usando una sentencia break condicional en vez de usar la condicin de for.

183

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Considera los siguientes ejemplos. Todos ellos muestran nmeros del 1 al 10:

Por supuesto, el primer ejemplo parece ser el mas elegante (o quizs el cuarto), pero uno puede descubrir que ser capaz de usar expresiones vacas en bucles for resulta til en muchas ocasiones. PHP tambin soporta la "sintaxis de dos puntos" alternativa para bucles for. for (expr1; expr2; expr3): sentencia; ...; endfor; Otros lenguajes poseen una sentencia foreach para traducir un array o una tabla hash. PHP3 no posee tal construccin; PHP4 s (ver foreach). En PHP3, se puede combinar while con las funciones list() y each() para conseguir el mismo efecto. Mirar la documentacin de estas funciones para ver un ejemplo. Sentencia while Los bucles while son los tipos de bucle ms simples en PHP. Se comportan como su contrapartida en C. La forma bsica de una sentencia while es:

185

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

while (expr) sentencia El significado de una sentencia while es simple. Le dice a PHP que ejecute la(s) sentencia(s) anidada(s) repetidamente, mientras la expresin while se evale como TRUE. El valor de la expresin es comprobado cada vez al principio del bucle, as que incluso si este valor cambia durante la ejecucin de la(s) sentencia(s) anidada(s), la ejecucin no parar hasta el fin de la iteracin (cada vez que PHP ejecuta las sentencias en el bucle es una iteracin). A veces, si la expresin while se evala como FALSE desde el principio de todo, la(s) sentencia(s) anidada(s) no se ejecutarn ni siquiera una vez.

Como con la sentencia if, se pueden agrupar multiples sentencias dentro del mismo bucle while encerrando un grupo de sentencias con llaves, o usando la sintaxis alternativa: while (expr): sentencia ... endwhile; Los siguientes ejemplos son idnticos, y ambos imprimen nmeros del 1 al 10:

Sentencia do-while Los bucles do..while son muy similares a los bucles while, excepto que las condiciones se comprueban al final de cada iteracin en vez de al principio. La

187

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

principal diferencia frente a los bucles regulares while es que se garantiza la ejecucin de la primera iteracin de un bucle do..while (la condicin se comprueba slo al final de la iteracin), mientras que puede no ser necesariamente ejecutada con un bucle while regular (la condicin se comprueba al principio de cada iteracin, si esta se evala como FALSE desde el principio la ejecucin del bucle finalizar inmediatamente). Hay una sola sintaxis para los bucles do..while: El bucle de arriba se ejecutara exactamente una sola vez, despus de la primera iteracin, cuando la condicin se comprueba, se evala como FALSE ($i no es ms grande que 0) y la ejecucin del bucle finaliza. Los usuarios avanzados de C pueden estar familiarizados con un uso distinto del bucle do..while, para permitir parar la ejecucin en medio de los bloques de cdigo, encapsulandolos con do..while(0), y usando la sentencia break. El siguiente fragmento de cdigo demuestra esto:

188

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

No se preocupes si no entiende esto completamente o en absoluto. Se pueden codificar archivos de comandos e incluso archivos de comandos potentes sin usar esta 'propiedad'. 3.5 Arreglos Un valor, array en PHP es en realidad un mapa ordenado. Un mapa es un tipo de datos que asocia valores con claves. Este tipo es optimizado para varios usos diferentes; puede ser usado como una matriz real, una lista (vector), tabla asociativa

189

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

(caso particular de implementacin de un mapa), diccionario, coleccin, pila, cola y probablemente ms. Ya que los valores de una matriz pueden ser otras matrices, tambin es posible crear rboles y matrices multidimensionales. Una explicacin sobre tales estructuras de datos se encuentra por fuera del propsito de este manual, pero encontrar al menos un ejemplo de cada uno de ellos. Para ms informacin, consulte la extensa literatura que existe sobre este amplio tema.

Sintaxis Especificacin con array()

Un valor array puede ser creado por la construccin de lenguaje array(). sta toma un cierto nmero de parejas clave => valor separadas con coma. array( clave => valor , ... ) // clave puede ser un integer o string // valor puede ser cualquier valor Una clave puede ser un integer o un string. Si una clave es la representacin estndar de un integer, ser interpretada como tal (es decir, "8" ser interpretado como 8, mientras que "08" ser interpretado como "08"). Los valores float en clave sern truncados a valores tipo integer. Las matrices indexadas y las asociativas son el mismo tipo en PHP, el cual puede contener ndices tipo entero o cadena. Un valor puede ser de cualquier tipo en PHP. // 1

Si no especifica una clave para un valor dado, entonces es usado el mximo de los ndices enteros, y la nueva clave ser ese valor mximo ms 1. Si se especifica una clave que ya tiene un valor asignado, se valor ser sobrescrito.

191

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Warning Antes de PHP 4.3.0, agregar un elemento a una matriz cuya clave mxima actual es un valor negativo creaba una nueva clave como se ha descrito anteriormente. A partir de PHP 4.3.0, la nueva clave ser 0. Al usar TRUE como clave, el valor ser evaluado al integer 1. Al usar FALSE como clave, el valor ser evaluado al integer 0. Al usar NULL como clave, el valor

ser evaluado a una cadena vaca. El uso de una cadena vaca como clave crear (o reemplazar) una clave con la cadena vaca y su valor; no es lo mismo que usar corchetes vacos. Las matrices y los objetos no pueden ser usados como claves. Al hacerlo se producir una advertencia: Illegal offset type.

Creacin/modificacin con sintaxis de corchetes cuadrados

Es posible modificar una matriz existente al definir valores explcitamente en ella.

192

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Esto es posible al asignar valores a la matriz al mismo tiempo que se especifica la clave entre corchetes. Tambin es posible omitir la clave, lo que resulta en una pareja de corchetes vacos ([]). $matriz[clave] = valor; $matriz[] = valor; // clave puede ser un integer o string // valor puede ser cualquier valor Si $matriz no existe aun, ser creada, as que sta es tambin una forma alternativa de crear una matriz. Para modificar un cierto valor, simplemente asigne un nuevo valor a un elemento usando su clave. Para remover una pareja clave/valor, use la funcin unset () sobre ella.

// Esto elimina la matriz completa

Note: Como se menciona anteriormente, si no se especifica una clave, entonces se toma el mximo de los ndices enteros existentes, y la nueva clave ser ese valor mximo ms 1. Si no existen ndices enteros aun, la clave ser 0 (cero). Si se especifica una clave que ya tena un valor asignado, el valor ser reemplazado. Note que la clave entera mxima usada para este caso no necesita existir actualmente en la matriz. Tan solo debe haber existido en la matriz en algn punto desde que la matriz haya sido re-indexada. El siguiente ejemplo ilustra este caso: El resultado del ejemplo seria: Array ( [0] => 1 [1] => 2 [2] => 3 [3] => 4

[4] => 5 ) Array ( )

195

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

Array ( [5] => 6 ) Array ( [0] => 6 [1] => 7 )

Funciones tiles

Existe un buen nmero de funciones tiles para trabajar con matrices. Consulte la seccin funciones de matrices. Note: La funcin unset () le permite remover claves de una matriz. Tenga en cuenta que la matriz no es re-indexada. Si desea el comportamiento real de "eliminar y desplazar", la matriz puede ser re-indexada usando la funcin array_values ().

196

Instituto Tecnolgico superior de Coatzacoalcos. Departamento:

Edicin No. 1

Fecha de Edicin: 14/07/10

Licenciatura en Informtica

Materia:

PROGRAMACION WEB

La estructura de control foreach existe especficamente para las matrices. sta provee una manera fcil de recorrer una matriz.

Recomendaciones sobre matrices y cosas a evitar Porqu es incorrecto $foo[bar]?

Siempre deben usarse comillas alrededor de un ndice de matriz tipo cadena literal. Por ejemplo, $foo['bar'] es correcto, mientras que $foo[bar] no lo es. Pero porqu? Es comn encontrar este tipo de sintaxis en scripts viejos: Esto est mal, pero funciona. La razn es que este cdigo tiene una constante indefinida (bar) en lugar de un valor string ('bar' - note las comillas). Puede que en el futuro PHP defina constantes que, desafortunadamente para tal tipo de cdigo, tengan el mismo nombre. Funciona porque PHP automticamente convierte una cadena pura (una cadena sin comillas que no corresponda con smbolo conocido alguno) en una cadena que contiene la cadena pura. Por ejemplo, si no se ha definido una constante llamada bar, entonces PHP reemplazar su valor por la cadena 'bar' y usar sta ltima. Note: Esto no quiere decir que siempre haya que usar comillas en la clave. No use comillas con claves que sean constante

Você também pode gostar