Sunteți pe pagina 1din 155

Instituto Tecnolgico Superior de

Jess Carranza
Programacin Web ASIGNATURA: CLAVE DE LA ASIGNATURA: SCF - 0427

Ingeniera en Sistemas Computacionales CARRERA:

ANTOLOGA
PRESENTA:

L.I. ESTEBAN SANCHEZ MENDOZA

Jess Carranza, Ver

Enero 2012

NDICE GENERAL Tema Pgina

UNIDAD I. INTRODUCCIN A LAS TECNOLOGAS WEB. 1.1 Perspectiva histrica del Internet. .............................................................. 6 1.2 Protocolo http (protocolo de transferencia de hipertexto). .......................... 8 1.2.1 Arquitectura del WWW...................................................................... 10 1.2.2 URLs. ............................................................................................... 11 1.2.3 Mtodos http. Persistencia en http Cookies. ................................... 13 1.3 Introduccin al HTML. Lenguaje de despliegue del web ............................ 14 1.3.1 HTML como un tipo SGML................................................................ 15 1.3.2 Elementos del lenguaje HTML. ......................................................... 17 1.3.3 Tablas en HTML................................................................................ 18 1.3.4 Formularios. ...................................................................................... 19 1.4 Evolucin del desarrollo de aplicaciones Web. .......................................... 21 1.5 Hojas de estilo en cascada e introduccin al XML. .................................... 22

UNIDAD II. DESARROLLO DE APLICACIONES WEB 2.1 Arquitectura de las aplicaciones Web. ....................................................... 25 2.2 Lenguajes de programacin del lado del cliente. ....................................... 29 2.3 Lenguajes de programacin del lado del servidor. ..................................... 30 2.4 Ambientes para el desarrollo de aplicaciones Web.................................... 34 2.5 Metodologas para el desarrollo de aplicaciones Web. .............................. 34 2.6 Aspectos de seguridad. .............................................................................. 44

UNIDAD III. PROGRAMACIN DEL LADO DEL SERVIDOR. 3.1 Procesamiento del lado del servidor. ......................................................... 47 3.2 Conceptos bsicos de la herramienta de desarrollo................................... 51 3.3 Operadores. ............................................................................................... 54 3.4 Sentencias.................................................................................................. 62 3.5 Arreglos. ..................................................................................................... 71 3.6 Funciones y libreras. ................................................................................. 83 3.7 Ejemplos prcticos. .................................................................................... 96 3.8 Procesado de formularios........................................................................... 107 3.9 Sesiones..................................................................................................... 108 3.10 Conectividad entre el servidor Web y el servidor de base de datos. ........ 114 3.11 Manejo de archivos. ................................................................................. 116 3.12 Seguridad. ................................................................................................ 123 UNIDAD IV. PROCESAMIENTO DEL LADO DEL CLIENTE 4.1 Lenguaje Script del cliente. ........................................................................ 127 4.2 Modelo de objetos con lenguaje Script....................................................... 132 4.3 Objetos lenguaje Script nter construidos. .................................................. 136 4.4 Eventos con lenguaje Script. ...................................................................... 137 4.5 Validacin de entrada de datos del lado del cliente. .................................. 137 4.6 Consideraciones del soporte del navegador. ............................................. 138

UNIDAD V. SERVICIOS WEB XML. 5.1 Visin general de servicios Web XML. ....................................................... 140 5.2 Tecnologas subyacentes........................................................................... 140 5.2.1 SOAP ................................................................................................ 141 5.2.2 WSDL................................................................................................ 143 5.2.3 UDDI ................................................................................................. 146 5.3 Publicacin de un servicio WEB. ................................................................ 147 5.4 Consumo de un servicio WEB.................................................................... 148

INTRODUCCION

El diseo web es una actividad que consiste en la planificacin, diseo e implementacin de sitios web y pginas web. No es simplemente una aplicacin del diseo convencional, ya que requiere tener en cuenta cuestiones tales como navegabilidad, interactividad, usabilidad, arquitectura de la informacin y la interaccin de medios como el audio, texto, imagen y vdeo. Se lo considera dentro del diseo multimedia. La unin de un buen diseo con una jerarqua bien elaborada de contenidos aumenta la eficiencia de la web como canal de comunicacin e intercambio de datos, que brinda posibilidades como el contacto directo entre el productor y el consumidor de contenidos, caracterstica destacable del medio. El diseo web ha visto amplia aplicacin en los sectores comerciales de Internet especialmente en la World Wide Web. Asimismo, a menudo la web se utiliza como medio de expresin plstica en s. Artistas y creadores hacen de las pginas en Internet un medio ms para ofrecer sus producciones y utilizarlas como un canal ms de difusin de su obra.

Unidad I. Introduccin a la Programacin Web

Objetivo:

Comprender las caractersticas de una aplicacin Web y conocer los elementos que interactan con ella.

Programacin Web

Unidad I.

1.1.

Perspectiva histrica del Internet.


Los inicios de Internet nos remontan a los aos 60. En plena guerra fra, Estados

Unidos crea una red exclusivamente militar, con el objetivo de que, en el hipottico caso de un ataque ruso, se pudiera tener acceso a la informacin militar desde cualquier punto del pas. Este red se cre en 1969 y se llam ARPANET. En principio, la red contaba con 4 ordenadores distribuidos entre distintas universidades del pas. Dos aos despus, ya contaba con unos 40 ordenadores conectados. Tanto fue el crecimiento de la red que su sistema de comunicacin se qued obsoleto. Entonces dos investigadores crearon el Protocolo TCP/IP, que se convirti en el estndar de comunicaciones dentro de las redes informticas (actualmente seguimos utilizando dicho protocolo). ARPANET sigui creciendo y abrindose al mundo, y cualquier persona con fines acadmicos o de investigacin poda tener acceso a la red. Las funciones militares se desligaron de ARPANET y fueron a parar a MILNET, una nueva red creada por los Estados Unidos. La NSF (National Science Fundation) crea su propia red informtica llamada NSFNET, que ms tarde absorbe a ARPANET, creando as una gran red con propsitos cientficos y acadmicos. El desarrollo de las redes fue abismal, y se crean nuevas redes de libre acceso que ms tarde se unen a NSFNET, formando el embrin de lo que hoy conocemos como INTERNET.

En 1985 la Internet ya era una tecnologa establecida, aunque conocida por unos pocos. El autor William Gibson hizo una revelacin: el trmino "ciberespacio". En ese tiempo la red era basicamente textual, as que el autor se baso en los videojuegos. Con el tiempo la palabra "ciberespacio" termin por ser sinonimo de Internet.El desarrollo de NSFNET fue tal que hacia el ao 1990 ya contaba con alrededor de 100.000 servidores.

L.I. Esteban Snchez Mendoza

Pgina 6

Programacin Web

Unidad I.

En el Centro Europeo de Investigaciones Nucleares (CERN), Tim Berners Lee diriga la bsqueda de un sistema de almacenamiento y recuperacin de datos. Berners Lee retom la idea de Ted Nelson (un proyecto llamado "Xanad" ) de usar hipervnculos. Robert Caillau quien cooper con el proyecto, cuanta que en 1990 deciden ponerle un nombre al sistema y lo llamarn World Wide Web (WWW) o telaraa mundial. La nueva frmula permita vincular informacin en forma lgica y a travs de las redes. El contenido se programaba en un lenguaje de hipertexto con "etiquetas" que asignaban una funcin a cada parte del contenido. Luego, un programa de computacin, un intrprete, eran capaz de leer esas etiquetas para despeglar la informacin. Ese interprete sera conocido como "navegador" o "browser". En 1993 Marc Andreesen produjo la primera versin del navegador "Mosaic", que permiti acceder con mayor naturalidad a la WWW. La interfaz grfica iba ms all de lo previsto y la facilidad con la que poda manejarse el programa abra la red a los legos. Poco despus Andreesen encabez la creacin del programa Netscape. A partir de entonces Internet comenz a crecer ms rpido que otro medio de comunicacin, convirtindose en lo que hoy todos conocemos. Algunos de los servicios disponibles en Internet aparte de la WEB son el acceso remoto a otras mquinas (SSH y telnet), transferencia de archivos (FTP), correo electrnico (SMTP), conversaciones en lnea (IMSN MESSENGER, ICQ, YIM, AOL, jabber), transmisin de archivos (P2P, P2M, descarga directa), etc.

L.I. Esteban Snchez Mendoza

Pgina 7

Programacin Web

Unidad I.

1.2.

Protocolo http (protocolo de transferencia de hipertexto).


Desde 1990, el protocolo HTTP (Protocolo de transferencia de hipertexto) es el

protocolo ms utilizado en Internet. La versin 0.9 slo tena la finalidad de transferir los datos a travs de Internet (en particular pginas Web escritas en HTML). La versin 1.0 del protocolo (la ms utilizada) permite la transferencia de mensajes con encabezados que describen el contenido de los mensajes mediante la codificacin MIME. El propsito del protocolo HTTP es permitir la transferencia de archivos (principalmente, en formato HTML). Entre un navegador (el cliente) y un servidor web (denominado, entre otros, httpd en equipos UNIX) localizado mediante una cadena de caracteres denominada direccin URL.

Comunicacin entre el navegador y el servidor


La comunicacin entre el navegador y el servidor se lleva a cabo en dos etapas:

El navegador realiza una solicitud HTTP El servidor procesa la solicitud y despus enva una respuesta HTTP.

En realidad, la comunicacin se realiza en ms etapas si se considera el procesamiento de la solicitud en el servidor. Dado que slo nos ocupamos del protocolo HTTP, no se explicar la

L.I. Esteban Snchez Mendoza

Pgina 8

Programacin Web

Unidad I.

parte del procesamiento en el servidor en esta seccin del artculo. Si este tema les interesa, puede consultar el artculo sobre el tratamiento de CGI.

Solicitud HTTP
Una solicitud HTTP es un conjunto de lneas que el navegador enva al servidor. Incluye: Una lnea de solicitud: es una lnea que especifica el tipo de documento solicitado, el mtodo que se aplicar y la versin del protocolo utilizada. La lnea est formada por tres elementos que deben estar separados por un espacio:
o o o

el mtodo la direccin URL la versin del protocolo utilizada por el cliente (por lo general, HTTP/1.0)

Los campos del encabezado de solicitud: es un conjunto de lneas opcionales que permiten aportar informacin adicional sobre la solicitud y/o el cliente (navegador, sistema operativo, etc.). Cada una de estas lneas est formada por un nombre que describe el tipo de encabezado, seguido de dos puntos (:) y el valor del encabezado. El cuerpo de la solicitud: es un conjunto de lneas opcionales que deben estar separadas de las lneas precedentes por una lnea en blanco y, por ejemplo, permiten que se enven datos por un comando POST durante la transmisin de datos al servidor utilizando un formulario.

L.I. Esteban Snchez Mendoza

Pgina 9

Programacin Web

Unidad I.

1.2.1 Arquitectura del WWW.


Web o la web, la "red" o www de "World Wide Web", es bsicamente un medio de comunicacin de texto, grficos y otros objetos multimedia a travs de Internet, es decir, la web es un sistema de hipertexto que utiliza Internet como su mecanismo de transporte o desde otro punto de vista, una forma grfica de explorar Internet. La web fue creada en 1989 en un instituto de investigacin de Suiza , la web se basa en y el protocolo de transporte de hipertexto (hypertext transport protocol (http)). La mayora de los documentos de la web se crean utilizando lenguaje HTML (hypertext markup language). Es importante saber que web o www no son sinnimo de Internet, la web es un subconjunto de Internet que consiste en pginas a las que se puede acceder usando un hipertexto. Internet es la red de redes donde reside toda la informacin. Tanto el correo electrnico, como FTPs, juegos, etc. son parte de Internet, pero no de la Web. Para buscar hipertexto se utilizan programas llamados web que recuperan trozos de informacin (llamados "documentos" o "pginas web") de los servidores web y muestran en la pantalla del ordenador de la persona que est buscando la informacin grfica, textual o video e incluso audio. Despus se pueden seguir enlaces o hyperlinks en cada pgina a otros documentos o incluso devolver informacin al servidor para interactuar con l. Al acto de seguir un enlace tras otro a veces se le llama navegar en Internet.

La web se ha convertido en un medio muy popular de publicar informacin en Internet, y con el desarrollo del protocolo de transferencia segura (secured server protocol (https)), la web es ahora un medio de comercio electrnico donde los consumidores pueden escoger sus productos online y realizar sus compras utilizando la informacin de sus tarjetas bancarias de forma segura.

L.I. Esteban Snchez Mendoza

Pgina 10

Programacin Web

Unidad I.

1.2.2 URLs.
URL es el acrnimo de (Uniform Resource Locator), localizador uniforme de recursos y permite localizar o acceder de forma sencilla cualquier recurso de la red desde el navegador de la WWW. Con la WWW se pretende unificar el proceso informacin de servicios que antes eran incompatibles entre s, tratando de conseguir que todos los servicios de internet sean accesibles a travs de la WWW, de esta forma desde un mismo programa se puede tener acceso a todos los recursos de una forma uniforme y permite que los documentos HTML incluyan enlaces a otras fuentes de informacin en servicios como FTP, gopher, WAIS, etc .

Uso y Formato
Las URL se utilizarn para definir el documento de destino de los hiperenlaces, para referenciar los grficos y cualquier otro fichero que se desee incluir dentro de un documento HTML. Cada elemento de internet tendr una URL que lo defina, ya se encuentre en un servidor de la WWW, FTP, gopher o las News.

El formato de una URL ser: servicio://maquina.dominio:puerto/camino/fichero El servicio ser alguno de los de internet, estos pueden ser:

http: (HyperText Transport Protocol), es el protocolo utilizado para transmitir hipertexto. Todas las pginas HTML en servidores WWW debern ser referenciadas mediante este servicio. Indicar conexin a un servidor de la WWW.

L.I. Esteban Snchez Mendoza

Pgina 11

Programacin Web

Unidad I.

https: (HyperText Transport Protocol Secure), es el protocolo para la conexin a servidores de la WWW seguros. Estos servidores son normalmente de mbito comercial y utilizan encriptacin para evitar la intercepcin de los datos enviados, usualmente numeros de tarjeta de credito, datos personales, etc ..., realizar una conexin a un servidor de la WWW seguro. ftp: (File Transfer Protocol), utilizar el protocolo FTP de transferencia de ficheros. Se utilizar cuando la informacin que se desee acceder se encuentre en un servidor de ftp. Por defecto se acceder a un servidor annimo (anonymous), si se desea indicar el nombre de usuario se usar: ftp://maquina.dominio@usuario, y luego le pedir la clave de acceso.

gopher, wais: Cualquiera de estos servicios de localizacin de informacin, se


indicar el directorio para localizar el recurso concreto.

news: Accede al servicio de news, para ello el visualizador de la WWW debe ser capaz
de presentar este servicio, todos no lo son. Se indicar el servidor de news y como camino el grupo de noticias al que se desea acceder: news://news.cica.es/uca.es.

telnet: Emulacin de terminal remota, para conectarse a mquina multiusuario, se


utiliza para acceder a cuentas pblicas como por ejemplo la de biblioteca. Lo normal es llamar a una aplicacin externa que realice la conexin. En este caso se indicar la mquina y el login: telnet://maquina.dominio@login.

mailto: Se utilizar para enviar correo electrnico, todos los navegadores no son
capaces. En este caso solo se indicar la direccin de correo electrnico del destino: mailto://alias. correo@domino. La maquina.dominio indicar el servidor que nos proporciona el recurso, en este caso se utilizar el esquema IP para identificar la maquina ser el nombre de la mquina y el dominio. En el caso de nuestra Universidad el dominio siempre ser uca.es. Por tanto un nombre valido de maquina ser www2.uca.es. Es muy importante indicar siempre el dominio, ya que debemos suponer que se conectarn a nuestras pginas desde servidores externos a nuestra red local por tanto si no indicamos el dominio las URL que especifiquemos no podran ser seguidas por los navegadores L.I. Esteban Snchez Mendoza Pgina 12

Programacin Web

Unidad I.

externos. Si en vez de www2.uca.es utilizamos www2 ser perfectamente accesible por cualquier mquina de nuestra red local pero si se referenciara desde una red con distinto dominio la maquina www2 ser la maquina llamada as en el dominio remoto si existiera, que no es la que deseamos referenciar. El puerto TCP es opcional y lo normal es no ponerlo si el puerto es el mismo que se utiliza normalmente por el servicio. Solo se utilizar cuando el servidor utilice un puerto distinto al puerto por defecto. El camino ser la ruta de directorios que hay que seguir para encontrar el documento que se desea referenciar. para separar los subdirectorios utilizaremos la barra de UNIX /, se usa por convenio al ser este tipo de mquinas las ms usadas como servidores. El nombre de los subdirectorios y del fichero referenciado puede ser de ms de ocho caracteres y se tendr en cuenta la diferencia entre maysculas y minsculas en el nombre. La extensin de los ficheros ser tambin algo importante, ya que por ella sabe el servidor el tipo de documento que se accede e indica al cliente (navegador) el modo en que debe tratarse ese documento. Para definir los tipos de documentos se utiliza los tipos MIME. Las extensiones ms normales con sus tipos correspondientes son: Tipo MIME text/html text/plain image/gif image/jpeg Extensin Tipo de fichero

html .htm, documento HTML .txt .gif jpg .jpeg por defecto, texto plano imagen de formato GIF imagen de formato JPEG

1.2.3 Mtodos http. Persistencia en http Cookies.


Cookie' (pronunciado: literalmente "galleta") es un fragmento de informacin que se almacena en el disco duro del visitante de una pgina web a travs de su modo a peticin del servidor de la pgina. Esta informacin puede ser luego recuperada por el servidor en posteriores

L.I. Esteban Snchez Mendoza

Pgina 13

Programacin Web

Unidad I.

visitas. En ocasiones tambin se le llama "huella". Las invent Lou Montulli, un antiguo empleado de Netscape Communications." s 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-navegador-usuario. 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. 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. Las cookies pueden ser borradas, aceptadas o bloqueadas segn desee, para esto slo debe configurar convenientemente el navegador web.

1.3. Introduccin al HTML. Lenguaje de despliegue del web.


HTML, siglas de HyperText Markup Language (lenguaje de marcado de hipertexto), es el lenguaje de marcado predominante para la elaboracin de pginas web. Es usado para describir la estructura y el contenido en forma de texto, as como para complementar el texto con objetos tales como imgenes. HTML se escribe en forma de etiquetas, rodeadas por corchetes angulares (<,>). HTML tambin puede describir, hasta un cierto punto, la apariencia de un L.I. Esteban Snchez Mendoza Pgina 14

Programacin Web

Unidad I.

documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML. HTML tambin es usado para referirse al contenido del tipo de MIME text/html o todava ms ampliamente como un trmino genrico para el HTML, ya sea en forma descendida del XML (como XHTML 1.0 y posteriores) o en forma descendida directamente de SGML

1.3.1 HTML como un tipo SGML

L.I. Esteban Snchez Mendoza

Pgina 15

Programacin Web

Unidad I.

El SGML es un sistema para definir lenguajes para dar formato a documentos (markup languages). Los autores utilizan un cdigo de formato (en ingls markup) en sus documentos para representar informacin estructural, presentacional y semntica junto con el contenido. El HTML es un ejemplo de lenguaje de formato de documentos. Aqu tenemos un ejemplo de un documento HTML: Un documento HTML se divide en una seccin de cabecera (aqu, entre y ) y un cuerpo (aqu, entre y ). El ttulo del documento aparece en la cabecera (junto con otras informaciones sobre el documento), y el contenido del documento aparece en el cuerpo. El cuerpo de este ejemplo contiene nicamente un prrafo, codificado o marcado como Cada lenguaje de formato de documentos definido con SGML se llama aplicacin SGML. Una aplicacin SGML se caracteriza generalmente por: 1. Una declaracin SGML. La declaracin SGML especifica qu caracteres y delimitadores pueden aparecer en la aplicacin. 2. Una definicin del tipo de documento (document type definition, DTD). El DTD define la sintaxis de las estructuras de formato. El DTD puede incluir definiciones adicionales, tales como referencias a entidades de caracteres. 3. Una especificacin que describe la semntica que se debe conferir al cdigo de formato. Esta especificacin tambin impone restricciones de sintaxis que no pueden expresarse dentro del DTD. 4. Documentos que contienen datos (contenido) y cdigo (markup). Cada documento contiene una referencia al DTD que debe usarse para interpretarlo. Esta especificacin incluye una declaracin SGML, tres definiciones del tipo de documento (ver la seccin sobre informacin sobre la versin de HTML para una descripcin de las tres), y una lista de referencias de caracteres

L.I. Esteban Snchez Mendoza

Pgina 16

Programacin Web

Unidad I.

1.3.2 Elementos del lenguaje HTML.


Adems de etiquetas y atributos, HTML define el trmino elemento para referirse a las partes que componen los documentos HTML. Aunque en ocasiones se habla de forma indistinta de "elementos" y "etiquetas", en realidad un elemento HTML es mucho ms que una etiqueta, ya que est formado por: Una etiqueta de apertura, que contiene: 1. 2. 3. Cero o ms atributos. Texto encerrado por la etiqueta. Una etiqueta de cierre.

Por otra parte, el lenguaje HTML clasifica a todos los elementos en dos grupos: elementos en lnea (inline elements en ingls) y elementos de bloque (block elements en ingls). La principal diferencia entre los dos tipos de elementos es la forma en la que ocupan el espacio disponible en la pgina. Los elementos de bloque siempre empiezan en una nueva lnea y ocupan todo el espacio disponible hasta el final de la lnea, aunque sus contenidos no lleguen hasta el final de la lnea. Por su parte, los elementos en lnea slo ocupan el espacio necesario para mostrar sus contenidos. Los elementos en lnea definidos por HTML son: a, abbr, acronym, b, basefont, bdo, big, br, cite, code, dfn, em, font, i, img, input, kbd, label, q, s, samp, select, small, span, strike, strong, sub, sup, textarea, tt, u, var. Los elementos de bloque definidos por HTML son: address, blockquote, center, dir, div, dl, fieldset, form, h1, h2, h3, h4, h5, h6, hr, isindex, menu, noframes, nos-cript, ol, p, pre, table, ul. Los siguientes elementos tambin se considera que son de bloque: dd, dt, frame-set, li, tbody, td, tfoot, th, thead, tr. Los siguientes elementos pueden ser en lnea y de bloque segn las circunstancias: button, del, iframe, ins, map, object, script.

L.I. Esteban Snchez Mendoza

Pgina 17

Programacin Web 1.3.3 Tablas en HTML.

Unidad I.

Al igual que las listas,las tablas son componentes dedicados fundamentalmente a mejorar la visualizacin de los documentos en formato electrnico. Se trata de una funcionalidad bsica de la inmensa mayora de los programas de tratamiento de texto y una forma habitual de presentar informacin, especialmente numrica, desde la introduccin de las mejoras de clculo. TABLAS BASICAS La directiva dedicada a las tablas es (directiva cerrada). No es preciso determinar inicialmente el nmero de filas o columnas, el navegador se encarga de averiguarlo a medida que profundice en el contenido de la tabla que est cargando en pantalla. Cada celda se limita con la directiva cerrada y cada fila con la directiva. Una vez que tengamos declarada el comienzo de nuestra tabla con se coloca un nuevo comando contenedor, el atributo (Table Row), para identificar cada fila de la tabla, en el interior de la definicin de la tabla: Identifica el comienzo de la tabla Esto identifica una fila horizontal. Identifica el final de la tabla En cada una de las filas podrn aparecer celdillas que sern de 2 tipos: cabeceras o normales. Celdillas Cabeceras: Este tipo de celdillas son las que por as decirlo, identifican cada una de las columnas de la celdilla, y su interior destaca del resto del texto contenido en el resto de la tabla, debido a que aparece en negrita. Se limitan por (Table Head) y todo lo que contenga en su interior, destacara del resto del documento. En este ejemplo definimos una tabla con 2 columnas y una fila. Las columnas contendrn un texto destacado del resto del contenido de la tabla. Fijarse que todo lo que vaya entre las directivas definen el total de una fila, y despus podremos poner tantas celdillas de cabecera como queramos, definiendo cada una por medio de. Un ejemplo de celdillas de cabecera sera el empleado por ejemplo para destacar los das de la semana (Lunes, Martes, Mircoles,...), de un horario de clases, del resto de las celdillas que contienen las horas de clase en s.

L.I. Esteban Snchez Mendoza

Pgina 18

Programacin Web

Unidad I.

1.3.4 Formularios.
Un formulario HTML es una seccin de un documento que contiene contenido normal, cdigo, elementos especiales llamados controles (casillas de verificacin (checkboxes), radiobotones (radio buttons), menes, etc.), y rtulos (labels) en esos controles. Los usuarios normalmente "completan" un formulario modificando sus controles (introduciendo texto, seleccionando objetos de un men, etc.), antes de enviar el formulario a un agente para que lo procese (p.ej., a un servidor web, a un servidor de correo, etc.) Aqu se muestra un ejemplo de un formulario simple que incluye rtulos, radiobotones y botones para reinicializar el formulario o para enviarlo: Nombre: Apellido: email: Varn Mujer
Enviar Restablecer

Nota. Esta especificacin incluye informacin ms detallada sobre formularios en las subsecciones sobre representacin de formularios.

Controles
Los usuarios interaccionan con los formularios a travs de los llamados controles. El "nombre de control" de un control viene dado por su atributo name. El "campo de accin" o alcance del atributo name de un control contenido en un elemento FORM es el elemento FORM. Cada control tiene tanto un valor inicial como un valor actual, que son ambos cadenas de caracteres. Consulte la definicin de cada control para obtener informacin sobre los valores iniciales y las posibles restricciones que puede imponer cada control sobre sus valores. En general, el "valor inicial" de un control puede especificarse con el atributo value del elemento de control. Sin embargo, el valor inicial de un elemento TEXTAREA viene dado por sus contenidos, y el valor inicial de un elemento OBJECT de un formulario est determinado por la implementacin del objeto (es decir, se sale fuera del alcance de esta especificacin). El "valor actual" del control se hace en primer lugar igual al valor inicial. A L.I. Esteban Snchez Mendoza Pgina 19

Programacin Web

Unidad I.

partir de ese momento, el valor actual del control puede ser modificado a travs de la interaccin con el usuario y mediante scripts. El valor inicial de un control no cambia. As, cuando se reinicializa el formulario, el valor actual de cada control se reinicializa a su valor inicial. Si el control no tiene un valor inicial, el efecto de una reinicializacin del formulario sobre ese control es indefinido. Cuando se enva un formulario para su procesamiento, para algunos controles se empareja su nombre con su valor actual, y estas parejas se envan con el formulario. Aquellos controles cuyas parejas nombre/valor se envan se llaman controles con xito.

Tipos de controles
HTML define los siguientes tipos de controles: botones Los autores pueden crear tres tipos de botones: Botones de envo (submit buttons): Cuando se activa, un botn de envo enva un formulario. Un formulario puede contener ms de un botn de envo. Botones de reinicializacin (reset buttons): Cuando se activa, un botn de reinicializacin reinicializa todos los controles a sus valores iniciales. Botones pulsadores (push buttons): Los botones pulsadores no tienen un comportamiento por defecto. Cada botn pulsador puede tener asociados scripts en el lado del cliente a travs del atributo evento del elemento. Cuando ocurre un evento (p.ej., el usuario aprieta el botn, lo suelta, etc.), se acciona el script asociado. Los autores deberan especificar el lenguaje de programacin del script de un botn pulsador a travs de una declaracin de scripts por defecto (con el elemento META). Los autores crean botones con el elemento BUTTON o el elemento INPUT. Consulte las definiciones de estos elementos para ms detalles sobre cmo especificar diferentes tipos de botones.

L.I. Esteban Snchez Mendoza

Pgina 20

Programacin Web

Unidad I.

1.4 Evolucin del desarrollo de aplicaciones 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.

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

L.I. Esteban Snchez Mendoza

Pgina 21

Programacin Web

Unidad I.

webenfocadas 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 distribuidas por desarrolladores independientes. El fin del crculo de adopcin de software (Servicios en beta perpetuo) La Web 2.0 con ejemplos La forma ms fcil de comprender lo que significa la Web 2.0 es a travs de ejemplos. Podemos comparar servicios web que marcan claramente la evolucin hacia el Web 2.0

1.5 Hojas de estilo en cascada e introduccin al XML.


Qu es CSS? CSS es un lenguaje sencillo para la aplicacin de estilos a un elemento XML. Un documento XML puede estar formateado de muchas diferentes formas y propsitos por lo que sera muy til utilizar un slo documento XML y diferentes posibles formateos dependiendo del uso que se le vaya a dar al documento.. CSS, Cascading Style Sheets, hojas de estilo en cascada, fue introducido en 1996 como el standar para aadir informacin de estilo a los documentos HTML. Pero este uso estaba restringido slo a las etiquetas propias de HTML. Con XML estas reglas de estilo pueden aplicarse a todos los elementos. CSS tiene dos versiones denominadas CSS1 y CSS2 aparecidas en 1996 y 1998 respectivamente. Aunque el problema en este caso no es el standar, sino el procesamiento de este puesto que en la actualidad no todos los navegadores estn L.I. Esteban Snchez Mendoza Pgina 22

Programacin Web

Unidad I.

preparados para su procesamiento. CSS se expresa mediante reglas en un fichero de texto plano. Cada regla contiene el nombre del elemento al que se aplica y el estilo definido. CSS para HTML vs CSS para XML Las principales diferencias son: Los elementos a los que se les pueden asignar una regla de estilo no estn limitados. Los navegadores HTML no entienden e procesamiento de instrucciones, simplemente la hoja de estilos se incluye como un ta style. Los navegadores HTML tienen un formateo restringido, mientras que XML no. Cmo especificar un fichero CSS Para poder visualizar un documento XML es necesario especificar qu formato se debe utilizar. Para este propsito se utiliza la instruccin xml-stylesheet De este modo el fichero de estilos se incluye en el documento XML. La instruccin posee dos atributos. href: indica la direccin absoluta o relativa donde se encuentra el fichero de estilos. En este caso el valor de href podra haber sido "http://geneura.ugr.es/~maribel/xml/css/mi_fichero.css". En el ejemplo el fichero se denomina mi_fichero.css y debe encontrarse en el mismo directorio que el que estamos escribiendo. type: Representa el MIME tipo que se va a utilizar que ser text/css para un fichero CSS.

ESTILOS EN CASCADA
A un mismo fichero es posible adjuntar ms de un fichero de estilos, y esto puede provocar que un mismo elemento posea varias reglas de estilo asignadas y contradictorias entre si, por lo que se determina un orden de aplicacin de estas reglas denominado estilos en cascada. Existen varias formas de asignar un fichero de estilo: xml-stylesheet. La directiva @import. L.I. Esteban Snchez Mendoza Pgina 23

Programacin Web

Unidad I.

Utilizando el browser ya sea para utilizar los estilos por defecto o para utilizar un fichero de estilos especfico. La primera forma est clara. Respecto a la segunda debe incluirse en la primera lnea del fichero css y el formato es el siguiente: @import url(direccion relativa o absoluta); El orden de importacin de los ficheros de estilos es el orden de las declaraciones, y as referencias circulares no estn permitidas. El orden en el que se aplican las reglas es muy sencillo. Generalmente si existen ms de una regla para un mismo elemento, se aplica la regla ms especfica. Por ejemplo: En una regla con un atributo ID y CLASS tendra preferencia la aplicacin del ID primero y despues de la clase y en su defecto la regla del elemento general y sino las reglas que rigen el elemento padre y si no existen las reglas generales de estilo del navegador. En concreto se aplica: Reglas del autor. Reglas importadas. Orden de reglas en el fichero css.

L.I. Esteban Snchez Mendoza

Pgina 24

Unidad II. Desarrollo de Aplicaciones Web

Objetivo:

Comprender los conceptos y elementos bsicos que involucra el desarrollo de aplicaciones Web

Programacin Web

Unidad II

Desarrollo de aplicaciones Web


El diseo y desarrollo de aplicaciones web consiste en implementar sus necesidades, objetivos o ideas en Internet utilizando las tecnologas ms idneas segn su proyecto. Las aplicaciones web ofrecen servicios a los usuarios de Internet que acceden utilizando un navegador web como I. Explorer, Firefox entre otros, dirigindose a una direccin de Internet donde obtendrn los servicios que buscan.

2.1 Arquitectura de las aplicaciones Web


Es un SI donde una gran cantidad de datos voltiles, altamente estructurados, van a ser consultados, procesados y analizados mediante navegadores. Una de las principales caractersticas va a ser su alto grado de interaccin con el usuario, y el diseo de su interfaz debe ser claro, simple y debe estar estructurado de tal manera que sea orientativo para cada tipo de usuarios. Existen diferentes tipos de arquitectura, las cuales son: Arquitectura de dos niveles: Es la ms simple, se tiene el nivel del Cliente y el nivel del Servidor.

L.I. Esteban Snchez Mendoza

Pgina 25

Programacin Web Arquitectura Web de tres niveles:

Unidad II

El primer nivel consiste en la capa de presentacin que incluye no slo el navegador, sino tambin el servidor web que es el responsable de dar a los datos un formato adecuado. El segundo nivel est referido habitualmente a algn tipo de programa o script. Finalmente, el tercer nivel proporciona al segundo los datos necesarios para su ejecucin.

Arquitectura MVC: La arquitectura Modelo-View-Controller surgi como patrn arquitectnico para el desarrollo de interfaces grficos de usuario en entornos Smalltalk. Su concepto se basaba en separar el modelo de datos de la aplicacin de su representacin de cara al usuario y de la interaccin de ste con la aplicacin, mediante la divisin de la aplicacin en tres partes fundamentales: El modelo, que contiene la lgica de negocio de la aplicacin. La vista, que muestra al usuario la informacin que ste necesita. El controlador, que recibe e interpreta la interaccin del usuario, actuando sobre modelo y vista de manera adecuada para provocar cambios de estado en la representacin interna de los datos, as como en su visualizacin.

L.I. Esteban Snchez Mendoza

Pgina 26

Programacin Web

Unidad II

Esta arquitectura ha demostrado ser muy apropiada para las aplicaciones web y especialmente adaptarse bien a las tecnologas proporcionadas por la plataforma J2EE, de manera que: El modelo, conteniendo lgica de negocio, sera modelado por un conjunto de clases Java, existiendo dos claras alternativas de implementacin, utilizando objetos java tradicionales llamados POJOs (Plain Old Java Objects) o bien utilizando EJB (Enterprise JavaBeans) en sistemas con mayores necesidades de concurrencia o distribucin. La vista proporcionar una serie de pginas web dinmicamente al cliente, siendo para l simples pginas HTML. Existen mltiples frameworks que generan estas pginas web a partir de distintos formatos, siendo el ms extendido el de pginas JSP (JavaServer Pages), que mediante un conjunto de etiquetas o tags XML proporcionan un interfaz sencillo y adecuado a clases Java y objetos proporcionados por el servidor de aplicaciones. Esto permite que sean sencillas de desarrollar por personas con conocimientos de HTML. Entre estos tags tiene mencin la librera estndar JSTL (JavaServer Pages Standard Tag Library) que proporciona una gran funcionalidad y versatilidad. El funcionamiento de una aplicacin web J2EE que utilice el patrn arquitectural MVC se puede descomponer en una serie de pasos: El usuario realiza una accin en su navegador, que llega al servidor mediante una peticin HTTP y es recibida por un servlet (controlador). Esa peticin es interpretada y se transforma en la ejecucin de cdigo java que delegar al modelo la ejecucin de una accin de ste. El modelo recibe las peticiones del controlador, a travs de un interfaz o fachada que encapsular y ocultar la complejidad del modelo al controlador. El resultado de esa peticin ser devuelto al controlador. El controlador recibe del modelo el resultado, y en funcin de ste, selecciona la vista que ser mostrada al usuario, y le proporcionar los datos recibidos del modelo y otros datos necesarios para su transformacin a HTML. Una vez hecho esto el control pasa a la vista para la realizacin de esa transformacin. L.I. Esteban Snchez Mendoza Pgina 27

Programacin Web

Unidad II

En la vista se realiza la transformacin tras recibir los datos del controlador, elaborando la respuesta HTML adecuada para que el usuario la visualice. Ventajas: Al separar de manera clara la lgica de negocio (modelo) de la vista permite la reusabilidad del modelo, de modo que la misma implementacin de la lgica de negocio que maneja una aplicacin pueda ser usado en otras aplicaciones, sean stas web o no. Permite una sencilla divisin de roles, dejando que sean diseadores grficos sin conocimientos de programacin los que se encarguen de la realizacin de la capa vista, sin necesidad de mezclar cdigo Java entre el cdigo visual que desarrollen (tan slo utilizando algunos tags, no muy diferentes de los usados en el cdigo HTML).

Figura 2.3 MVC o Modelo-Vista-Controlador.

L.I. Esteban Snchez Mendoza

Pgina 28

Programacin Web

Unidad II

2.2 Lenguajes de programacin del lado del cliente


Los programas del lado del cliente estn incluidos dentro de la pgina HTML, se descargan del servidor junto con este. Un lenguaje del lado cliente es totalmente independiente del servidor, lo cual permite que la pgina pueda ser albergada en cualquier sitio. Los programas se ejecutan dentro del mbito del browser. Tipos de lenguajes de programacin del lado del cliente: JavaScript Es un lenguaje de programacin que realiza acciones dentro del mbito de una pgina web. Su compatibilidad con la mayora de los navegadores modernos, lo posiciona como el lenguaje de programacin del lado del cliente ms utilizado. Con JavaScript podemos crear efectos especiales en las pginas y definir interaccin con el usuario. El navegador (browser) del cliente es el encargado de interpretar las instrucciones JavaScript y ejecutarlas para realizar estos efectos e interactividades, de modo que el mayor recurso, y tal vez el nico, con que cuenta este lenguaje es el propio navegador. Visual Basic Script Es un lenguaje de programacin de scripts del lado del cliente, slo compatible con Internet Explorer. Es por ello se usa poco. Est basado en Visual Basic de Microsoft. Tanto su sintaxis y modo de operacin 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.

L.I. Esteban Snchez Mendoza

Pgina 29

Programacin Web Applets de Java

Unidad II

Son programas hechos en Java, que se transfieren con las pginas web y que el navegador ejecuta en el espacio de la pgina. Los applets son ms difciles de programar que los scripts en JavaScript y requerirn conocimientos medios del lenguaje Java. La principal ventaja de utilizar applets consiste en que son independientes del navegador, del sistema operativo y multiplataforma.

Flash Es un programa multimedia de Adobe que se utiliza para crear presentaciones animadas. Se trata de una aplicacin del lado del cliente que es leda por los principales navegadores. Las animaciones se realizan a partir de vectores y de imgenes en base a pxeles (llamadas raster graphics) y pueden incluir audio y video. Este programa es uno de los ms utilizados para animar sitios Web y permitir la interactividad. Otros lenguajes del lado del cliente son: Navegadores para Web. HTML. Vbscript. XML.

2.3. Lenguajes de programacin del lado del servidor


Los lenguajes de lado servidor son aquellos lenguajes que son reconocidos, ejecutados e interpretados por el propio servidor y que se envan al cliente en un formato comprensible para l. Por otro lado, los lenguajes de lado cliente son aquellos que pueden ser directamente "digeridos" por el navegador y no necesitan un pre-tratamiento.

L.I. Esteban Snchez Mendoza

Pgina 30

Programacin Web

Unidad II

Se ejecutan en el servidor de Web y son dependientes de la plataforma del servidor.

La programacin del lado del servidor es una tecnologa que consiste en el procesamiento de una peticin de un usuario mediante la interpretacin de un script en el servidor web para generar pginas HTML dinmicamente como respuesta. Se usan para acceder a recursos del servidor, como bases de datos y generacin de contenido dinmico para las pginas.

L.I. Esteban Snchez Mendoza

Pgina 31

Programacin Web Por ejemplo, el mbito de ejecucin de una pgina ASP.NET.

Unidad II

Tipos de lenguajes del lado del cliente: 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.

L.I. Esteban Snchez Mendoza

Pgina 32

Programacin Web PERL

Unidad II

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 subprogramas escritos en otros lenguajes. Tambin desde otros lenguajes podremos ejecutar cdigo Perl. ASP 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 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 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. Otros lenguajes del lado del servidor: Ruby. Python. XML.

L.I. Esteban Snchez Mendoza

Pgina 33

Programacin Web

Unidad II

2.4 Ambientes para el desarrollo de aplicaciones Web


Es un programa compuesto por un conjunto de herramientas para un programador. Puede dedicarse en exclusiva a un slo lenguaje de programacin o bien, poder utilizarse para varios. Consiste en un editor de cdigo, un compilador, un depurador y un constructor de interfaz grfica. Su meta es proveer un marco de trabajo amigable para los programadores de algn lenguaje de programacin. Los IDE (ambientes integrados de desarrollo) para aplicaciones Web son muy numerosos. Considerar los que permitan trabajar con los diferentes lenguajes para Web. Algunos son especficos para lenguajes del lado del servidor. Por ejemplo, Visual Studio solo soporta ASP.NET del lado del servidor. Existen IDEs de buena cantidad, libres y gratuitos de buena calidad. Algunos ejemplos de IDE para Web: Microsoft Visual Studio. Microsoft Web Developer Express. Mono (para ASP.NET). NetBeans. Jbuilder. Eclipse.

2.5 Metodologa para el desarrollo de aplicaciones Web


Ciclo de vida clsico. Pressman, adopta esta metodologa para el desarrollo de Web, en lo que l llama la Ingeniera Web: En donde utiliza la siguiente metodologa: Formulacin. Planificacin. Anlisis (contenido, interaccin, funcional, configuracin). L.I. Esteban Snchez Mendoza Pgina 34

Programacin Web Diseo (arquitectnico, navegacin, interfaz, de base de datos). Implementacin. Pruebas.

Unidad II

UWE UML (UML-Based Web Engineering) es una metodologa de desarrollo de aplicaciones web, utilizada en la ingeniera web, prestando especial atencin en sistematizacin y personalizacin (sistemas adaptativos). El mtodo UWE UML consta de seis modelos: Modelo de casos de uso para capturar los requisitos del sistema. Modelo conceptual para el contenido (modelo del dominio). Modelo de usuario: modelo de navegacin que incluye modelos estticos y dinmicos. Modelo de estructura de presentacin, modelo de flujo de presentacin. Modelo abstracto de interfaz de usuario y modelo de ciclo de vida del objeto. Modelo de adaptacin. Tipos de metodologas:

EORM Es una Metodologa de Relacin entre Objeto (Enhanced Object Relationship Methodology), definida por un proceso iterativo que se concentra en el modelado orientado a objetos por la representacin de relaciones entre ellos (acoplamientos) como objetos, es por ello que fue una de las primeras propuestas para Web centrada en el paradigma de la orientacin a objetos.

L.I. Esteban Snchez Mendoza

Pgina 35

Programacin Web Esta metodologa tiene las siguientes ventajas:

Unidad II

Encajamiento de relaciones semnticas en construcciones extensibles, pudiendo participar en otras relaciones y ser parte de bibliotecas reutilizables. EORM distingue dos tipos de relaciones orientadas a objetos: Relaciones de generalizacin y relaciones definidas por el usuario. Mientras que los primeros se concentran como en la semntica asociada entre ellas, los segundos confan totalmente en la especificacin del usuario.

La semntica de vnculos bsicos de clases que se manejan, son las siguientes de manera resumida: SimpleLink: Es la raz vnculo bsica de clase que proporciona capacidad de interconexin, incluido funciones para la creacin, supresin y recorrido. NavigationalLink: Proporciona mecanismos para enlaces hipermedia que incluye el almacenamiento de creacin de tiempo e informacin histrica. Se hereda de simpleLink. NodeToNode: Es un vnculo que hereda de NavigationalLink y proporciona a un objeto Hipermedia vnculo de funcionalidad. SpanToNode: Se hereda de NavigationalLink. Vincula el contenido de un objeto a otro objeto. StructureLink: Se hereda de SimpleLink y la raz de los vnculos estructurales. Se inserta despus creacin en el contexto estructural. SetLink: Es una structureLink que proporciona acceso a un objeto en una desordenada coleccin de objetos. ListLink: Es un structureLink que proporciona acceso a un objeto en una coleccin ordenada de objetos.

L.I. Esteban Snchez Mendoza

Pgina 36

Programacin Web EORM consta de tres fases:

Unidad II

Fase de Anlisis: Se trata de orientar a objetos al sistema, sin considerar los aspectos hipermediales del mismo, obtenindose para ello un Modelo de Objetos con la misma notacin utilizada en OMT, que refleje la estructura de la informacin (mediante clases de objetos con atributos y relaciones entre las clases) y el comportamiento del sistema (a travs de los mtodos asociados a las clases de objetos). 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 (EORM), en el que se refleje tanto la estructura de la informacin (modelo abstracto hipermedial compuesto de nodos y enlaces) como las posibilidades de navegacin ofrecidas por el sistema sobre dicha estructura, para lo cual existir una librera de clases de enlaces, donde se especifican las posibles operaciones asociadas a cada enlace de un hiperdocumento, que sern de tipo crear, eliminar, atravesar, siguiente, previo etc., as como sus posibles atributos (fecha de creacin del enlace, estilo de presentacin en pantalla, restricciones de acceso, etc.). Fase de Construccin: Se transforman los esquemas en cdigo y son guardados en una Base de Datos Orientada a Objetos, al elaborar formularios de consulta de las clases con la ayuda de un editor grfico de interfaces. Se genera el cdigo fuente (por ejemplo C#) correspondiente a cada clase y se prepara la Interface Grfica de Usuario. OOHDM Es un Mtodo de Diseo de Desarrollo en Hipermedia Orientado a Objetos (ObjectOriented Hypermedia Design Method) y abarca las cuatro actividades: El 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.

L.I. Esteban Snchez Mendoza

Pgina 37

Programacin Web Consta de cuatro fases:

Unidad II

Fase Conceptual: durante esta actividad se construye un esquema conceptual representado por los objetos del dominio, las relaciones y colaboraciones existentes establecidas entre ellos. En las aplicaciones hipermedia convencionales, cuyos componentes no son modificados durante la ejecucin, se podra usar un modelo de datos semntico estructural (como el modelo de entidades y relaciones). De este modo, en los casos en que la informacin base pueda cambiar dinmicamente o se intenten ejecutar clculos complejos, se necesitar enriquecer el comportamiento del modelo de objetos En OOHDM, el esquema conceptual est construido por clases, relaciones y subsistemas. Las clases son descritas como en los modelos orientados a objetos tradicionales. Sin embargo, los atributos pueden ser de mltiples tipos para representar perspectivas diferentes de las mismas entidades del mundo real.

L.I. Esteban Snchez Mendoza

Pgina 38

Programacin Web

Unidad II

Fase Navegacional: se debe tener en mente que la generacin de aplicaciones Web fue pensada para realizar navegacin a travs del espacio de informacin, utilizando un simple modelo de datos de hipermedia. En OOHDM, la navegacin es considerada un paso crtico en el diseo aplicaciones. Un modelo navegacional es construido como una vista sobre un diseo conceptual, admitiendo la construccin de modelos diferentes de acuerdo con los distinto perfiles de usuarios. Cada modelo navegacional provee una vista subjetiva del diseo conceptual. El diseo de navegacin es expresado en dos esquemas: el esquema de clases navegacionales y el esquema de contextos navegacionales. En OOHDM existe un conjunto de tipos predefinidos de clases navegacionales: nodos, enlaces y estructuras de acceso. La semntica de los nodos y los enlaces son las tradicionales de las aplicaciones hipermedia, y las estructuras de acceso, tales como ndices o recorridos guiados, representan los posibles caminos de acceso a los nodos. La principal estructura primitiva del espacio navegacional es la nocin de contexto navegacional. Un contexto navegacional es un conjunto de nodos, enlaces, clases de contextos, y otros contextos navegacionales (contextos anidados). Pueden ser definidos por comprensin o extensin, o por enumeracin de sus miembros. Los contextos navegacionales juegan un rol similar a las colecciones y fueron inspirados sobre el concepto de contextos anidados. Organizan el espacio navegacional en conjuntos convenientes que pueden ser recorridos en un orden particular y que deberan ser definidos como caminos para ayudar al usuario a lograr la tarea deseada. Los nodos son enriquecidos con un conjunto de clases especiales que permiten observar y presentar sus atributos (incluidos las anclas), as como mtodos (comportamiento) cuando se navega en un particular contexto. Fase de Interfaz Abstracta: Las estructuras navegacionales son definidas y se deben especificar los aspectos de interfaz. Esto significa definir la forma en la cual los objetos navegacionales pueden aparecer, de cmo los objetos de interfaz activarn la navegacin y el resto de la funcionalidad de la aplicacin, qu transformaciones de la interfaz son pertinentes y cundo es necesario realizarlas. Una clara separacin entre diseo navegacional y diseo de interfaz abstracta permite construir diferentes interfaces para el mismo modelo navegacional, dejando un alto grado de independencia de la tecnologa de interfaz de usuario.

L.I. Esteban Snchez Mendoza

Pgina 39

Programacin Web

Unidad II

El aspecto de la interfaz de usuario de aplicaciones interactivas (en particular las aplicaciones Web) es un punto crtico en el desarrollo que las modernas metodologas tienden a descuidar. En OOHDM se utiliza el diseo de interfaz abstracta para describir la interfaz del usuario de la aplicacin de hipermedia. El modelo de interfaz ADVs (Vista de Datos Abstracta) especifica la organizacin y comportamiento de la interfaz, pero la apariencia fsica real o de los atributos, y la disposicin de las propiedades de las ADVs en la pantalla real son hechas en la fase de implementacin. Fase Implementacin: Se tendr en cuenta que el diseador debe ya implementar el diseo. Hasta ahora, todos los modelos fueron construidos en forma independiente de la plataforma de implementacin; en esta fase es tenido en cuenta el entorno particular en el cual se va a correr la aplicacin. Al llegar a esta fase, el primer paso que debe realizar el diseador es definir los tems de informacin que son parte del dominio del problema. Debe identificar tambin, cmo son organizados los tems de acuerdo con el perfil del usuario y su tarea; decidir qu interfaz debera ver y cmo debera comportarse. A fin de implementar todo en un entorno Web, el diseador debe decidir adems qu informacin debe ser almacenada. Construir la interfaz de una aplicacin Web es una tarea compleja; no slo se necesita especificar cules son los objetos de la interfaz que deberan ser implementados, sino tambin la manera en la cual interactuarn con el resto de la aplicacin.

OOHDM propone un conjunto de tareas que en principio pueden involucrar mayores costos de diseo, pero que a mediano y largo plazo reducen notablemente los tiempos de desarrollo al tener como objetivo principal la reusabilidad de diseo, y as simplificar la evolucin y el mantenimiento. SOHDM Es un Mtodo que Desarrolla Diseo en panoramas (scenario) Orientada a Objetos en Hipermedia (Scenario - based Object-oriented Hypermedia Design Methodology). Presenta la necesidad de disponer de un proceso que permita capturar las necesidades del sistema. Para ello, propone el uso de escenarios.

L.I. Esteban Snchez Mendoza

Pgina 40

Programacin Web Consta de seis fases:

Unidad II

Fase de Anlisis: Se realiza un estudio de las necesidades de la aplicacin, del entorno de trabajo y de los actores. La finalidad principal de esta fase es conseguir los escenarios que representen las actividades que se pueden llevar a cabo en el sistema. Fase de Modelado de Objetos: Se desarrolla un diagrama de clases que representa la estructura conceptual del sistema. Fase de Diseo de Vistas: Se reorganizan los objetos en unidades navegacionales, que representan una vista de los objetos del sistema. Fase de Diseo Navegacional: Se enriquecen dichas vistas definiendo los enlaces e hiperenlaces que existen en el sistema. Fase de Diseo de la Implementacin: Se disean las pginas, la interfaz y la base de datos del sistema. Fase de Construccin: Se realiza la construccin de la base de datos del sistema. La cual que se implementar a la aplicacin. En conclusin la metodologa SOHDM es una propuesta nueva que cubre en mayor parte todas las fases del proceso de desarrollo, aunque no toma en cuenta la implantacin y las pruebas, proponindonos un proceso cclico de tal forma que al realizar una fase se puede regresar a alguna de las anteriores para refinarla y adaptarla mejor. 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.

L.I. Esteban Snchez Mendoza

Pgina 41

Programacin Web Consta de cuatro fases:

Unidad II

Fase de Modelo de Usuario: Se intenta detectar los perfiles de usuarios para los cuales se construye la aplicacin. Durante esta fase es necesario determinar: Quin es el pblico objetivo? Cmo ser la visin de su sitio Web? Cules son los objetivos de marketing de la empresa? Cules son los objetivos de su sitio web? Qu mensaje tiene su compaa quiere transmitir? Cul es el campo del negocio? Cules son los estndares de la industria? Una vez que tenemos una comprensin de su negocio y sus objetivos de la empresa, que har recomendaciones a la mejor alcanzar sus metas. Nuestro proceso de planificacin estratgica se crear un plan inicial de su sitio web. Se divide en dos sub-fases siguientes:

Clasificacin de usuarios: Se deben identificar y clasificar a los usuarios que van a hacer uso del sistema. Para ello, WSDM propone el estudio del entorno de la organizacin donde se vaya a implantar el sistema y los procesos que se vayan a generar, describiendo las relaciones entre usuarios y actividades que realizan estos usuarios.

Descripcin de los grupos de usuarios: Se describen con ms detalles los grupos de usuarios detectados en la etapa anterior. Para ello, se debe elaborar un diccionario de datos, en principio con formato libre, en el que indican los requisitos de almacenamiento de informacin, requisitos funcionales y de seguridad para cada grupo de usuarios. Fase de Diseo Conceptual: Se desarrolla el modelado conceptual no tiene el

mismo significado que en OOHDM. Durante el modelado conceptual se realizan dos tareas a la vez: el modelado de objetos, que es lo que en OOHDM se llama modelo conceptual y el diseo de la navegacin, que coincide con la idea de su diseo navegacional, Este tipo de diseo de navegacin en aplicaciones Web tiene una estructura muy jerrquica.

L.I. Esteban Snchez Mendoza

Pgina 42

Programacin Web

Unidad II

Pocas recomendaciones se dan en esta etapa, tales como la utilizacin de pginas de ndice, derecho de informacin dividida en diversos tamaos, el uso de contexto y de la informacin y el uso de seales de navegacin. Este modelo distingue tres tipos de componentes de navegacin, informacin y externos. Cada una consta de tres capas: contexto, navegacin y capas de informacin. En WSDM puede existir ms de un modelo de navegacin, dependiendo de los roles de usuario detectados durante la primera fase. Fase de Diseo de Implementacin: Se modela la interfaz para cada rol de usuario, Ahora que se tiene una versin definitiva del plan se pueda comenzar con la construccin del sitio web. RNA Es un mtodo de Anlisis de Navegacin Relacional (Relationship Navigational Analysis), 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. La propuesta de RNA es quizs una de las que ms ha resaltado la necesidad de trabajar con la especificacin de requisitos, incluyendo tareas como el anlisis del entorno y de los elementos de inters. Adems, resulta interesante pues plantea la necesidad de analizar los requisitos conceptuales de manera independiente a los navegacionales. Consta de cinco fases: Fase de Definicin de Elementos: Aqu prosiguen los elementos de 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. Fase de Anlisis del Conocimiento: Se desarrolla 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 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.

L.I. Esteban Snchez Mendoza

Pgina 43

Programacin Web

Unidad II

Fase de Implementacin del Anlisis: 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. Aspecto de seguridad


Las aplicaciones Web estn ms expuestas a ataques. Se pueden tener ataques en tres niveles: A la computadora del usuario. Al servidor. A la informacin en trnsito. La seguridad en Web tiene 3 etapas primarias: Seguridad de la computadora del usuario: Los usuarios deben contar con navegadores y plataformas seguras, libres de virus y vulnerabilidades. Tambin debe garantizarse la privacidad de los datos del usuario. Seguridad del servidor Web y de los datos almacenados ah Se debe garantizar la operacin continua del servidor, que los datos no sean modificados sin autorizacin (integridad) y que la informacin slo sea distribuida a las personas autorizadas (control de acceso). Seguridad de la informacin que viaja entre el servidor Web y el usuario. Garantizar que la informacin en trnsito no sea leda (confidencialidad), modificada o destruida por terceros. Tambin es importante asegurar que el enlace entre cliente y servidor no pueda interrumpirse fcilmente (disponibilidad).

L.I. Esteban Snchez Mendoza

Pgina 44

Programacin Web

Unidad II

Hay 3 tipos de recomendaciones que se deben tener en cuenta, los cuales son: Recomendaciones: Asegurar el servidor Se deben considerar los siguientes puntos: Asegurar el servidor en una forma fundamental: el sistema operativo, ya sea por medio de actualizaciones (parches) y habilitando los mecanismos propios de la plataforma. Garantizar la seguridad del servidor Web propiamente (IIS, Apache, etc.) Auditar las aplicaciones que interactan en las bibliotecas). Recomendaciones: Asegurar la informacin en trnsito. Esto se puede lograr por diversos medios: Asegurando la red fsicamente (switches en lugar de hubs). Esconder la informacin (estenografa). Cifrar la informacin (criptografa) por medio de algoritmos diversos (SSL, VPNs). Recomendaciones: Asegurar el equipo del usuario Vulnerar el equipo del usuario quizs no tenga el impacto de vulnerar el servidor, sin embargo es un problema ms difcil de erradicar (1 servidor, 5000 clientes): Aplicar actualizaciones (parches) al sistema Operativo. Uso de antivirus, firewalls personales. Educacin de los usuarios. dos capas anteriores (mdulos,

L.I. Esteban Snchez Mendoza

Pgina 45

Unidad III. Programacin del lado del Servidor

Objetivo:

Desarrollar aplicaciones Web del lado del servidor con acceso a base de datos.

Programacin Web

Unidad III

PROGRAMACIN DEL LADO DEL SERVIDOR.


3.1 Procesamiento del lado del servidor.
La funcionalidad de lado del Servidor se refiere a la habilidad de los servidores de correr programas que interactan con las pginas de los sitios web. Estos pequeos programas son llamados scripts y residen en los servidores web y te permitir tener interactividad en tus sitios web. Por ejemplo, si en tu sitio web necesitas que todos los usuarios entren con contrasea, la base de datos que contiene los nombres de usuario y contraseas para tu sitio web, y el programa que ofrece la autenticacin de acceso se basar en el servidor web y no se encuentra en la pgina web. Funciona del lado del servidor, es decir que con cualquier navegador de Internet podremos acceder a toda la potencia de PHP, pues ste arroja el resultado al cliente sin necesidad de que ste interprete algo ms que simple y comn HTML. Cdigo abierto (Open source), libertad de distribucin y permiso para uso comercial sin costo, aplastando de esta manera al ASP de Microsoft, de licenciamiento comercial. Adems, (esto podra generarme una pelea con habbi ;-)) apostara por la velocidad de PHP por sobre la de ASP para los mismos procesos. Genera pginas dinmicas. Esto significa que cada pgina solicitada al servidor es procesada en el momento como un requerimiento individual, y actualizado al milisiegundo. Inutil para pginas estticas, genial para pginas en donde los datos se actualizan constantemente (que tengan acceso a base de datos o ejecuten procesos de clculo). Simplicidad de programacin. Un lenguaje de script realmente cmodo de usar por su sencillez y claridad. Cuando nosotros seleccionamos un enlace hipertexto, en realidad lo que pasa es que establecemos una peticin de un archivo HTML residente en el servidor (una computadora que se encuentra continuamente conectado a la red) el cual es enviado e interpretado por nuestro navegador (el cliente).

L.I. Esteban Snchez Mendoza

Pgina 47

Programacin Web

Unidad III

As pues, podemos hablar de lenguajes de lado servidor que son aquellos lenguajes que son reconocidos, ejecutados e interpretados por el propio servidor y que se envan al cliente en un formato comprensible para l, por ejemplo: ASP, PHP, JSP. Por otro lado, los lenguajes de lado cliente (entre los cuales no slo se encuentra el HTML sino tambin el Java y el JavaScript los cuales son simplemente incluidos en el cdigo HTML) son aquellos que pueden ser directamente "digeridos" por el navegador y no necesitan un pretratamiento.

L.I. Esteban Snchez Mendoza

Pgina 48

Programacin Web

Unidad III

Lenguajes del lado del servidor


Lenguajes 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 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 subprogramas escritos en otros lenguajes. Tambin desde otros lenguajes podremos ejecutar cdigo Perl.

L.I. Esteban Snchez Mendoza

Pgina 49

Programacin Web

Unidad III

ASP

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

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

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.

L.I. Esteban Snchez Mendoza

Pgina 50

Programacin Web

Unidad III

3.2 Conceptos bsicos de la herramienta de desarrollo.


Una herramienta es un objeto elaborado a fin de facilitar la realizacin de una tarea mecnica que requiere de una aplicacin correcta de energa. El trmino herramienta, en sentido estricto, se emplea para referirse a utensilios resistentes, tiles para realizar trabajos mecnicos que requieren la aplicacin de una cierta fuerza fsica. Cada herramienta tiene un fin especfico y debera ser usado solo con un fin determinado, Sin embargo esto no se cumple en la mayora de las tareas del quehacer humano y mucho menos en las aplicaciones web. Cuando pensemos en las mejores herramientas para el desarrollo web es necesario pensar en donde estar alojado nuestro sitio (hosting). El hosting o alojamiento web es un sistema esencial para el funcionamiento de los sitios en Internet y es el lugar donde fsicamente reside nuestra informacin. Si tenemos recursos ilimitados para tener nuestro propio sitio entonces tendriamos que hacer una gran investigacin para seleccionar las herramientas ms sofisticadas. Sin embargo para la mayora de las aplicaciones debemos pagar porque nuestra informacin sea colocada en cierto servidor. El lugar donde fsicamente se almacenara nuestra informacin determina los lenguajes soportados (cliente, servidor), el gestor de la base de datos y las prestaciones que podremos ofrecer a nuestros futuros usuarios. Sin el afan de romperse las camisas discutiendo este punto, las herramientas que usaremos para desarrollar el sitio, dependen de las preferencias, del acceso a las herramientas ("licencias") y la disponibilidad. En resumen cada quien habla como le va en la feria. Si somos expertos en un X lenguaje y el sistema Operativo de nuestro host no lo soporta, podremos tener las herramientas ms sofisticadas pero no servirn de nada.

L.I. Esteban Snchez Mendoza

Pgina 51

Programacin Web

Unidad III

Las fases de un desarrollo web, as como los lenguajes de programacin usados, son muy extensas y variadas, y por ello necesitamos herramientas especficas para cada una de ellas. Conoceremos a continuacin las principales herramientas existentes para poder desarrollar fcilmente un proyecto web. En el desarrollo web tenemos unas herramientas para el diseo, otras para la maquetacin, otras para la programacin, y para la depuracin. Todas las herramientas que usemos son muy importantes, desde el sistema operativo hasta el comando ms insignificante, y por ello debemos elegir la ms adecuada a nuestras necesidades y capacidades.

Sistema Operativo

Para desarrollar una web, lo primero que necesitamos es un Sistema Operativo, como es lgico, y su eleccin no es tan trivial. Hay que tener en cuenta las aplicaciones de las que dispone el Sistema Operativo y sus costos. Si pensamos desarrollar en .NET este solo es soportado por windows y los costos de hospedaje son mas caros que los que soportan Linux.

L.I. Esteban Snchez Mendoza

Pgina 52

Programacin Web Fases de desarrollo de una web

Unidad III

Para elegir las herramientas a utilizar, antes debemos identificar las fases del proceso que forman el ciclo de vida de un desarrollo web.

Diseo: consiste en crear esbozos de la web final mediante una herramienta grfica, como Photoshop Maquetacin HTML/CSS: consiste en convertir los esbozos creados en la fase anterior en plantillas HTML, su respectiva hoja de estilos, y las imgenes usadas. Es posible saltarse la fase anterior para comenzar directamente con esta fase, dependiendo de si dominamos herramientas como Photoshop o no.

Programacin cliente: consiste bsicamente en Javascript. Existen muchas librerias de distribucin libre como JQUERY que nos aportan verdaderas joyas para el desarrollo.

Programacin servidor: en esta fase, que se desarrolla junto con la anterior, crearemos la aplicacin web en un lenguaje de servidor, como puede ser PHP, ASP .NET, Python, Perl, Java, etc.

Depuracin: esta fase enlaza la anterior con la siguiente, y es donde haremos las pruebas unitarias, aserciones, trazas, etc. Pruebas en local: en nuestro servidor local haremos todas las pruebas posibles. Por ejemplo usando wampServer

Subir archivos al hosting: Dependiendo del hosting, podremos usar FTP, SSH, aconsejo usar cuteFTP es una herramienta confiable y versatil. Pruebas en hosting: realizaremos las ltimas pruebas en el servidor del hosting para comprobar que el cambio de servidor no ha afectado a nada. Para evitar problemas, nuestro servidor local debe tener exactamente la misma configuracin que el servidor del hosting. Recuerde probar que sus cdigos sean compatibles al menos con Firefox, Safari e Internet explorer

L.I. Esteban Snchez Mendoza

Pgina 53

Programacin Web

Unidad III

En general podemos usar comercialmente la suite de Adobe que incluye a Dreamwever y sus herramientas de edicin un servidor FTP, adems de validar nuestros cdigos javascript y css. Con el inconveniente de ser una herramienta muy cara. En contra parte, va versin Joomla! edition de kademar Linux es la adaptacin de la versin de Escritorio DVD (Leo) 4.9.1 con la inclusin de los programas necesarios para trabajar con el gestor de contenidos Joomla!. En esta edicin se incluye instalado el gestor de contenidos Joomla, junto con los programas necesarios para su funcionamiento totalmente instalados y configurados. Es posible aprender a usar Joomla! sin necesidad de buscar un servidor de hosting para crear pginas web. Est funcionando en local y no se tiene que pelear con la instalacin de todo lo necesario: base de datos MySql, phpmyadmin, apache.... etc. Todo est ya instalado y configurado, plenamente funcional para usarlo inmediatamente.

3.3 Operadores.
programacin. Con ellos podemos asignar, unir, cambiar o comparar valores de datos, cambiar el flujo del programa, etc. Los operadores son smbolos que representan operaciones sobre un valor. Vamos a ver a continuacin los operadores admitidos por PHP agrupados segn su utilidad. Operador de asignacin El smbolo = permite asignar valores a variables: <?php $ciudad = 'Veracruz'; echo $ciudad.' '; $mi_numero = 633; echo $mi_numero; ?> Los operadores son un componente esencial de cualquier lenguaje de

L.I. Esteban Snchez Mendoza

Pgina 54

Programacin Web

Unidad III

El operador .= asigna valores al contenido de una variable, es equivalente a $var = $var + 'nuevo valor'; <?php $numeros = "uno, dos, tres"; $numeros .= ", cuatro, cinco, seis"; // imprime "uno, dos, tres, cuatro, cinco, seis" echo $numeros; ?> Operador de concatenacin Usando el smbolo. concatenamos cadenas <?php $nombre = "Jorge"; $apellido = "Perez"; echo "Nombre: ".$nombre." ".$apellido; //Concatenacin ?> Operadores aritmticos Los operadores aritmticos de PHP son similares a los de C, Java y Javascript. Los smbolos + - / * realizan operaciones de aritmtica bsica, el smbolo % obtiene el resto de una divisin (mdulo). Por ejemplo sea $var1 = 10 y $var2 = 5; Operador Negacin Suma Resta Multiplicacin Divisin Mdulo Ejemplo -$var1 $var1 + $var2 $var1 - $var2 $var1 * $var2 $var1 / $var2 $var1 % $var2 Ejemplo Resultado -10 15 5 50 2 0

L.I. Esteban Snchez Mendoza

Pgina 55

Programacin Web

Unidad III

Operadores abreviados o combinados Una forma habitual de modificar el contenido de las variables es mediante los operadores combinados. La siguiente tabla resume los operadores de asignacin combinados Operador += -= *= /= %= .= Ejemplo $variable += 10 $variable -= 10 $variable *= 10 $variable /= 10 $variable %= 10 $variable .= "concatenar" Ejemplo Descripcin $variable = $variable + 10; $variable = $variable - 10; $variable = $variable * 10; $variable = $variable / 10; $variable = $variable % 10; Concatena las cadenas $variable y "concatenar"

L.I. Esteban Snchez Mendoza

Pgina 56

Programacin Web

Unidad III

Operadores de incremento - decremento PHP ofrece soporte de operadores de pre- y post-(incremento o decremento), estilo-C. Los smbolos ++ y -- aplicados a una variable, permiten incrementar o decrecer su valor. Su efecto es distinto segn se empleen precediendo o siguiendo el nombre de la variable.

Operador Pre-incremento Post-incremento Pre-decremento Post-decremento Ejemplo ++$a $a++ --$a $a--

Ejemplo

Efecto Incrementa $a en uno y despus devuelve a. Devuelve $a y despus incrementa $a en uno. Decrece el valor de $a en uno y despus devuelve $a. Devuelve $a y despus decrece su valor en uno.

L.I. Esteban Snchez Mendoza

Pgina 57

Programacin Web Nota:

Unidad III Los operadores de incremento/decremento no afectan a los valores

booleanos. Decrementar valores NULL tampoco tiene efecto, aunque incrementarlos resulta en 1. Operadores de Comparacin. Los operadores de comparacin, como su nombre indica, permiten comparar dos valores. Igualdad Identidad Operador Ejemplo $a == $b $a === $b $a != $b $a !== $b $a < $b $a <= $b $a > $b $a >= $b $a es igual a $b. $a es igual a $b y adems son del mismo tipo $a no es igual a $b. Los operandos no son iguales o del mismo tipo $a es estrictamente menor que $b. $a es menor o igual que $b. $a es estrictamente mayor que $b. $a es mayor o igual que $b. Cierto si:

Desigualdad Menor que Menor o igual que Mayor que Mayor o igual que Ejemplo

funciona como en C y otros muchos lenguajes:

Otro operador condicional es el operador "?:" (o ternario), que

(expr1) ? (expr2) : (expr3); La expresin toma el valor expr2 si expr1 se evala a cierto, y expr3 si expr1 se evala a falso.

L.I. Esteban Snchez Mendoza

Pgina 58

Programacin Web Operadores Lgicos

Unidad III

expresiones que devuelven valores lgicos. Con ellos es posible combinar condiciones y evaluarlas en una sola expresin. La sintaxis de estos operadores es la siguiente: && and || or xor ! Ejemplo Operador Ejemplo $a && $b $a and $b $a || $b $a or $b $a xor $b !$a Cierto si: Ambos son ciertos Si uno o ambos es cierto Solo si uno de los dos es cierto. Si $a es Falsa

Los operadores lgicos o booleanos se utilizan conjuntamente con

Operador de ejecucin PHP soporta un operador de ejecucin: el apstrofe invertido (``). PHP intentar ejecutar la instruccin contenida dentro de los apstrofes invertidos como si fuera un comando del shell; y su salida devuelta como el valor de esta expresin (i.e., no tiene por qu ser simplemente volcada como salida; puede asignarse a una variable).

L.I. Esteban Snchez Mendoza

Pgina 59

Programacin Web Ejemplo:

Unidad III

<?php $entorno = `set`; echo "<pre>$entorno</pre>"; $entorno = `dir c:`; echo "<pre>$entorno</pre>"; ?>

L.I. Esteban Snchez Mendoza

Pgina 60

Programacin Web

Unidad III

Es equivalente a la funcin shell_exec y por defecto est inhabilitado su uso si php esta configurado para ejecutarse en safe_mode. Precedencia de operadores Cuando una expresin est formada por ms de un operador del mismo tipo, PHP la evala de izquierda a derecha, pero cuando creamos expresiones que utilizan ms de un operador diferente, no siempre evala estas expresiones de la misma forma. La precedencia de operadores especfica cmo se agrupan las expresiones para ser evaluadas. La precedencia relativa de los operadores se puede modificar mediante parntesis en las expresiones que se desea evaluar a criterio del programador. A continuacin se presenta en la tabla la precedencia de los operadores de menor a mayor. Asociatividad izquierda izquierda izquierda izquierda derecha izquierda izquierda izquierda izquierda izquierda izquierda izquierda no asociativo no asociativo izquierda izquierda , or xor and print = += -= *= /= .= %= &= |= ^= ~= <<= >>= ?: || && | ^ & == != === < <= > >= << >> +-. Pgina 61 Operadores

L.I. Esteban Snchez Mendoza

Programacin Web Asociatividad izquierda derecha derecha no asociativo */% ! ~ ++ -- (int) (double) (string) (array) (object) @ [ new Operadores

Unidad III

3.4 Sentencias
Las sentencias de control permiten ejecutar bloque de cdigos dependiendo de condiciones. La evaluacin de dichas condiciones retorna uno de dos valores verdadero o falso. Para PHP el 0 es equivalente a falso y cualquier otro nmero es verdadero. if...else La sentencia if...else permite ejecutar un bloque de instrucciones si la condicin es verdadera y otro bloque de instrucciones si sta es falsa. Es importante tener en cuenta que la condicin que evaluemos ha de estar encerrada entre parntesis (esto es aplicable a todas las sentencias de control).

if (condicin) { //Se ejecuta si la condicin es VERDADERA } else { //Se ejecuta si la condicin es FALSA } Ejemplo: Determinar si n es par o impar <?php $enviar = $_POST['enviar']; $n = $_POST['n']; if( isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST' ){ if( isset($n) ){ if( ( $n % 2 ) == 0 ) { L.I. Esteban Snchez Mendoza Pgina 62

Programacin Web $cadena = "$n es par"; } else $cadena = "$n es impar"; echo "<p class='centrado'>".$cadena."</p><br />";

Unidad III

} } else { echo "<p class='centrado'>Falta informacin as no puedes ejecutar</p>"; } ?> Ejemplo: Construir un programa que capture un deporte y despliegue dos implementos deportivos apropiados.

isset es una funcin PHP que regresa verdadero si una variable tomo valor $_SERVER['REQUEST_METHOD'] mtodo de peticin se us para acceder a la pgina unset destruye una variable especificada

<?php $enviar = $_POST['enviar']; if( isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST' ) { echo "<table class='tablaSinBorde'>"; echo "<tr><td colspan='2'>Implementos deportivos de ".$_POST['deporte']."</td></tr>"; echo "<tr><td><img src='deportivos/".$_POST['deporte']."01.jpg' /></td>"; echo "<td><img src='deportivos/".$_POST['deporte']."02.jpg' /></td>"; echo "</tr></table>"; unset($enviar); unset($_POST['deporte']); } else { echo "<p class='centrado'>Falta informacin as no puedes ejecutar</p>"; } ?> Existe una forma sencilla de usar la sentencia if cuando no tenemos que usar el else y solo tenenemos que ejecutar una lnea de cdigo. $a = 6; if ($a > 4) echo "$a es mayor que 4"; if...elseif...else

L.I. Esteban Snchez Mendoza

Pgina 63

Programacin Web

Unidad III

La sentencia if...elseif...else permite ejecutar varias condiciones en cascada. Para este caso veremos un ejemplo, en el que utilizaremos los operadores lgicos.

La lnea 3 checa que el botn enviar sea pulsado y el mtodo de envio se POST. La lnea 4 checa que nombre tenga valor distinto a nulo o espacios en blanco. En la lnea 7 el contenido de la variable nombre se convierte a maysculas

<?php $enviar = $_POST['enviar']; if( isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST') { if (empty($nombre) or !isset($nombre) or trim($nombre) === '' ) { echo "<p class='centrado'>T no tienes nombre</p>"; } else { $nombre = mb_strtoupper($nombre); if ($nombre == 'ZAMIRA'){ echo "<br /><p align='center'>Hola $nombre eres "; echo "una Princesa preciosa</p>"; } else { echo "<br /><p align='center'>Tu nombre es $nombre </p>"; } } unset($enviar); unset($nombre); } else { echo "<p class='centrado'>Falta informacin as "; echo "no puedes ejecutar</p>"; } ?> Ejemplo: Clculo del rea y permetro de un tringulo dados sus lados, mediante la formula de Hern. Note que si el radical de rea es negativo, los lados proporcionados no forman un tringulo

<?php $a = $_POST['a']; $b = $_POST['b']; $c = $_POST['c']; L.I. Esteban Snchez Mendoza Pgina 64

Programacin Web $datos = empty($a) or empty($b) or empty($c); $enviar = $_POST['enviar']; if( !$datos && isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST' ) { $perimetro = $a + $b + $c; $p = $perimetro/2; //semiperimetro $radical = $p*($p - $a) * ($p - $b) * ($p - $c); if($radical < 0 ) { $resultado = 'No es un tringulo'."<br />"; } else { $resultado = "<strong>rea = </strong>".sqrt($radical)."<br />"; $resultado .= "<strong>Permetro </strong>= ".$perimetro."<br />"; } echo "<p class='centrado'>".$resultado."</p>"; } else { echo "<p class='centrado'>Falta informacin as no puedes ejecutar</p>"; } ?> switch...case...default

Unidad III

Una alternativa a if...elseif...else, es la sentencia switch, la cual evala y compara cada expresin de la sentencia case con la expresin que evaluamos, si llegamos al final de la lista de case y no encontramos condicin verdadera, ejecuta el cdigo de bloque que haya en la sentencia default. Si encontramos una condicin verdadera debemos ejecutar un break para que la sentencia switch no siga buscando en la lista de case.

Ejemplo: El siguiente cdigo imprime el da de la semana actual. <?php function diaSemana(){ $diaSemana = date('D'); $semanaArray = array( 'Mon' => 'Lunes', 'Tue' => 'Martes', 'Wed' => 'Miercoles', 'Thu' => 'Jueves', 'Fri' => 'Viernes', L.I. Esteban Snchez Mendoza Pgina 65

Programacin Web 'Sat' => 'Sbado', 'Sun' => 'Domingo',

Unidad III

); return $semanaArray[$diaSemana]; } //diaSemana

$dia = diaSemana(); switch ($dia) { case 'Lunes': echo 'Hoy es Lunes'; break; case 'Martes': echo 'Hoy es Martes'; break; case 'Miercoles': echo 'Hoy es Miercoles'; break; case 'Jueves': echo 'Hoy es Jueves'; break; case 'Viernes': echo 'Hoy es Viernes'; break; case 'Sbado': echo 'Hoy es Sbado'; break; case 'Domingo': echo 'Hoy es Domingo'; break; default: echo 'Cadena no valida'; } ?> A continuacin se presenta un ejemplo donde no se evala una variable. Lo que se efecta es una evaluacin de expresiones. <?php $enviar = $_POST['enviar']; if( isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST') { $n = $_POST['n']; switch (true) { case ($n < 0) : $cadena = "$n < 0"; break; case ($n >= 0 && $n <= 3) : $cadena = "0 <= $n <= 3"; break; case ($n >= 4 && $n <= 12) : $cadena = "4 <= $n <= 12"; break; default: $cadena = "$n > 13"; } echo "<p class='centrado'>$cadena </p>"; unset($enviar); unset($n); } else { echo "Falta informacin as no puedes ejecutar"; } ?>

L.I. Esteban Snchez Mendoza

Pgina 66

Programacin Web Estructuras de control repetitivas/interactivas

Unidad III

A menudo es necesario ejecutar una instruccin o un bloque de instrucciones ms de una vez

Ejemplo:

for El bucle for resulta muy til cuando debemos ejecutar un bloque de cdigo a condicin de que una variable se encuentre entre un valor mnimo y otro mximo. El bucle for se puede romper mediante la sentencia break. Ejemplo: <?php for ($num = 1; $num <= 5; $num++){ echo $num."<br />"; if ($num == 3){ echo "Aqu nos salimos \n"; break; } } ?>

L.I. Esteban Snchez Mendoza

Pgina 67

Programacin Web

Unidad III

Ejemplo: Calcular una tabla multiplicar. La seleccin de la tabla se hace desde un formulario. <?php $enviar = $_POST['enviar']; if( isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST') { $tabla = $_POST['tabla']; echo "<table class='zebra'>"; $renglon = ""; for($i = 1; $i <= 10; $i++) { if($i % 2 == 0) { $renglon .= "<tr class='odd'>"; } else { $renglon .= "<tr>"; } $r = $tabla*$i; $renglon .= "<td>$tabla</td><td>*</td><td>$i"; $renglon .= "</td><td>=</td><td>$r</td>"; } echo $renglon."</table>"; unset($enviar); unset($renglon); } else { echo "Falta informacin as no puedes ejecutar"; } ?> while La sentencia while ejecuta un bloque de cdigo mientras se cumpla una determinada condicin. Podemos romper un bucle while utilizando la sentencia break. El siguiente cdigo dado por la formula abajo mencionada, calcula el factorial de n. El valor de n debe ser menor o igual a 69 por el tipo de variables que maneja PHP.

L.I. Esteban Snchez Mendoza

Pgina 68

Programacin Web

Unidad III

<?php $html = ""; $enviar = $_POST['enviar']; if( isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST') { $n = $_POST['n']; if($n >= 0 && $n <= 1) { $factorial = 1; } elseif( $n >= 2 and $n <= 69) { $factorial = 1; $i = 2; while ( $i <= $n ) $factorial *= $i++; } else $factorial = "indefinido"; $html = "<p align='center'>El factorial de $n es "; $html .= number_format($factorial, 0, '.',',')."</p><br />"; echo $html; unset($n); unset($factorial); } else { echo "<p>Falta informacin as no puedes ejecutar</p>"; } ?> El cdigo factorial se puede optimizar y calcularlo para cualquier valor positivo mediante otros mecanismos. do..while Esta sentencia es similar a while, salvo que con esta sentencia primero ejecutamos el bloque de cdigo y despus se evala la condicin, por lo que el bloque de cdigo se ejecuta siempre al menos una vez.

Ejemplo: Calcularemos el factorial de n con la sentencia do while <?php $enviar = $_POST['enviar']; if( isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST') { $n = $_POST['n']; if($n == 0 and $n == 1) { $factorial = 1; } elseif( $n < 0 or $n >69) { L.I. Esteban Snchez Mendoza Pgina 69

Programacin Web $factorial = 'indefenido'; } else { $i = 2; $factorial = 1; do { $factorial *= $i++; } while ($i <= $n); } $html = "<p align='center'>El factorial de $n es "; $html .= number_format($factorial, 0, '.',',')."</p><br />"; echo $html; unset($n); unset($factorial); } else { echo "Falta informacin as no puedes ejecutar"; } ?>

Unidad III

El usar while, do while o for es principalmente cuestin de preferencia personal.

foreach El bucle foreach nos permite iterar en cada elemento de un vector, su sintaxis es sencilla. Consiste en indentificar el ndice de la matriz, mediante la expresion as y seguidamente la variable que identificar el valor del elemento: Por ejemplo: La tabla general de la Jornada 17 del Torneo Bicentenario 2010 FEMEXFUT. <?php echo "<h4 align = 'center'>Torneo Bicentenario 2010. "; echo "Jornada 17</h4>"; $equipo['Chivas'] = 32; $equipo['Monterrey'] = 36; $equipo['Santos'] = 28; $equipo['Pumas'] = 28; $equipo['Morelia'] = 25; $equipo['Cruz Azul'] = 25; $equipo['Amrica'] = 25; $equipo['Gallos Blancos'] = 21; $equipo['Toluca'] = 30; $equipo['Pachuca'] = 25; $equipo['Atlas'] = 24; $equipo['Estudiantes'] = 19; $equipo['Atlante'] = 16; $equipo['Jaguares'] = 19; $equipo['Puebla'] = 19; $equipo['San Luis'] = 14; $equipo['Tigres'] = 19; $equipo['Indios'] = 15; arsort($equipo); L.I. Esteban Snchez Mendoza Pgina 70

Programacin Web echo "<table class = 'zebra'>"; echo "<thead><tr><th>Equipo</th><th>Puntos</th></tr></thead>"; $i = 1; foreach( $equipo as $key => $puntos) { if ($i == 2) { echo "<tr class='odd'>"; $i = 1; } else { echo "<tr>"; $i = 2; } echo "<td>".$key."</td><td align='right'>".$puntos."</td>"; echo "</tr>"; } echo "</table>"; ?>

Unidad III

3.5 Arreglos.
Una arreglo (array) es una estructura de datos que contienen una coleccin de datos del mismo tipo. Los array se utilizan como contenedores para almacenar datos relacionados ( en vez de declarar variables por separado para cada uno de los elementos del array).

Los elementos del array se acceden a travs de la posicin que ocupan dentro del conjunto de elementos del arreglo. El primer elemento es la posicin cero.

El tamao del array se establece cuando creamos el arreglo, pero este puede crecer posteriormente en forma ilimitada (- Hasta agotar la RAM -).

Los elementos del arreglo pueden tener diferentes tipos de datos. Pgina 71

L.I. Esteban Snchez Mendoza

Programacin Web

Unidad III

Denominamos vector a los array unidimensionales y matrices a los array bidimensionales. Si bien es posible definir matrices de ms de dos dimensiones despus de casi tres decadas programando jams necesite una. Los array se clasifican segn su naturaleza en indexadas o asociativas. Array indexados Son aquellos en las que el ndice es un valor numrico. $estaciones = array ("primavera", "verano", otoo", "invierno"); $sentidos = array ("gusto", "oido", "olfato", "tacto", "vista"); $numeros = array(1,2,30, 50, 60, 70);

Para acceder un elemento del arreglo usaremos la notacin genrica:


$estaciones[$i]; $sentidos[$i]; $numeros[$i];

Como ndice podemos usar un nmero, una variable o constante que represente el elemento referenciando. Iniciando desde la posicin cero.
Ejemplo:Se declara un arreglo denominado $estacion. El cual se recorre mediante un

ciclo for.

<?php $estacion = array ('Primavera', 'Verano', 'Otoo', 'Invierno'); echo "Las estaciones del ao son <br />"; for($i = 0; $i <= 4; $i++) echo $estacion[$i]."<br />"; ?>

L.I. Esteban Snchez Mendoza

Pgina 72

Programacin Web

Unidad III

Los arrays se ordenan usando las funciones asort(), arsort(), ksort(), rsort(), sort(), uasort() y uksort() segn el tipo de ordenacin. Ejemplo: Generar un vector aleatorio de tamao n y ordenarlo.

Usamos la funcin mt_rand para generar nmeros aleatorios El mtodo sort ordena los valores del vector de menor a mayor

<?php $enviar = $_POST['enviar']; $n = $_POST['n']; if( isset($enviar) and $_SERVER['REQUEST_METHOD'] == 'POST' and ($n > 0 and $n < 200000) ) { for($i = 0; $i <= $n; $i++) { // Genera un vector de tamao n $vector[$i] = mt_rand(1, 1000); //mt_rand genera nmeros aleatorios } sort($vector); // Ordena el vector //Imprime el Vector ordenado for($i = 0; $i <= $n; $i++) echo $vector[$i].' '; echo "<br />"; } else { $cadena = "<p class='centrado'>Por aqu no puedes entrar<br /></p>"; echo $cadena; } ?> Otra funcin interesante es count que cuenta el nmero de elementos de un arreglo. Ejemplo. Considere las temperaturas mximas registradas en la ciudad de Veracruz durante el mes de febrero del 2010.

<?php $temperatura = array(23, 25,27, 23, 27,26, 26, 28,27, 22, 26,21, 23 24,21,18,18,19,26,28,27, 27,26,18, 23,26,24,27); sort($temperatura); $n = count($temperatura); $promedio = 0; L.I. Esteban Snchez Mendoza Pgina 73

Programacin Web for($i = 1; $i < $n; $i++) $promedio += $temperatura[$i]; $promedio = $promedio/$n; $maximo = $temperatura[$n - 1]; echo "Temperatura mnima = $temperatura[0] <br />"; echo "Temperatura media = $promedio <br />"; echo "Temperatura mxima = $maximo <br />"; ?> Ejemplo: Obtener los archivos de un directorio ordenados alfabticamente.

Unidad III

En la lnea 3 se establece un apuntador al directorio indicado mediante la funcin opendir La lnea 4 realiza un ciclo, en el cual la funcin readdir lee uno a uno los archivos del subdirectorio La lnea 5 asigna el archivo a una posicin del vector La funcin closedir en la lnea 7 cierra el apuntador La funcin sort() lnea 8 ordenada el vector de menor a mayor El sentencia de control foreach recorre el vector

<?php // llenar un array con todos los tems de un directorio $handle = opendir('zodiaco'); while (false !== ($archivo = readdir($handle))) { $archivos[] = strtolower($archivo); } closedir($handle); sort($archivos); foreach($archivos as $i => $valor) { echo $valor."<br />"; }; ?>

L.I. Esteban Snchez Mendoza

Pgina 74

Programacin Web Ejemplo: Funciones bsicas en arreglos


Unidad III

En la lnea 2 se declara un array numrico. Las lneas 3, 9, 14, 20 imprimen el contenido del arreglo mediante la funcin print_r. La funcin count cuenta el nmero de elementos del array (Lneas 4, 6, 11, 16, 21). En la lnea 8 se borra uno a uno el contenido del array (unset) En las lneas 14 y 19 se agregan valores en la siguiente posicin del vector. En la lnea 18 se restablecen los ndices mediante la funcin array_values.

<?php $array = array(1, 2, 3, 4, 5,70,90); // Creamos un array simple. print_r($array); // Imprimimos el array echo "<br />Elementos en el array: ".count($array)."<br />"; // Borraremos los items,el apuntador del array quedar intacto $n = count($array); for($i = 0; $i <= $n; $i++) { unset($array[$i]); } print_r($array); echo "<br />Elementos en el array: ".count($array)."<br />"; // Ahora sumaremos un item // (observe que el nuevo ndice es 7, y no 0). $array[] = 60; print_r($array); echo "<br />Elementos en el array: ".count($array)."<br />"; // Re-index: $array = array_values($array); $array[] = 57; print_r($array); echo "<br />Elementos en el array: ".count($array)."<br />"; ?> Funcin range Crea un vector que contiene una secuencia de elementos. Sintaxis array range ( mixed $inicial , mixed $final [, number $incremento ] )

range() retorna vector de elementos desde inicial hasta final, ambos inclusive. Si inicial > final, la secuencia ser del mayor al menor.

L.I. Esteban Snchez Mendoza

Pgina 75

Programacin Web

Unidad III

Si recibe como parmetro incremento, ste ser usado como el incremento entre elementos en la secuencia. incremento es un nmero positivo. Si no se especifica, incremento tendr un valor predeterminado de 1.

<?php echo "<h1>Uso de range</h1><br />"; echo "Vector simple<br />"; foreach (range(0, 20) as $numero) { echo $numero."<br />"; } echo "Vector con incremento<br />"; foreach (range(0, 200, 20) as $numero) { echo $numero."<br />"; } echo "Vector de letras<br />"; foreach (range('a', 'z') as $letra) { echo $letra."<br />"; } echo "Vector de letras descendente<br />"; foreach (range('M', 'C') as $letra) { echo $letra."<br />"; } ?> Arrays asociativos Un array esta formado por conjuntos de parejas ndice => valor, o como suele expresarse en ingls, key, value. Los cuales se expresan comunmente con ndices o keys numricos (tambin conocidos como arrays escalares). Adems es posible usar strings como ndices, es decir, cadenas de texto. Este tipo de array es el array asociativo:

Ejemplo: Imprimiremos la fecha actual mediante el uso de arreglos.


En la lnea 4 se declara un arreglo asociativo que contiene los nombres del mes en espaol En la lnea 11 se declara un arreglo asociativo que contiene los nombres del da de la semana en espaol En la lnea 18 se obtiene el nmero del da del mes El ao se obtiene en la lnea 19 Pgina 76

L.I. Esteban Snchez Mendoza

Programacin Web

Unidad III

<?PHP function imprimeFecha(){ $mesArray = array( 1 => 'Enero', 2 => 'Febrero', 3 => 'Marzo', 4 => 'Abril', 5 => 'Mayo', 6 => 'Junio', 7 => 'Julio', 8 => 'Agosto', 9 => 'Septiembre', 10 => 'Octubre', 11 => 'Noviembre', 12 => 'Diciembre' ); $semanaArray = array( 'Mon' => 'Lunes', 'Tue' => 'Martes', 'Wed' => 'Miercoles', 'Thu' => 'Jueves', 'Fri' => 'Viernes', 'Sat' => 'Sbado', 'Sun' => 'Domingo', ); $mesReturn = $mesArray[date('n')]; $semanaReturn = $semanaArray[date('D')]; $dia = date('d'); $ao = date('Y'); } echo imprimeFecha(); ?> return $semanaReturn.' '.$dia.' de '.$mesReturn.' de '.$ao;

Recorrer una tabla con ndices numricos mediante un bucle es sencillo, pero cmo recorremos una tabla con ndices asociados? Para ello, utilizaremos una serie de sentencias especficas para tal fin: each() se usa normalmente de forma conjunta a list() para recorrer una matriz: por ejemplo: <?php $deportivos = array('a' => 'BWM M3 Sedan', 'b' => 'Mazda Miata', 'c' => 'cFerrari 612 Sca glietti', 'd' => 'Corvette C6'); while (list($key, $deportivo) = each($deportivos)) { $foto = "deportivos/$deportivo".'.jpg'; echo "<img src='$foto' />"."<br />"; echo $deportivo."<br />"; } ?> L.I. Esteban Snchez Mendoza Pgina 77

Programacin Web Matrices

Unidad III

Los arrays bidimensionales - matrices - similares a una tabla de doble entrada. Cada uno de los elementos se identifica unvocamente por un nombre ($nombre) seguido de dos ([]) que contienen los ndices del array. Los ndices pueden ser de tipo escalar - equivalen al nmero de fila y columna que la celda ocupa en la tabla o puede ser asociativos lo que equivaldra en alguna medida a usar como ndices los nombres de la fila y de la columna. Los elementos de un array bidimensional escalar pueden escribirse usando una de estas sintaxis:

$arreglo[][] = valor. En este caso los ndices se autoincrementan iniciando los ndices en cero. El primer ndice corresponde a renglones y el segundo a las columnas. $arreglo[i][j] = valor. En este caso corresponde al programador el control de los ndices. Ejemplo: Crear e imprimir una matriz r - renglones - x c - columnas -.

En las lneas 6 y 11 se controla el ndice rengln En las lneas 7 y 12 se controla el ndice columna mt_rand es una funcin PHP que genera nmeros aleatorios en este caso entre 1 y 100.

<?php $enviar = $_POST['enviar']; if( isset($enviar) and $_SERVER['REQUEST_METHOD'] == 'POST') { $r = $_POST['renglones'] - 1; $c = $_POST['columnas'] - 1; $cadena = "<table class='tabla'>"; for($i = 0; $i <= $r; $i++) { $cadena .= "<tr>"; for($j = 0; $j <= $c; $j++) { $matriz[$i][$j] = mt_rand(1, 100); $cadena .= "<td><div align='right'>"; $cadena .= $matriz[$i][$j]."</div></td>"; } $cadena .= "</tr>"; L.I. Esteban Snchez Mendoza Pgina 78

Programacin Web } echo $cadena . "</table>"; } else { $mensaje = "<p align='center'>Falta informacin as "; $mensaje .= "no puedes ejecutar</p>"; echo $mensaje; } ?> Ejemplo: Suma o resta de matrices

Unidad III

Dadas las matrices m-por-n , A y B, su suma A + B es la matriz m-por-n calculada sumando los elementos correspondientes (i.e. (A + B)[i, j] = A[i, j] + B[i, j] ). Es decir, sumar cada uno de los elementos homlogos de las matrices a sumar. Por ejemplo:

Mediante la funcin mt_rand que genera nmeros aleatorios llenamos la matriz A y B La sentencia $operacion*$matriz2[$i][$j] determina si se realiza una suma o resta de matrices. $operacin toma los valores -1 y 1.

<?php function imprimeMatriz($matriz, $r, $c, $mensaje) { echo "<table class='tabla' align='center'>"; echo "<tr><td>$mensaje</td></tr>"; for($i = 0; $i < $r; $i++) { $cadena = "<tr>"; for($j = 0; $j < $c; $j++) { $cadena .= "<td><div align='right'>"; $cadena .= $matriz[$i][$j]."</div></td>"; } echo $cadena."</tr>"; } echo "</table><br />"; } $enviar = $_POST['enviar']; L.I. Esteban Snchez Mendoza Pgina 79

Programacin Web if( isset($enviar) && $_SERVER["REQUEST_METHOD"] == "POST") { $fila1 = $_POST['f1']; $col1 = $_POST['c1']; $fila2 = $_POST['f2']; $col2 = $_POST['c2']; $operacion = $_POST['operacion']; if($fila1 == $fila2 && $col1 == $col2){ for($i = 0; $i < $fila1;$i++){ for($j = 0; $j < $col1; $j++){ $matriz[$i][$j] = mt_rand(1,100); $matriz2[$i][$j] = mt_rand(1,100); } } imprimeMatriz($matriz, $fila1, $col1, 'Matriz A:'); imprimeMatriz($matriz2, $fila2, $col2, 'Matriz B:'); if($operacion == 1) { $mensaje = 'A + B'; } else $mensaje = 'A - B'; echo "<table class='tabla' align='center'>"; echo "<tr><td>$mensaje:</td></tr>"; for($i = 0; $i < $fila2; $i++) { $cadena = "<tr>"; for($j = 0; $j < $col2; $j++) { $cadena .= "<td><div align='right'>"; $cadena .= $matriz[$i][$j] $cadena .= $operacion*$matriz2[$i][$j]; $cadena .= "</div></td>"; } echo $cadena."</tr>"; } echo "</table><br>"; } else { $mensaje = 'Las matrices no tienen las mismas dimensiones'; $mensaje .= ' por lo tanto es imposible hacer operacin'; } echo $mensaje; } else { echo 'Falta informacin as no puedes ejecutar'; } ?>

Unidad III

L.I. Esteban Snchez Mendoza

Pgina 80

Programacin Web

Unidad III

Ejemplo: Producto de matrices El producto de dos matrices se puede definir slo si el nmero de columnas de la matriz izquierda es el mismo que el nmero de filas de la matriz derecha. Si A es una matriz mn y B es una matriz np, entonces su producto matricial AB es la matriz mp (m filas, p columnas) dada por:

para cada par i y j. Aplicacin:

<?php function imprimirMatriz($matriz, $r, $c, $mensaje) { $cadena = "<table align='center'>"; $cadena .= "<tr><td align='center'>".$mensaje."</td><td></td></tr>"; for($i = 0; $i < $r; $i++) { $cadena .= "<tr>"; for($j = 0; $j < $c; $j++) $cadena .= "<td align='right'>".$matriz[$i][$j]."</td>"; $cadena .= "</tr>"; } $cadena .= "</table>"; echo $cadena; } function multiplicaMatriz($matriz, $matriz2, $fila1, $col1, $fila2, $col2){ echo "<table class='tabla' align='center'>"; echo "<tr><td>Matriz Resultante:</td></tr>"; for($i = 0; $i < $fila1; $i++) { $cadena = "<tr>"; for($j = 0; $j < $col2; $j++) { $suma = 0; for($k = 0; $k < $col1; $k++) $suma += $matriz[$i][$k]*$matriz2[$k][$j]; $cadena .= "<td><div align='right'>".($suma)."</div></td>"; } echo $cadena."</tr>"; L.I. Esteban Snchez Mendoza Pgina 81

Programacin Web } echo "</table><br><br>";

Unidad III

$enviar = $_POST['enviar']; if( isset($enviar) && $_SERVER['REQUEST_METHOD'] == 'POST') { $fila1 = $_POST['f1']; $col1 = $_POST['c1']; $fila2 = $_POST['f2']; $col2 = $_POST['c2']; $suma = 0; unset($enviar); if($col1 == $fila2){ for($i = 0; $i < $fila1; $i++) for($j = 0; $j < $col1; $j++) $matriz[$i][$j] = mt_rand(1,10); imprimirMatriz($matriz, $fila1, $col1, "Matriz A:"); for($i = 0;$i < $fila2; $i++) for($j = 0; $j < $col2; $j++) $matriz2[$i][$j] = mt_rand(1,10); imprimirMatriz($matriz2, $fila2, $col2, "Matriz B:"); multiplicaMatriz($matriz, $matriz2, $fila1, $col1, $fila2, $col2); } else { $cadena = "<center>Las matrices no son conformables "; $cadena = "Por lo tanto no se puede hacer la multiplicacion</center>"; echo $cadena; } } else { echo "Falta informacin as no puedes ejecutar"; } ?> Ejemplo: Una rocola bsica

En las lneas 2 al 6 se declara una matriz bidimensional asociativa llamada Salseros Mediante la instruccin foreach recorremos dicha matriz que obtiene un vector denominado cantante La extraccin del vector cancion en la lnea 13 nos permite tomar la musica en nuestro caso la primera columna es el nombre del artista y el resto de las posibles sern las canciones a reproducir Si bien el programa no tiene errores de lgica, su uso no es ptimo y su optimizacin ser tema de otro apartado

L.I. Esteban Snchez Mendoza

Pgina 82

Programacin Web <?php $Salseros = array( array('Gilberto Santa Rosa','Vivir Sin Ti', 'Me Cambiaron Las Preguntas'), array('Maelo Ruiz','Te va a doler','Regalame una noche'), array('Tito Nieves','Si yo fuera el','La leccion de Pedro K') ); foreach($Salseros as $cantante) { echo '<tbody><tr>'; $i = 1; foreach($cantante as $cancion) { if ($i !== 1) { echo "<td>$cancion"; $cancion = '../mp3/'.$cancion.'.mp3'; echo ";<embed class='flash_close' width='200' height='25'"; echo "type='application/x-shockwave-flash' "; echo "src='singlemp3player.swf' "; echo "pluginspage='http://www.adobe.com/go/getflashplayer' "; echo "flashvars='file=$cancion'/;>"; echo ";</td;>" } else { echo "<td>$cancion</td>"; } ++$i; } echo "</tr>"; } echo "</tbody></table></div>" ?>

Unidad III

3.6 Funciones y libreras.


Una funcin es el trmino para describir una secuencia de rdenes que hacen una tarea especfica de una aplicacin ms grande. Una funcin de usuario en PHP no es ms que una porcin de cdigo que podemos llamar en cualquier momento. De un lado, al dividir nuestro cdigo en funciones podemos aislar y perfeccionar cada una de sus funcionalidades; de otro lado, podemos reutilizar este cdigo, ya que una funcin puede ser llamada cuantas veces la necesitemos.

L.I. Esteban Snchez Mendoza

Pgina 83

Programacin Web

Unidad III

Para definir una funcin debemos usar la palabra reservada function. Para llamar la funcin basta con invocar su nombre. Las declaraciones de funciones generalmente son especificadas por:

Nombre de la funcin con el que se identifica y se distingue de otras. No podr haber otra funcin, ni procedimiento con ese nombre (salvo sobrecarga o polimorfismo en programacin orientada a objetos).

Un tipo de dato de retorno. Tipo de dato del valor que la funcin devolver al terminar su ejecucin. Una lista de parmetros. Especificacin del conjunto de argumentos (pueden ser cero, uno o ms) que la funcin debe recibir para realizar su tarea. El cdigo u rdenes de procesamiento. Conjunto de rdenes y sentencias que debe ejecutar la funcin.

La sintaxis de una funcin es la siguiente:


function nombreFuncion(arg1, arg2,... argn) { //cuerpo de la funcin }

Ejemplo: Conventir grados centgrados a grados Fahrenheit.


En las lneas 2 al 4 se hace la declaracin de la funcin La palabra reservada return regresa el valor de la funcin lnea 3 En la lnea 11 se hace un llamado a la funcin cF pasandole como parmetro una variable

<?php function cF( $grados ){ return 1.8 * $grados + 32; } $g = $_POST['centigrados']; if(isset($_POST['convertir']) and $_SERVER['REQUEST_METHOD'] == 'POST' and !empty($g) ) { echo "<p class='centrado'>$g grados centigrados equivalen a ";

L.I. Esteban Snchez Mendoza

Pgina 84

Programacin Web echo cF($g)." grados Fahrenheit</p>"; unset($_POST['centigrados']); } else { echo "<p class='centrado'>Falta informacin as no puedes "; echo "ejecutar</p>"; }

Unidad III

PHP no distingue entre maysculas y minsculas al nombrar las funciones, asi que cF sera lo mismo que CF, aunque es buena prctica ser consistente en la forma de escribir los nombres. Como curiosidad, podrs observar que en los mensajes de error, PHP siempre designa tus funciones en minscula. Los parntesis permiten pasar valores a las funciones (parmetros), son siempre necesarios, aunque no pases valor alguno Una funcin puede retornar ms de un valor, si lo regresamos como un arreglo y lo asignamos mediante la funcin de PHP list. Ejemplo: Convertir grados Centgrados (Celsius) a grados Fahrenheit, Kelvin y Rankine.

La lnea 6 regresa un array de valores Mediante la funcin list se recuperan los valores del array en variables

<?php function conversion( $grados ){ $f = 1.8 * $grados + 32; $r = $f + 459.67; $k = $r/1.8; return array($f, $r, $k); } $convertir = $_POST['convertir']; $formato = "<br /><p class='centrado'>"; $g = $_POST['grados']; if( isset($convertir) and $_SERVER['REQUEST_METHOD'] == 'POST' and (!empty($g) or $g == 0)) { list($f, $r, $k) = conversion($g); echo "$formato $g grados centgrados equivalen a: "</p>"; echo "$formato $f grados Fahrenheit</p>"; L.I. Esteban Snchez Mendoza Pgina 85

Programacin Web echo "$formato $r grados Rankine</p>"; echo "$formato $k grados Kelvin </p>"; } else { echo "$formato Falta informacin as no puedes ejecutar</p>"; }

Unidad III

?>

Paso de parmetros por referencia

Hasta el momento usamos parmetros por valor. Si queremos pasar nuestras variables por referencia - de tal manera que los cambios en los argumentos persistan - es necesario anteponer al argumento o parmetro el smbolo "&". Ejemplo: Considere el clculo del rea y volumen de una esfera en funcin de su radio mediante las siguientes formulas;

En la lnea 2 al 5 se declara una funcin con parmetros por referencia. La lnea 3 usa la funcin predifinida pi() que no necesita explicacin Observe que la funcin no regresa valores, pero aun as las variables rea y volumen tomaron valor. Esto es porque fueron declaradas como parmetros por referencia.

La funcin PHP number_format da formato a un parmetro numrico con separador de miles y decimales

<?php function calculo( $radio, &$area, &$volumen ){ $area = 4 * pi() * $radio * $radio; $volumen = $area * $radio /3; } $radio = $_POST['radio']; L.I. Esteban Snchez Mendoza Pgina 86

Programacin Web $formato = "<p class='centrado'><br />"; if( isset($_POST['calcular']) and $_SERVER['REQUEST_METHOD'] == 'POST' and $radio > 0 ) { $area = 0; $volumen = 0; calculo($radio, $area, $volumen); echo "$formato Sea una esfera cuyo radio es $radio metros</p>"; echo "$formato tiene un rea de ".number_format($area,2,'.',','); echo "metros<sup>2</sup></p>"; echo "$formato tiene un volumen de "; echo number_format($volumen,2,'.',','); echo " metros<sup>3</sup></p>"; } else { echo "$formato Falta informacin as no puedes ejecutar</p>"; } ?>

Unidad III

Se puede proporcionar un valor por defecto para la funcin, que se aplicar salvo que especfique otro al llamarla. Ejemplo: Convertir de yardas a metros

En las lneas 2 al 4 declara la funcin yardas_metros cuyo parmetro por defecto es 1 $y = yardas_metros() hace una llamada a la funcin sin parmetros $m = yardas_metros($yardas) hace una llamada a la funcin con parmetros

<?php function yardas_metros( $yarda = 1 ){ return 0.9144 * $yarda; } $forma = "<br /><p class='centrado'>"; $yardas = $_POST['yardas']; if( isset($_POST['convertir']) and $_SERVER['REQUEST_METHOD'] == 'POST' and $yardas > 0) { $y = yardas_metros(); $m = yardas_metros($yardas); echo "$forma Una yarda equivale a $y metros</p>"; echo "$forma $yardas yardas equivalen a $m metros</p>"; L.I. Esteban Snchez Mendoza Pgina 87

Programacin Web } else { echo "$forma Falta informacin as no puedes ejecutar</p>"; } ?>

Unidad III

Funciones recursivas
Se denominan funciones recursivas a aquellas que se llaman a s mismas. Ejemplo: Para todo nmero natural n, se llama n factorial o factorial de n al producto de todos los naturales desde 1 hasta n. Es decir:

Se define 0! = 1, para que la relacin n! = n (n - 1)! sea tambin vlida para n = 1. Esta relacin permite definir los factoriales por recursividad. La notacin n! fue popularizada por el matemtico francs Christian Kramp.

<?php $n = $_POST['n']; $forma = "<p class='centrado'>"; if( isset($_POST['calcular']) and $_SERVER['REQUEST_METHOD'] == 'POST' and !empty($n) and ($n >= 0 and $n <= 69) { // Una funcin se puede declarar donde // Gustes o se necesite function factorial($n = 1) { if($n <= 1) { return 1; // funcion base } else { //llamada as misma return $n * factorial($n - 1); } } //Fin: Factorial L.I. Esteban Snchez Mendoza Pgina 88

Programacin Web echo "$forma El factorial de $n = "; echo factorial($n)."</p>"; } else { echo "$forma Falta informacin as "; echo "no puedes ejecutar</p>"; } ?> Ejemplo: Determinar si un nmero es primo, par o impar.

Unidad III

Cero y uno es un nmero primo y par Dos es primo y par abs calcula el valor absoluto de un nmero sqrt obtiene la raz cuadrada de un nmero floor es el nmero entero inferior a n. floor(6.7) = 6 $multiplo = floor(sqrt($n)) = Mximo entero que puede dividir exactamente a un nmero

<?php function tipo($m) { $n = abs($m); $forma = "<p class='centrado'>"; if($n == 0) return "$forma 0 es par</p>"; if($n == 1) return "$forma 1 es un primo impar</p>"; if($n == 2) return "$forma 2 es el unico primo par<p />"; if($n % 2 == 0) return "$forma".number_format($m, 0, ".", ",")." es par</p>"; $multiplo = floor(sqrt($n)); $i = 3; while ( ($n % $i !== 0) and ( $i <= $multiplo )) $i += 2; if( $i > $multiplo ) { return "$forma $m es primo</p>"; } else { return "$forma $m es impar</p>"; } } if( isset($_POST['calcular']) and $_SERVER['REQUEST_METHOD'] == 'POST' and !empty($_POST['n']) ) { echo tipo($_POST['n']); } else { $forma = "<p class='centrado'>"; echo "$forma Falta informacin as no puedes ejecutar</p>"; } L.I. Esteban Snchez Mendoza Pgina 89

Programacin Web ?>

Unidad III

Ejemplo: Mximo comn divisor. En matemticas el mximo comn divisor (abreviado mcd) de dos nmeros enteros es el mayor nmero que los divide sin dejar resto. El mtodo que se codifica es el algoritmo de Euclides, el cual se describe formalmente como:

<?php function mcd($a, $b) { $a = abs($a); $b = abs($b); if ($b == 0) $resultado = $a; else $resultado = mcd($b, $a%$b); return $resultado; } //mcd $a = $_POST['a']; $b = $_POST['b']; $forma = "<p class='centrado'>"; if( isset($_POST['calcular']) and $_SERVER['REQUEST_METHOD'] == 'POST' and !empty($a) and !empty($b)) { $mcd = mcd($a,$b); echo "$forma mcd( $a, $b) = $mcd</p>"; echo "$forma $a".'/'.$b. ' = '.$a/$mcd.'/'; echo $b/$mcd."</p>"; unset($a); unset($b); } else { echo "$forma Falta informacin as "; echo "no puedes ejecutar</p>"; } ?>

L.I. Esteban Snchez Mendoza

Pgina 90

Programacin Web Ejemplo: Mnimo comn mltiplo

Unidad III

El mnimo comn mltiplo (m.c.m.) de dos nmeros naturales es el menor nmero natural que es mltiplo de todos ellos. Slo se aplica con nmeros naturales, es decir, no se usan decimales ni nmeros negativos. Conociendo el mximo comn divisor de dos nmeros, se puede calcular el mnimo comn mltiplo de ellos, que ser el producto de ambos dividido entre su mximo comn divisor.

<?php function mcd($a, $b) { if ($b == 0) $resultado = $a; else $resultado = mcd($b, $a%$b); return $resultado; } //mcd function mcm($a, $b) { $a = abs($a); $b = abs($b); return ($a * $b)/mcd($a, $b); } $a = $_POST['a']; $b = $_POST['b']; $forma = "<p class='centrado'>"; if( isset($_POST['calcular']) and $_SERVER['REQUEST_METHOD'] == 'POST' and !empty($a) and !empty($b) ) { $mcm = mcm($a,$b); echo "$forma mcm( $a, $b) = $mcm</p>"; unset($calcular); } else { echo "$forma Falta informacin as "; echo "no puedes ejecutar</p>"; } ?>

L.I. Esteban Snchez Mendoza

Pgina 91

Programacin Web

Unidad III

Ejemplo de aplicacin: Suma, resta, multiplicacin y divisin de quebrados Suma o Resta: function sumaResta($n1, $d1, $n2, $d2, $signo) { $dr = mcm($d1, $d2); $nr = ($n1 * ($dr / $d1) + $signo * $n2 * ( $dr / $d2)); $cadena = $n1.'/'.$d1.' '; $cadena .= ($signo == 1?'+':'-').' '.$n2.'/'.$d2; if($nr == 0) { $mensaje = $cadena.' = 0'; } else { if( $nr == $dr) { $mensaje = $cadena.' = 1'; } else { $mensaje = reducir($nr, $dr, $cadena); } } return $mensaje; } Multiplcacion: function multiplicar($n1, $d1, $n2, $d2) { $nr = $n1 * $n2; $dr = $d1 * $d2; $cadena = $n1.'/'.$d1.' * '.$n2. '/'.$d2; if($nr == 0 ) { $cadena .= ' 0'; $mensaje = $cadena; } else { $mensaje = reducir($nr, $dr, $cadena); } return $mensaje; } Divisin: function division($n1, $d1, $n2, $d2) { $nr = $n1 * $d2; $dr = $n2 * $d1; $cadena = $n1.'/'.$d1.' / '.$n2. '/'.$d2; if($nr == 0 ) { $cadena .= ' 0'; $mensaje = $cadena; } else { $mensaje = reducir($nr, $dr, $cadena); L.I. Esteban Snchez Mendoza Pgina 92

Programacin Web } return $mensaje;

Unidad III

Reducir: function reducir($nr, $dr, $cadena) { $mcd = mcd($nr, $dr); if($mcd != 1) { $nr = $nr / $mcd; $dr = $dr / $mcd; } if($dr == 1) { $mensaje = $cadena .' = '.$nr; } else { $mensaje = $cadena .' = '.$nr.'/'.$dr; } return $mensaje; } Fracciones: $enviar = $_POST['enviar']; if( isset($enviar) and $_SERVER['REQUEST_METHOD'] == 'POST') { $operacion = $_POST['operacion']; $n1 = $_POST['n1']; $d1 = $_POST['d1']; $n2 = $_POST['n2']; $d2 = $_POST['d2']; if( empty($n1) or empty($n2) or empty($d1) or empty($d2) ) { $mensaje = 'Deja de jugar'; } else { $d = $d1 * $d2; if( $d == 0) { $mensaje = 'Deja de jugar'; } else { $operacion = $_POST['operacion']; switch ( true ) { case ( $operacion == 1) : $mensaje = sumaResta($n1, $d1, $n2, $d2, 1); break; case ( $operacion == 2) : $mensaje = sumaResta($n1, $d1, $n2, $d2, -1); break; case ( $operacion == 3) : $mensaje = multiplicar($n1, $d1, $n2, $d2); break; case ( $operacion == 4) : $mensaje = division($n1, $d1, $n2, $d2); break; }//switch } //else $d == 0 L.I. Esteban Snchez Mendoza Pgina 93

Programacin Web } // if $empty($n1) } else $mensaje = 'Por aqu no puedes entrar'; echo $mensaje; ?> Ejemplo: La constante matemtica e

Unidad III

Es uno de los ms importantes nmeros reales. El logaritmo en base e se llama logaritmo natural o neperiano. El nmero e, conocido a veces como nmero de Euler o constante de Napier fue reconocido y utilizado por primera vez por el matemtico escocs John Napier, quien introdujo el concepto de logaritmo en el clculo matemtico. El nmero e, al igual que el nmero , es un nmero trascendente, es decir, que no puede ser obtenido directamente mediante la resolucin de una ecuacin algebraica. Por lo tanto, es un irracional y su valor exacto no puede ser expresado como un nmero finito de cifras decimales o con decimales peridicos. Su valor aproximado (truncado) es dado por la funcin

El cdigo PHP para calcular el nmero de Euler esta dado por: <?php function numeroEuler() { //Mximo error permitido $error = 0.000000000001; $e = 2; $anterior = 0; $i = 2; $f = 2; // Aproximacin sucesiva while ( abs($e - $anterior) >= $error) { $anterior = $e; $e += 1/$f; $f = $f * ++$i; } return $e; } $e = numeroEuler(); L.I. Esteban Snchez Mendoza Pgina 94

Programacin Web echo 'Nmero de Euler o constante de Napier = '.$e; ?>

Unidad III

Ejemplo: Mediante una serie de Taylor podemos calcular muchas funciones importantes. Como por ejemplo la funcin exponencial dada por:

Un cdigo depurado se presenta a continuacin. El cual es ms eficiente al no tener que calcular cada factorial. <?php function exponencial($x = 0) { //mximo error permitido $error = 0.000000000001; if ($x != 0) { $e = 1;} else return 0; $anterior = 0; $i = 0; $f = 1; //Aproximacin while ( abs($e - $anterior) >= $error) { $anterior = $e; $f *= ++$i; $e += pow($x, $i)/$f; } return $e; } $x = $_POST['e']; $forma = "<p class='centrado'>"; if( isset( $_POST['calcular'] ) and $_SERVER['REQUEST_METHOD'] == 'POST' and !empty($x)) { echo "$forma exp($x) = ".exponencial($x)."</p><br />"; } else { echo "$forma Falta informacin as no puedes ejecutar</p>"; } ?>

L.I. Esteban Snchez Mendoza

Pgina 95

Programacin Web

Unidad III

3.7 Ejemplos prcticos.


Redireccionamiento de los visitantes a las pginas especficas en su idioma. Conocer los idiomas seleccionados en el navegador de nuestros visitantes puede ser un dato muy importante que puede utilizar para redirigir al usuario a una pgina especfica en el idioma correspondiente, o bien para mostrar informacin especfica dirigida al usuario (como por ejemplo el anuncio ms adecuado) Si deseamos que nuestro sitio sea bilinge en ingls y espaol, bajo el supuesto que el espaol y el ingls son los dos idiomas ms utilizado por nuestros visitantes (nuestro idioma por defecto ser espaol). <? if (substr($_SERVER['HTTP_ACCEPT_LANGUAGE'],0,2) == 'es'){ include("paginaEspanol.html"); } else { include("paginaIngles.html"); } ?> Imprimir fecha y hora del sistema <html> <body> La fecha del da de hoy es: <? echo date("Y/m/d"); ?> La hora local del servidor es: <? echo date("G:i:s"); ?> </body> </html> Procesando Formularios Para conocer mediante que mtodo recibimos el formulario en PHP usamos la variable de servidor $_SERVER['REQUEST_METHOD']. El siguiente cdigo muestra su uso. <?php if ($_SERVER['REQUEST_METHOD'] == 'GET'){ echo 'Usaste GET para enviar los datos'; } else if($_SERVER['REQUEST_METHOD'] == 'PUT'){ echo 'Usaste PUT para enviar los datos'; } ?> L.I. Esteban Snchez Mendoza Pgina 96

Programacin Web Eliminar espacios

Unidad III

La funcim trim elimina los espacios en blanco de la cadena. Observe que est funcin solo elimina los espacios en blanco de los extremos izquierdo y derecho de la cadena, ignorando los espacios en blanco internos (Lnea 9).

la funcin strtoupper convierte la cadena en maysculas ucfirst convierte el primer carcter de una cadena a mayscula, si el carcter es alfabtico. la funcin strlower convierte la cadena en minsculas (Lnea 3). ereg_replace busca cualquier ocurrencia del patrn en la cadena y la remplaza por otra. En nuestro caso, cambia todo espacio en blanco por vaco

<?php function eliminarEspacios($cadena) { $cadena = strtolower($cadena); $cadena = ereg_replace( ' ', '', $cadena); return "<p class='centrado'>".$cadena."</p><br />"; } if( isset($_POST['enviar']) && $_SERVER['REQUEST_METHOD'] == 'POST' ) { $cadena = trim($_POST['cadena']); if( empty($cadena)) { echo "<p class='centrado'>Enviaste una cadena vaca</p>"; } else echo eliminarEspacios($cadena); } else { echo "<p class='centrado'>As no puedes ejecutar</p>"; } ?> Clculo de reas y permetros El programa principal (phpcodigo3903.php) realiza una interface bsica buscando separar el formato del proceso, por eso la cantidad de archivos.

La funcin isset() checa si pulso el botn calcular (Lnea tres). En caso contrario carga la interfase lnea 15 La funcin unset() destruye una variable, es decir la saca de la memoria (Lnea cinco). Pgina 97

L.I. Esteban Snchez Mendoza

Programacin Web

Unidad III

La sentencia include() inserta y evala el archivo especificado, observe que se tiene uno por figura (Lnea 8 cuadrado.inc, lnea 10 circulo.inc y lnea 12 rectngulo.inc.

Por simplicidad se presenta aqu el cdigo cuadrado.inc que no es otra cosa que cdigo html para obtener los datos necesarios para calcular el rea y el permetro de un cuadro.

En este caso el nico dato necesario es el lado. Note que las propiedas id y name del form se llaman cuadrado (lnea 1), nombre de la figura. Considere que para todos las figuras el botn de procesamiento se llamara calcular. Se incluye un componente de tipo hidden con el valor de Cuadrado (lnea 16).

L.I. Esteban Snchez Mendoza

Pgina 98

Programacin Web Por ltimo se presenta el cdigo que procesa los datos de entrada.

Unidad III

Envio de correos Enviar correos mediante PHP es sumamente sencillo si usamos la funcin mail. La funcin mail es: mail($destino, $asunto, $mensaje, $encabezado); Donde

$destino: es la direccin a donde se enviar el mensaje $asunto: asunto del mensaje $mensaje: cuerpo del mensaje $encabezado: aqu se anexa por ejemplo a quien se enva el mensaje, si el mensaje va ir con copia para, si el mensaje ira con copia oculta para, si tendr formato html, etc. or die manda un mesaje si ocurre un error y detiene el proceso

L.I. Esteban Snchez Mendoza

Pgina 99

Programacin Web Cdigo.

Unidad III

En la lnea 2 se carga una funcin llamada emailValido que se explicara posteriormente. En la lnea 4 se checa que la pgina se carga mediante el mtodo POST. Las lneas 9, 10 y 11 se recuperan los datos que provienen del formulario definido en phpcodigo3904.html. El correo se envia mediante el cdigo definido en la lnea 10, siempre y cuando tenga un destino, un asunto, un mensaje y un correo valido.

L.I. Esteban Snchez Mendoza

Pgina 100

Programacin Web Convertir nmeros a letras

Unidad III

La funcin que se presenta a continuacin convierte nmeros a letras. El nmero a convertir debe ser un entero positivo menor a 999,999, 999,999.

La lnea 3 (Editada para fines de presentacin) declara un array con la representacin alfabtica de los nmeros comprendidos entre 1 y 29. Esta caracterstica se debe a que dichos nmeros no siguen un patrn para su escritura. La lnea 7 declara un arreglo asociativo que contiene la conversin de los nmeros 30, 40 ... y 90. La lnea 9 obtiene el mdulo 10 de n. Si el mdulo 10 de n es cero se regresa la posicin asociada a n en el vector decenas(lnea 9) Si el mdulo 10 de n es diferente de cero. Se regresa la posicin asociada a n en el vector decenas y se hace un llamado a la funcin bsico. La lnea 14 declara un arreglo asociativo para la representacin alfabtica de los nmeros 100,200, ... y 900. La lnea 20 hace uso de un operador ternario para poder manejar la escritura de los nmeros comprendidos entre 101 y 199. En la lnea 27 se obtiene la longitud de n. En el caso de los miles est longitud vara entre 4 y 6. substr($cadena, -3) obtiene los ltimos 3 caracteres de la cadena, lnea 28.

L.I. Esteban Snchez Mendoza

Pgina 101

Programacin Web

Unidad III

L.I. Esteban Snchez Mendoza

Pgina 102

Programacin Web Grficos

Unidad III

La grfica es una de las herramientas ms tiles en el estudio de la mayora de las disciplinas, ya que permite una visin de conjunto del fenmeno sometido a investigacin, ms rpidamente perceptible que la observacin directa de los datos numricos y alfanumricos. Sus aplicaciones son mltiples y variadas en casi todo el quehacer humano. Existen diversas libreras escritas para PHP gratuitas y de paga, su seleccin depende del objetivo y el precio. En este punto abordaremos el uso de JpGraph librera de uso libre completamente escrita en PHP y funcional para scripts PHP. JpGraph es una librera orientada a objetos para PHP >= 5.1 Grfica X - Y A continuacin se presentan las temperaturas (mnimo, media y mxima) promedio en la ciudad y puerto de Veracruz, Ver. Mxico

En la lnea 2 y 3 se carga la librera JpGraph. Las lneas 4, 5 y 6 se encargan de definir los datos mediante arreglos para cada serie En las lneas 7 al 13 se definen las caractersticas de las grficas. Donde Graph( Ancho, Alto), crea un objeto de tipo grfica En las lneas 15 al 17, se definen el eje X en este caso meses en espaol. Las lneas 20 al 22, definen las series en la grfica La lnea 24 agrega fsicamente las series a las grficas y la lnea 25 imprime la grfica.

L.I. Esteban Snchez Mendoza

Pgina 103

Programacin Web

Unidad III

Gfica de barras El ejemplo describe los resultados oficiales del examen de admisin 2010 del Instituto Tcnologico de Veracruz. La lnea 11 se encarga de posicionar las leyendas de cada serie en nuestro caso ingresos a primer semestre e ingresos al semestre cero. La lnea 15 y 20 definen el formato de presentacin de los datos, en este caso %0.0f indica que los valores se presentaran como enteros. La propiedad SetFillGradient (lneas 16 y 21) configuran el degradado de los colores en las barras

L.I. Esteban Snchez Mendoza

Pgina 104

Programacin Web El mtodo Stroke nos permite mostrar la grfica (lnea 28)

Unidad III

Grficas de pastel Las grficas de pastel sirven para expresar porcentajes o conteos de variables cualitativas (ordinales o nominales).

PiePlot crea una instancia de una grfica de pastel (lnea 5) Las etiquetas se crean en la lnea 20 se definen las etiquetas de los datos y su representacin (.1f) expresa un decimal.

L.I. Esteban Snchez Mendoza

Pgina 105

Programacin Web

Unidad III

L.I. Esteban Snchez Mendoza

Pgina 106

Programacin Web

Unidad III

3.8 Procesado de formularios.


PHP se hizo pensando en un uso sencillo con los formularios HTML, atravs de PHP podemos validar y valorar el contenido de los formularios, estos los podemos crear HTML con etiquetas <form> e <input>.

Desde PHP usaremos las variables que representan los datos del formulario. Ejemplo Vamos a realizar un simple formulario HTML con una caja de texto y un botn de "Submit".

Lo que haremos ser hacer que el action del formulario sea mostrar la pagina "valorar.php" y como method pondremos "post" <form action="valorar.php" method="post"> Su nombre: <input type="text" name="nombre" /> <input type="submit" value="Enviar"/> </form> Ahora crearemos la pagina valorar.php: <?php echo "Hola $_POST[nombre], bienvenido a PHP"; ?>

L.I. Esteban Snchez Mendoza

Pgina 107

Programacin Web

Unidad III

3.9 Sesiones.
Una sesin es la secuencia de pginas que un usuario visita en un sitio web. Desde que entra en nuestro sitio, hasta que lo abandona. Las sesiones bsicamente son varibles globales que nos permiten almacenar datos que necesiten volver a ser usados en otros accesos a la pgina. Cuando una persona entra a una pgina que utiliza sesiones automticamente se crea un archivo de session en los archivos temporales del servidor y en este archivo es donde se guardan los datos que nosotros necesitamos almacenar.

Este archivo posee el mismo nombre que su "id". El archivo se mantendra mientras tenga activo su navegador y se destruye al cerrar el navegador. Para que una pgina use sesiones debemos inicializarla con la funcion session_start(), la cual crea una nueva sesin o retoma una creada en otra pgina(del sitio). Las sessiones propagan su SID(SESSION ID) de dos posibles maneras, segn php.ini, por cookies o por url, es decir agregando a todos los posibles link el SID de la sesion. Otra razn por la que la sesiones suelen ser muy utilizadas es para la autentificacin, determinando el acceso a la pgina segn alguna variable especfica de la sesin. Funciones de gestin de sesiones funcin Significado Si es la primera solicitud genera un identificador de sesin aleatorio cuyo nombre ser sess_IDsesin; si es otra solicitud continua la sesin iniciada anteriormente. Elimina todos los datos asociados con una sesin, borra el archivo en el servidor pero no borra la cookie. Borra una variable de sesin. Si no le proporcionamos ningn parmetro nos da el identificador de sesin; si le Pgina 108

session_start();

session_destroy(); session_unset(); session_id([nombre]); L.I. Esteban Snchez Mendoza

Programacin Web funcin Significado

Unidad III

proporcionamos el parmetro nombre cambia el valor del identificador por el parmetro nombre. Si se invoca sin parmetro devuelve el nombre de la variable interna que tiene el id de sesiones; si se pasa parmetro cambia el nombre de la sesin. Obtiene los parmetros de la cookie de la sesin Si se le proporciona valor modifica el valor por defecto en cambio sino se muestra el cach que tiene por defecto. Actualiza el id de sesin activa con uno ms reciente Codifica los datos de la sesin actual en una cadena Descodifica la cadena que recibe como parmetro y que contiene la informacin de sesin, despus de usar esta funcin se actualiza la informacin de sesin. Devuelve la ruta al directorio donde se guardan los archivos asociados a la sesin. El efecto solo dura en el script actual. Devuelve el nombre del mdulo que se usa para realizar la gestin de sesiones. Cuando se invoca un parmetro se usa como nuevo gestor de sesiones.

session_name([nombre]);

session_get_cookie_params(); session_cache_limiter([cache_limiter]);

session_regenerate_id() session_encode();

session_decode(cadena);

session_save_path([path]);

session_module_name([modulo]);

session_set_save_handler(open,close,read,write,destroy,gc); Permite definir su propio manejador para almacenar la informacin asociada con una sesin.De esta forma los datos pueden ser metidos en una base de datos en vez de en un archivo. Tenemos que pasarle como parmetro toda la informacin necesaria para crear y destruir sesiones.

L.I. Esteban Snchez Mendoza

Pgina 109

Programacin Web Iniciando con sesiones: Evitando accesos indeseados


Unidad III

En la lnea 2 se inicia la sesin - session_star() Declaramos una variable llamada usuario (lnea 3) de tipo session Header nos envia a la pgina especficada (lnea 4)

<?php @session_start(); $_SESSION['usuario'] = 'ProgramacionWEB'; header("location:0312InicioSesiona.php"); ?>

En la lnea 3 del segundo programa checamos que se recibi la variables esperada, para evitar accesos indeseados (lnea 6) Se elimina la variable de sesin (lnea 5).

<?php @session_start(); if($_SESSION['usuario'] == 'ProgramacionWEB') { echo 'Usuario: '.$_SESSION['usuario']; unset($_SESSION['usuario']); } else echo 'Te equivocaste'; ?> Contador de visitas con sesiones Mediante el siguiente ejemplo se implementa un contador de visitas

La lnea 2 captura el id de la seccin Si la variable de seccin "visitas" existe la incrementa, caso contrario la crea y la inicia en 1 (lnea 3)

<?php $nombre_anterior = session_id(); if ($nombre_anterior == '') session_start(); ($_SESSION['visitas']) ? $_SESSION['visitas']++: $_SESSION['visitas'] = 1; ?> L.I. Esteban Snchez Mendoza Pgina 110

Programacin Web

Unidad III

Note que en realidad este cdigo cuenta el nmero de veces que recargamos la pgina durante la sesin Control de sesiones y autentificacin En esta seccin crearemos una forma de autentificacin que puede ser usada en mltiples situaciones Crear una tabla mysql llamada usuarios e insertar un registro. La funcin MD5 encripta el password CREATE TABLE IF NOT EXISTS usuarios ( usuario CHAR(25) NOT NULL, password CHAR(255) NOT NULL ) ENGINE = InnoDB DEFAULT CHARSET = latin1; INSERT INTO usuarios VALUES ('root','bingo'); 0312Sesion.php

La lnea 2 inicia la sesin La lnea 3 checa si esta logeado el usuario. De ser as lo envia a la pgina 0312PaginaSegura.php, en caso contrario al enviar el login y el password ser enviado a la pgina 0312Login.php

<?php session_start(); // Iniciar sesin // Checa, si el usuario esta logeado if (isset($_SESSION['usuario'])) { header('Location: 0312SesionPaginaSegura.php'); } ?> <table border='0'> <form id='forma' name='forma' method='POST' action='0312SesionLogin.php'> <tr><td>Usuario</td><td>:</td><td><input name='usuario' type='text' size='25' maxlength='25'></td></tr> <tr><td>Password</td><td>:</td><td><input name='password' type='password' size='25' maxlength='25'></td></tr> <tr><td></td><td></td><td><input name='login' type='submit' id='login' value='Accesar'></td></tr> </form> </table> L.I. Esteban Snchez Mendoza Pgina 111

Programacin Web 0312SesionLogin.php


Unidad III

En la lnea 4 y 5 se realiza la configuracin de la conexin a la base de datos mysql_real_escape_string Escapa caracteres especiales en una cadena para ser usado en una sentencia SQL para evitar la inyeccin de cdigo SQL La variable de sesin usuario se define si la consulta regresa un nico registro. Si somos usuarios registrados nos envia a la pagna 0312SesionPaginaSegura.php De no ser un usuario registrado la lnea 20 nos envia a la pgina de 0312Sesion.

<?php @session_start(); // Iniciar sessin // Incluir la configuracin para la conexin a la base de datos include('ruta.inc'); $conexion = mysql_connect( $ruta, $login, $password) or die(mysql_error()); mysql_select_db( $db, $conexion ) or die(mysql_error()); $sql = "SELECT * FROM usuarios WHERE (usuario = '"; $sql .= mysql_real_escape_string($_POST['usuario']); $sql .= "') and (password = '" $sql .= mysql_real_escape_string(md5($_POST['password']))."')"; $resultado = mysql_query($sql, $conexion); // Checa el usuario y el password $nr = mysql_num_rows($resultado); mysql_close($conexion); if ($nr == 1) { // Establece la variable de sesin usuario $_SESSION['usuario'] = $_POST['usuario']; // nos envia a la pgina segura header('Location: 0312SesionPaginaSegura.php'); } else { // nos envia a la pgina inicial header('Location: 0312Sesion.php'); } ?>

L.I. Esteban Snchez Mendoza

Pgina 112

Programacin Web 0312SesionPaginaSegura.php


Unidad III

La lnea 2 inicia la sesin La lnea 5 checa que la variable de sesin usuario no exista de ser as lo envia a la pgina 0312Sesion.php -intento indebido de acceso a la pgina-. De existir borra la variable de sesin para evitar accesos posteriores y maneja el cdigo html

<?php session_start(); // Inicia sesin // Si la sesin de usuario no se establece, // esta pgina saltar a pgina de acceso if (!isset($_SESSION['usuario'])) { header('Location: 0312Sesion.php'); } else session_unset('usuario'); //Borra la variable de sesin ?> <html> <head> <title>Pgina segura</title> </head> <body> <p>Esta es una pgina segura con sesiones: <b> <?php echo $_SESSION['usuario']; ?></b> <br>Usted puede poner su informacin restringida aqu.</p> <p><a href="0312SesionLogout.php">Desconectarse</a></p> </body> </html> 0312SesionLogout.php Esta pgina destruye las variables de sesin, la misma sesin y nos reenvia automticamente a la pgina 0312Sesion.php. <?php session_start(); session_unset(); session_destroy(); header('Location: 0312Sesion.php'); ?> L.I. Esteban Snchez Mendoza Pgina 113

Programacin Web

Unidad III

3.10 Conectividad entre el servidor Web y el servidor de base de datos.


PHP puede conectarse con bases de datos de dos formas: mediante el uso directo de funciones propias del intrprete que dependen del gestor de base de datos usadas o a trves del estndar ODBC (Open Data Base Connectivity). En PHP el trabajo con la base de datos se basa en tres etapas fundamentales: 1. Establecer contacto con la base de datos 2. Realizar las operaciones necesarias 3. Cerrar los recursos empleados Conectar con una base de datos MySQL - PHP Para conectarse con una base de datos es necesario crear una conexin con el servidor. Esto se logra en PHP mediante el uso de la funcin mysql_connect() . Sintaxis mysql_connect($ruta, $usuario, $password); Parmetro $ruta $usuario Descripcin Opcional. Especfica el servidor al cual se conecta. El valor por defecto es "localhost:3306". Opcional. Identifica el usuario. El valor por defecto es el nombre de usuario propietario del proceso.

$password Opcional. El valor por defecto es "". No recomendado

ruta invariablemente en un servidor de paga o remoto sera LOCALHOST Ejemplo de conexin de una base de datos MySQL desde PHP

Lnea 6 mediante la funcin mysql_connect nos conectamos al gestor MySQL La funcin mysql_error, devuelve el texto del mensaje de error de la ltima operacin MySQL Pgina 114

L.I. Esteban Snchez Mendoza

Programacin Web

Unidad III Mediante la funcin mysql_select_db seleccionamos la base datos (Lnea 8) mysql_close cierra la conexin a la base de datos (Lnea 10).

<?php $ruta = "localhost"; $login = "mi_login"; $password = "mi_password"; $db = "miBaseDatos"; $conexion = mysql_connect( $ruta, $login, $password) or die(mysql_error()); mysql_select_db( $db, $conexion ) or die(mysql_error()); echo "conectado bravo!!!!!!"; mysql_close($conexion); ?> Crear una base de datos en MySQL - PHP La sentencia CREATE DATABASE es usada para crear una base de datos en MySQL. Su sintaxis es la siguiente: CREATE DATABASE nombre Para generar esta sentencia desde PHP usaremos las siguientes funciones:

La funcin mysql_connect() nos conecta al servidor mysql con los parmetros ruta, login y password. $ruta indica el sitio donde estaran nuestros datos. La ruta localhost funciona regularmente cuando nos conectamos a un servidor instalado en nuestra pc o aun servidor de paga. La funcion mysql_query ejecuta una sentencia SQL. La funcin mysql_close() nos lleva los datos de la memoria principal a un almacenamiento secundario. die muestra el mensaje de error indicado por pantalla y finaliza el script actual en el punto en el que se encuentre. No devuelve valor alguno.

Ejemplo de creacin de una base de datos MySQL desde PHP


mysql_connect (lnea 5) hace una conexin a la base de datos mysql_query (lnea 10) hace una consulta en este caso crea la base de datos. mysql_close (lnea 16) cierra la conexin a la base de datos Pgina 115

L.I. Esteban Snchez Mendoza

Programacin Web <?php include("ruta.inc"); $conexion = mysql_connect($ruta,$usuario, $password); if (!$conexion) { die('Imposible conexin al servidor: '. mysql_error()); } $sentencia = "CREATE DATABASE IF NOT EXISTS prograwe_miBD"; if (mysql_query($sentencia, $conexion)) { echo "Base de datos creada"; } else { echo "Error al crear la base de datos: ".mysql_error(); } mysql_close($conexion); ?>

Unidad III

3.11 Manejo de archivos.


Hasta el momento almacenamos datos en constantes, variables y arreglos este almacenamiento es temporal y se pierde cuando termina la ejecucin del programa. La solucin computacional es almacenar dichos datos en una fuente de almacenamiento secundario como por ejemplo un disco duro o pendrive entre otros medios a fin de que persistan aun despus de la ejecucin del programa que los crea y puedan ser usados inclusive por otros programas. Para lograr esto los datos se almacenan en un recipiente llamado archivo, el procesamiento de archivos es una herramienta invaluable de programacin. Existen diversos tipos de archivos y su descripcin escapa del alcance de este curso.

L.I. Esteban Snchez Mendoza

Pgina 116

Programacin Web

Unidad III

Sin embargo, mis caros y estimados lectores simplemente cualquier cosa almacena en su disco duro o en su pendrive es un archivo. Los archivos que PHP pueden ser secuenciales y binarios. Los archivos secuenciales son archivos de texto y los binarios pueden almacenar grficos y diversos formatos de informacin. Bsicamente responden a las siguientes operaciones bsicas:

abrir borrar cerrar copiar escribir leer renombrar Desde las operaciones bsicas como copiar, mover y eliminar, hasta operaciones que

exigen una cierta complejidad son requeridas para la configuracin de pginas Web. Funcin copy rename unlink Copia un archivo Descripcin Sintaxis copy($origen, $destino)

Cambia el nombre del archivo de $antes a rename($antes, $despues $despues) Borra el archivo unlink($archivo)

Manejo de imagenes A continuacin se presentan dos ejemplos, para mostrar la totalidad de las imagenes de una carpeta. Ejemplo:

La funcin PHP opendir() se encarga de habilitar una ruta a un subdirectorio. La funcin readdir() se encarga de leer un archivo o subdirectorio. strlower() convierte el contenido de una cadena a minscula.

L.I. Esteban Snchez Mendoza

Pgina 117

Programacin Web

Unidad III

substr() extrae una subcadena de una cadena, en este caso por ser el parmetro negativo extrae los ltimos cuatro carcteres (lnea 10). El objetivo es extraer la extensin del archivo. closedir() cierra la ruta al subdirectorio.

<?php if ($gestor = opendir('../imagenes')) { // Abre un gestor de directorios echo "<table border=1 align='center'>"; echo "<tr>"; $i=0; while (false !== ($archivo = readdir($gestor))) { //readdir: Lee un elemento del directorio //$gestor abierto previamente //con opendir y desplaza el puntero al elemento siguiente if ($archivo != "." and $archivo != "..") { //checa que no sea subdirectorio $extension = strtolower(substr($archivo, -4)); //strlower pasa a minuscula una cadena en este caso //los 4 ltimos caracteres //de la cadena if (($extension == '.jpg') or ($extension == '.gif') or ($extension == '.png')) { if ($i==4) {// Cuatro imagenes por rengln $i=0; echo "</tr>"; echo "<tr>"; } $i++; echo "<td>"; echo "<a href='../imagenes/$archivo'>"; echo "<img src='../imagenes/$archivo'"; echo "border='0' ></a>"; echo "</td>"; } } } echo "</tr>"; echo "</table>"; closedir($gestor); //Cierra el gestor } ?>

L.I. Esteban Snchez Mendoza

Pgina 118

Programacin Web Ejemplo:

Unidad III

La funcin glob() realiza una bsqueda por todos los nombres de ruta que coincidan con cierto patrn. En este caso con los grficos validos para html. sort() ordena los nombres de los archivos encontrados. el ciclo foreach recorre el arreglo de archivos.

<?php echo "<table border=1 align='center'>"; echo "<tr>"; $i = 0; //carga las imagenes de la carperta //La funcin glob() realiza una bsqueda por todos los nombres //de ruta que coincidan con patrn $ruta = "../imagenes/"; $imagenes = glob($ruta . "{*.jpg, *.gif, *.png}", GLOB_BRACE); sort($imagenes); //Recorre el vector foreach($imagenes as $foto){ if ($i==4) { $i=0; echo "</tr>"; echo "<tr>"; } $i++; echo "<td><a href='".$foto."'><img src='".$foto."/></a></td>"; } echo "</tr>"; echo "</table>"; ?>

L.I. Esteban Snchez Mendoza

Pgina 119

Programacin Web

Unidad III

Para el siguiente ejemplo usaremos 4 funciones bsicas de manipulacin de archivos Funcin filesize fopen Descripcin Obtiene el tamao del archivo Abre un archivo y le asigna un identificador id. Sintaxis filesize($archivo); $id = fopen($archivo, $modo);

Lee completamente el archivo y lo muestra. El cierre fpassthru del archivo es automtico al terminar el volcado del fpassthru($id); archivo. Permite modificar las cabeceras que enva el servidor al navegador. Estas cabeceras, que siguen el protocolo HTTP, es la primera informacin que recibe header("mensaje"); el navegador en cada peticin que realiza, antes que el contenido del archivo.

header

Ejemplo: Mostrar una imagen fopen adems de abrir un archivo, obtiene un apuntador a su contenido. fopen solo debe usarse para abrir un archivo cuyo contenido vamos a manipular. Si unicamente queremos recuperar su contenido (y por ejemplo mostrarlo en pantalla), hay otras funciones mas adecuadas. Los modos en los que se puede abrir un archivo son:

r Slo lectura. El puntero al comienzo del archivo r+ Lectura y escritura; apuntador al inicio del archivo w Slo escritura, si no existe el archivo lo crea, si existe lo convierte en archivo de longitud cero y el apuntador se coloca en el inicio (sobreescribe el contenido, vamos) w+ Lectura y escritura, si existe lo trunca a tamao cero, y se situa al inicio, si no existe lo crea a Modo append, slo escritura, si no existe lo crea. Si existe, el apuntador se coloca al final del archivo (listo para escribir a continuacion del contenido) a+ Modo append, lectura y escritura, si no existe lo crea; apuntador al final del archivo b es un flag adicional a cualquiera de los anteriores que indica que vamos a operar sobre un archivo binario (en contraposicion a archivo de texto) como una imagen o un sonido. En Pgina 120

L.I. Esteban Snchez Mendoza

Programacin Web

Unidad III

algunos sistemas operativos como linux no existe esta diferencia asi que el indicador b ser ignorado. Las lneas 7 y 8 envan cabeceras HTTP para indicar el tamao y formato del archivo. fpassthru (lnea 11) hace un volcado del archivo previamente definido en la lnea 4. <?php // Abree el archivo en modo binario $imagen = '../imagenes/Shakira02.png'; $id = fopen($imagen, 'rb'); // Envia las cabeceras header('Content-Type: image/png'); header('Content-Length: ' . filesize($imagen)); // imprime el archivo y detiene el script fpassthru($id); exit; ?>

Una versin reducida de este cdigo lo podemos encontrar en: La funcin file_get_contents (lnea 4) permite leer el contenido de un archivo en una cadena. <?

header( "Content-type: image/png"); $archivo = '../imagenes/Shakira02.png'; $imagen = file_get_contents($archivo); echo $imagen; ?> Leer un archivo de texto

En la lnea 2 se genera un apuntador al archivo alumnos.txt La funcin feof (lnea 4) comprueba si se encuentra el fin del archivo La funcin fgets lee el contenido de un archivo hasta encontrar el fin de lnea (lnea 4) fclose (lnea 5) cierra el apuntador

L.I. Esteban Snchez Mendoza

Pgina 121

Programacin Web

Unidad III

<?php $archivo = fopen('0310alumnos.txt', 'r'); //Imprime una linea hasta que el //final del archivo es encontrado while(!feof($archivo)) { echo fgets($archivo)."<br />"; } fclose($archivo); ?> Otra forma de hacerlo es mediante la funcin fread (lnea 6) la cual lee el contenido de un archivo. <?php // obtiene el contenido de un archivo en //una cadena $archivo = '0310alumnos.txt'; $id = fopen($archivo, 'r'); $contenido = fread($id, filesize($archivo)); echo $contenido; fclose($id); ?> Contador de visitas

file_exists comprueba si un archivo existe (lnea 2) La lnea 9 y 12 crean un puntero al archivo La lnea 13 recupera el nmero de visitantes La lnea 14 incrementa en uno el nmero de visitantes o reinicia la cuenta si el archivo no tiene el dato. fputs guarda la informacin en el archivo Las lneas 21 al 21 imprimen el nmero de visitantes mediante imagenes de los dgitos fclose (lnea 25) cierra el apuntador ysalva el contenido del archivo.

L.I. Esteban Snchez Mendoza

Pgina 122

Programacin Web <?php /******************************************************** * Contador de visitas programado en PHP *************** * Modificado Jose Evaristo Pacheco Velasco ******* * Mas utilidaddes para webmsters en www.desenredate.com ********************************************************/ $destino = '0310visitante.dat'; if (!file_exists($destino)) { // si el archivo no existe lo crea $abrir = fopen($destino, 'w'); $cuenta = ''; } else { $abrir = fopen($destino,'r'); $cuenta = trim(fread($abrir,filesize($destino))); } if ($cuenta != '') $cuenta++; else $cuenta = 1; fclose($abrir); $abrir = fopen($destino,'w'); fputs($abrir, $cuenta); echo "<p align='center'>Eres el visitante:</p>"; // Imprime contador for($i = 0; $i < strlen($cuenta); $i++) { $imagen = substr($cuenta, $i, 1); $contador .= "<img alt='$imagen ' src='$imagen.gif'>"; } fclose($abrir); echo "<p align='center'> $contador </p>"; ?>

Unidad III

3.12 Seguridad.
La seguridad y funcionamiento sin duda uno de los temas ms importantes al desarrollar un portal web. La validacin de datos, es por tanto fundamental. El no cuidarnos de esto, puede traernos problemas de inyeccin SQL, CrossScripting, Cookie Poisoning, amenazas de seguridad en la nube (Cloud Computing) y un largo etc, etc, que compromete la estabilidad del sitio y el recurso ms valioso de nuestro sitio "la informacin". El filtrado de datos es una de las piedras angulares en cualquier aplicacin en el tema de seguridad, independientemente del lenguaje con el cual se desarrolle.

L.I. Esteban Snchez Mendoza

Pgina 123

Programacin Web

Unidad III

L.I. Esteban Snchez Mendoza

Pgina 124

Programacin Web Filtrado de datos

Unidad III

Una de las mayores fortalezas de PHP es su facilidad de uso. Lamentablemente, este mismo beneficio se usa en contra de PHP, programadores con poca experiencia olvidan usar medidas de seguridad o carecen de los conocimientos para generar una clase que valide los datos introducidos por los usuarios finales.

Se han desarrollado diversas clases de validacin, algunas mejores que otros, con igual o mayor nmero de mtodos para hacer la misma tarea estas no estan estandarizadas. PHP versin 5 proporciona la extensin Filter cuyo objetivo es realizar esta tarea en forma sencilla, robusta y la estandarizacin de la entrada de datos del usuario. Las funciones base se presentan a continuacin.

Funcin

Descripcin

filter_has_var Verifica si la variable del tipo especificado existe filter_list filter_var Devuelve una lista de todos los filtros soportados Filtra una variable con un filtro especfico. Devuelve los datos filtrados, o FALSE si el filtro falla.

filter_input

Obtiene una variable desde afuera de PHP y opcionalmente la filtra

Ejemplo de filter_has_var La sintaxis es: filter_has_var(tipo, variable)


Parmetro tipo Descripcin Requerido. especfica el tipo que deseamos checar. Los posibles tipos son:

L.I. Esteban Snchez Mendoza

Pgina 125

Programacin Web
Parmetro

Unidad III
Descripcin INPUT_GET INPUT_POST INPUT_COOKIE INPUT_SERVER INPUT_ENV

variable

Requerida. Especfica la variable que deseamos checar

El objetivo del ejemplo es tratar de frenar invasiones a la seguridad asegurandonos que no introduzcan datos mediante la URL. Este mtodo no es infalible contra la inyeccin de cdigo SQL, pero es una aproximacin.. <?php if(!filter_has_var(INPUT_POST, 'login') or !filter_has_var(INPUT_POST, 'key')) { echo('Sin Peligro'); } else die('Por aqu no entras'); ?> Mediante la funcin filter_list es posible recuperar la lista de filtros soportados por nuestro servidor y con filter_id recuperados el inditificador del filtro.

Ejemplo del uso de filter_list y filter_id.


La lnea 5 recorre el vector filter_list La lnea 6 imprime el nombre del filtro extraido en la lnea 5 la lnea 7 imprime el id del filtro

<body> <table> <tr><td>Nombre del Filtro</td><td>ID</td></tr> <?php foreach( filter_list() as $id =>$filter) { echo "<tr><td>".$filter.'</td><td>'; echo filter_id($filter).'</td></tr>'."\n"; } ?> </table> </body> L.I. Esteban Snchez Mendoza Pgina 126

Programacin Web

Unidad IV

PROCESAMIENTO DEL LADO DEL CLIENTE


4.1 Lenguaje Script del cliente.
El navegador es una especie de aplicacin capaz de interpretar las rdenes recibidas en forma de cdigo HTML fundamentalmente y convertirlas en las pginas que son el resultado de dicha orden.

Cuando nosotros pinchamos sobre un enlace hipertexto, en realidad lo que pasa es que establecemos una peticin de un archivo HTML residente en el servidor (un ordenador que se encuentra continuamente conectado a la red) el cual es enviado e interpretado por nuestro navegador (el cliente).

L.I. Esteban Snchez Mendoza

Pgina 127

Programacin Web

Unidad IV

As pues, podemos hablar de lenguajes de lado servidor que son aquellos lenguajes que son reconocidos, ejecutados e interpretados por el propio servidor y que se envan al cliente en un formato comprensible para l. Por otro lado, los lenguajes de lado cliente (entre los cuales no slo se encuentra el HTML sino tambin el Java y el JavaScript los cuales son simplemente incluidos en el cdigo HTML) son aquellos que pueden ser directamente "digeridos" por el navegador y no necesitan un pretratamiento.

Cada uno de estos tipos tiene por supuesto sus ventajas y sus inconvenientes. As, por ejemplo, un lenguaje de lado cliente es totalmente independiente del servidor, lo cual permite que la pgina pueda ser albergada en cualquier sitio sin necesidad de pagar ms ya que, por regla general, los servidores que aceptan pginas con scripts de lado servidor son en su mayora de pago o sus prestaciones son muy limitadas. Inversamente, un lenguaje de lado servidor es independiente del cliente por lo que es mucho menos rgido respecto al cambio de un navegador a otro o respecto a las versiones del mismo.

L.I. Esteban Snchez Mendoza

Pgina 128

Programacin Web

Unidad IV

Lenguajes 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. Elel lenguaje consta de etiquetas que tienen esta forma <B> o <P>. Cada etiqueta significa una cosa, por ejemplo <B> significa que se escriba en negrita (bold) o <P> significa un prrafo, <A> es un enlace, etc. Casi todas las etiquetas tienen su correspondiente etiqueta de cierre, que indica que a partir de ese punto no debe de afectar la etiqueta. Por ejemplo </B> se utiliza para indicar que se deje de escribir en negrita. As que el HTML no es ms que una serie de etiquetas que se utilizan para definir la forma o estilo que queremos aplicar a nuestro documento. <B>Esto est en negrita</B>. Esta pgina es un claro ejemplo de uso del HTML. JAVASCRIPT

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. Las sentencias escritas en javascript se encapsulan entre las etiquetas <script> y </script>. por ejemplo, si en el cdigo de una pgina Web incluimos la sentencia <script> window.alert("Bienvenido a mi sitio web. Gracias...") </script> al abrir la pgina con el navegador se nos mostrar una ventana de bienvenida APPLETS DE JAVA L.I. Esteban Snchez Mendoza Pgina 129

Programacin Web

Unidad IV

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 precompilados, 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 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 inspirados 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 L.I. Esteban Snchez Mendoza Pgina 130

Programacin Web reducida del primero.

Unidad IV

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

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 tuvieramos que catalogarlo en algn sitio quedara dentro del mbito de las pginas dinmicas de cliente. Para visualizar las "pelculas" Flash, nuestro navegador debe tener instalado un programita (plug-in) que le permita visualizarlas. CSS

CSS, 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. CSS son las siglas de Cascading Style Sheets, en espaol Hojas de estilo en Cascada.

L.I. Esteban Snchez Mendoza

Pgina 131

Programacin Web

Unidad IV

4.2 Modelo de objetos con lenguaje Script.


Qu es el DOM? El DOM es una jerarqua de objetos predefinidos que describen los elementos de la pgina web que est mostrando el navegador, as como otras caractersticas del proceso de navegacin (como son el historial, el tamao de la ventana de navegacin o el contenido de la barra de estado del navegador). Si no se est familiarizado con la programacin orientada a objetos, el concepto de objeto puede resultar algo difuso. Un objeto es, en el fondo, un conjunto de variables y funciones que acta sobre dichas variables, encapsuladas en un mismo paquete. El acceso a las funciones y a las variables se realiza mediante una interfaz bien definida que aisla al programador de la necesidad de conocer cmo estn implementadas internamente dichas funciones. De este modo, la programacin orientada a objetos resulta muy intuitiva, y ms prxima al conocimiento humano. Veamos un ejemplo sencillo. En JavaScript, para escribir un mensaje en un cuadro de dilogo utilizamos: window.alert("Hola mundo!")

L.I. Esteban Snchez Mendoza

Pgina 132

Programacin Web

Unidad IV

Si bien no conocemos como funciona internamente la funcin alert(), sabemos cmo invocarla. La abstraccin es tal que nos basta con saber que se trata de una funcin del objeto window. A estas funciones se las llama mtodos, y a las variables propiedades. 3. Compatibilidad entre los DOMs Aunque puede parecer paradigmtico, actualmente no existe una gran diferencia entre el soporte de JavaScript que ofrecen los fabricantes de los dos navegadores dominantes, Netscape Navigator y Microsoft Internet Explorer. Lo que verdaderamente les diferencia es el Modelo e Objetos de Documento que incorporan. De hecho, el DOM podra considerarse algo independiente del propio lenguaje de scripts. Esta es la idea recogida en el esfuerzo del W3C (World Wide Web Consortium) por obtener un estndar par el Modelo de Objetos de Documento. El estndar, que est an en desarrollo, se divide en 3 partes: DOM Nivel 1 Core (definiciones fundamentales) DOM Nivel 1 HTML DOM Nivel 1 XML Si este estndar triunfa y tanto Netscape como Microsoft se adhieren a l, el futuro de los scripts para la red ser mucho ms difano, al desaparecer las incompatibilidades entre los diferentes navegadores (pensemos, por ejemplo, en lo costoso que resulta realizar diferentes versiones de un mismo cdigo para que sea ejecutable por todos los navegadores). 4. El DOM segn Netscape El Modelo de Objetos de Documento que propone Netscape en sus versiones 4.x del Navigator resultaba suficiente cuando el DHTML era slo una idea. Sin embargo, ahora que es ya una realidad, el DOM de IE 4.x/5.x de Microsoft resulta mucho ms potente y verstil. No debe extraarnos, por tanto, que el futuro estndar del W3C se aproxime al de Microsoft. La futura nueva versin del Navigator (bautizca como Netscape 6) soportar el DOM estndar del W3C.

L.I. Esteban Snchez Mendoza

Pgina 133

Programacin Web

Unidad IV

Realmente el DOM del Navigator 4.x es un subconjunto del DOM del IE 4.x/5.x. Esto es lo que hace que el Navigator presente limitaciones importantes en su capacidad de acceder a ciertos elementos de una pgina y de modificar sus propiedades. El siguiente esquema muestra el DOM del Netscape Navigator 4.x:

Para establecer una comparacin, mostramos a continuacin el DOM de Microsoft (aunque slo hasta un segundo nivel). En este esquema hemos marcado los objetos comunes con Netscape en color verde, y los que slo soporta Netscape en azul.

L.I. Esteban Snchez Mendoza

Pgina 134

Programacin Web

Unidad IV

5. Acceso a los elementos del modelo Para acceder a una propiedad de un objeto del modelo se utiliza la siguiente nomenclatura:
nombre_objeto.nombre_propiedad

Para acceder a un mtodo, se utiliza una sintaxis similar:


nombre_objeto.nombre_metodo()

L.I. Esteban Snchez Mendoza

Pgina 135

Programacin Web

Unidad IV

Entre parntesis se le pasan al mtodo los argumentos necesarios para su ejecucin. Un objeto de JavaScript es, bsicamente un array. Esto quiere decir que es posible acceder a las propieades del objeto utilizando tambin la sintxis siguiente:
nombre_objeto["nombre_propiedad"]

Si observamos el DOM de la figura anterior, todos los objetos dependen jerrquicamente del objeto window. Para acceder al objeto document, sera necesario usar siempre la sintaxis window.document. Sin embargo, en JavaScript el objeto window es el objeto por defecto, de modo que puede omitirse.

4.3 Objetos lenguaje Script nter construidos.


String Object: Permite hacer diversas manipulaciones con las cadenas. Math Object: Posee atributos y mtodos asociados a las constantes y funciones matemticas. Date Object: Permiten la manipulacin de datos que representen fechas. Array Object: Nos da la facilidad de construir arreglos cuyos elementos pueden contener cualquier tipo bsico, y cuya longitud se modificar de forma dinmica siempre que aadamos un nuevo elemento. Boolean Object: Nos permite crear booleanos, esto es, un tipo de dato que es cierto o falso, tomando los valores true o false. Number Object: Representa el tipo de dato nmero.

L.I. Esteban Snchez Mendoza

Pgina 136

Programacin Web

Unidad IV

4.4 Eventos con lenguaje Script.


Eventos con lenguaje script Un evento es el resultado de la interaccin entre un usuario con algn elemento de la interfaz grfica que se le presenta. Por ejemplo Hacer clic sobre un botn, cambiar el contenido de un campo de texto o mover el apuntador del ratn sobre un enlace. Los eventos se pueden capturar de varias formas, aunque se recomienda asociar un manejador del evento al objeto a capturar el evento. Para cada tipo de evento hay que tener en mente tres elementos: quin lo genera, cundo ocurre y cul es el manejador de eventos que se debe utilizar.

4.5 Validacin de entrada de datos del lado del cliente.


La validacin del lado del cliente mejora el uso del formulario Web comprobando la entrada de datos del usuario mientras se produce. Al comprobar si se generan errores mientras se introducen, la validacin del lado del cliente permite detectar errores antes de que el formulario Web sea enviado, evitando as el viaje de ida y vuelta necesario para la validacin del lado del servidor. Por ejemplo, sirve para avisarle al usuario que el campo de email que acaba de llenar no contiene una direccin de email vlida. Tambin permite avisar si falta rellenar campos o que se estn utilizando caracteres no vlidos, etc.

L.I. Esteban Snchez Mendoza

Pgina 137

Programacin Web

Unidad IV

4.6 Consideraciones del soporte del navegador.


En la actualidad, la mayor parte de los navegadores son muy verstiles ya que permiten que el usuario los configure y personalice a su gusto, adems, suelen incluir otras funcionalidades como servir de cliente de correo electrnico y de noticias, cliente de IRC (chat), etc. A los navegadores tambin se les pueden agregar plug-ins (agregados) para mejorar y aumentar sus capacidades e, incluso, con unas cuantas lneas de cdigo se puede crear un navegador propio. Sin embargo, como se ha afirmado anteriormente, hay que poner especial cuidado en la utilizacin de elementos no estandarizados de forma general, ya que no todos los navegadores soportan determinados lenguajes o componentes como Java, JavaScripts, marcos, hojas de estilo CSS, DOM (Document Object Model), etc. Debido a esto ltimo, debemos considerar que tipo de aplicaciones y componentes deber soportar el navegador, para ajustarse a las propias necesidades, antes de elegir uno en especfico <html> <head> <link href='basico.css' rel='stylesheet' type='text/css' /> </head <body> <script type='text/javascript'> function cliente() { var navegador = 'Desconocido'; if (navigator.userAgent.toLowerCase().indexOf('safari') > -1 ) navegador = 'Safari'; else if (navigator.userAgent.toLowerCase().indexOf('chrome') > -1) navegador = 'Chrome' else if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1 ) navegador = 'Firefox' else if ('\v'=='v') navegador = 'Internet Explorer' else if (/Opera[\/\s](\d+\.\d+)/.test(navigator.userAgent)) navegador = 'Opera' else if (window.external && typeof window.XMLHttpRequest == 'undefined') navegador = 'Internet Explorer 6'; return navegador; } function idioma() { var idiomaNavegador = new String; if (navigator.language) { idiomaNavegador = navigator.language; } else { idiomaNavegador = navigator.browserLanguage; } return idiomaNavegador; } document.write('<table class="tabla">'); L.I. Esteban Snchez Mendoza Pgina 138

Programacin Web

Unidad IV

document.write('<tr><td>Cdigo del navegador : </td><td>' + navigator.appCodeName + '</td></tr>'); document.write('<tr><td>Nombre del navegador: </td><td>' + cliente() + '</td></tr>'); document.write('<tr><td>Lenguaje: </td><td>' + idioma() + '</td></tr>'); document.write('<tr><td>Versin del navegador: </td><td>' + navigator.appVersion + '</td></tr>'); document.write('<tr><td>Cookies activados: </td><td>' + navigator.cookieEnabled + '</td></tr>'); document.write('<tr><td>Plataforma: </td><td>' + navigator.platform + '</td></tr>'); document.write('<tr><td>User-agent header: </td><td>' + navigator.userAgent); document.write('</td></tr></table>'); </script> </body> </html>
http://tuto-mpweb.webcindario.com/indice.html

L.I. Esteban Snchez Mendoza

Pgina 139

Unidad V. Servicios Web XML

Objetivo:

Integrara los Servicios Web XML al desarrollo de aplicaciones.

Programacin Web

Unidad V.

5. Servicios web XML. 5.1 Visin general de servicios Web XML


Un Servicio Web es una coleccin de protocolos y estndares que sirven para intercambiar datos entre aplicaciones. Distintas aplicaciones de software desarrolladas en lenguajes de programacin diferentes, y ejecutadas sobre cualquier plataforma, pueden utilizar los servicios web para intercambiar datos en redes de ordenadores como Internet. Interoperabilidad de los Servicios Web. La interoperabilidad se consigue mediante la adopcin de estndares abiertos. Las organizaciones OASIS y W3C son los comits responsables de la arquitectura y reglamentacin de los servicios Web. Para mejorar la interoperabilidad entre distintas implementaciones de servicios Web se ha creado el organismo WS-I, encargado de desarrollar diversos perfiles para definir de manera ms exhaustiva estos estndares.

5.2 Tecnologas subyacentes.


Estndares empleados en los Servicios Web: Web Services Protocol Stack: conjunto de servicios y protocolos de los servicios Web. XML (Extensible Markup Language): Es el formato estndar para los datos que se vayan a intercambiar. SOAP (Simple Object Access Protocol) o XML-RPC (XML Remote Producer Call): Protocolos sobre los que se establece el intercambio. Otros protocolos: los datos en XML tambin pueden enviarse de una aplicacin a otra mediante protocolos normales como HTTP (Hypertext Transfer Protocol), FTP (File Transfer Protocol), o SMTP (Simple Mail Transfer Protocol).

L.I. Esteban Snchez Mendoza

Pgina 140

Programacin Web

Unidad V. WSDL (Web Services Description Languages): Es el lenguaje de la interfaz pblica para los servicios Web. Es una descripcin basada en XML de los requisitos funcionales necesarios para establecer una comunicacin con los servicios Web. UDDI (Universal Description, Discovery and Integration): Protocolo para publicar la informacin de los servicios Web. Permite a las aplicaciones comprobar qu servicios web estn disponibles.

WS-Security (Web Service Security): Protocolo de seguridad aceptado como estndar por OASIS (Organization for the Advancement of Structured Information Standards). Garantiza la autenticacin de los actores y la confidencialidad de los mensajes enviados.

5.2.1 SOAP.
SOAP (siglas de Simple Object Access Protocol) es un protocolo estndar que define cmo dos objetos en diferentes procesos pueden comunicarse por medio de intercambio de datos XML. Este protocolo deriva de un protocolo creado por David Winer en 1998, llamado XML-RPC. SOAP fue creado por Microsoft, IBM y otros y est actualmente bajo el auspicio de la W3C. Es uno de los protocolos utilizados en los servicios Web. Los desarrolladores de aplicaciones hoy en da, pueden utilizar la infraestructura de correo electrnico de Internet para transmitir mensajes SOAP ya sean como mensajes de correo electrnico de texto o como adjuntos. Los ejemplos que se muestran a continuacin muestran un modo de transmitir mensajes SOAP, y deben ser tomados como el modo estndar de hacerlo. Como ejemplo se muestra la forma en que un cliente solicitara informacin de un producto a un proveedor de servicios Web:

L.I. Esteban Snchez Mendoza

Pgina 141

Programacin Web

Unidad V.

<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"> <soap:Body> <getProductDetails xmlns="http://warehouse.example.com/ws"> <productId>827635</productId> </getProductDetails> </soap:Body> </soap:Envelope> Y esta sera la respuesta del proveedor: <soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"> <soap:Body> <getProductDetailsResponse xmlns="http://warehouse.example.com/ws"> <getProductDetailsResult> <productName>Toptimate 3-Piece Set</productName> <productId>827635</productId> <description>3-Piece luggage set. Black Polyester.</description> <price>96.50</price> <inStock>true</inStock> </getProductDetailsResult> </getProductDetailsResponse> </soap:Body> </soap:Envelope>

L.I. Esteban Snchez Mendoza

Pgina 142

Programacin Web

Unidad V.

A pesar de no ser la nica opcin posible, HTTP fue elegido como protocolo de transporte por sus ventajas, para lidiar con cortafuegos, por ejemplo. Otros protocolos como GIOP/IIOP o DCOM (utilizados en CORBA, RMI y DCOM) suelen ser repelidos por estos cortafuegos.

5.2.2 WSDL.
WSDL son las siglas de Web Services Description Language, un formato XML que se utiliza para describir servicios Web (algunas personas lo leen como wisdel). La versin 1.0 fue la primera recomendacin por parte del W3C y la versin 1.1 no alcanz nunca tal estatus. La versin 2.0 se convirti en la recomendacin actual por parte de dicha entidad. WSDL describe la interfaz pblica a los servicios Web. Est basado en XML y 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. Las operaciones y mensajes que soporta se describen en abstracto y se ligan despus al protocolo concreto de red y al formato del mensaje. As, WSDL se usa a menudo en combinacin con SOAP y XML Schema. Un programa cliente que se conecta a un servicio web puede leer el WSDL para determinar qu funciones estn disponibles en el servidor. Los tipos de datos especiales se incluyen en el archivo WSDL en forma de XML Schema. El cliente puede usar SOAP para hacer la llamada a una de las funciones listadas en el WSDL. El WSDL nos permite tener una descripcin de un servicio web. Especifica la interfaz abstracta a travs de la cual un cliente puede acceder al servicio y los detalles de cmo se debe utilizar. Como vemos, la estructura del WSDL tiene los siguientes elementos: Tipos de Datos. <types>: Esta seccin define los tipos de datos usados en los mensajes. Se utilizan los tipos definidos en la especificacin de esquemas XML.

L.I. Esteban Snchez Mendoza

Pgina 143

Programacin Web Mensajes.

Unidad V.

<message>: Aqu definimos los elementos de mensaje. Cada mensaje puede consistir en una serie de partes lgicas. Las partes pueden ser de cualquiera de los tipos definidos en la seccin anterior. Tipos de Puerto. <portType>: Con este apartado definimos las operaciones permitidas y los mensajes intercambiados en el Servicio. Bindings. <binding>: Especificamos los protocolos de comunicacin usados. Servicios. <service>: Conjunto de puertos y direccin de los mismos. Esta parte final hace referencia a lo aportado por las secciones anteriores. Con estos elementos no sabemos qu hace un servicio pero si disponemos de la informacin necesaria para interactuar con l (funciones, mensajes de entrada/salida, protocolos...). A continuacin se muestra un ejemplo de un documento WSDL y sus diferentes secciones. En este ejemplo concreto se implementa un servicio que muestra a partir del nombre de un valor burstil su valor actual en el mercado.

L.I. Esteban Snchez Mendoza

Pgina 144

Programacin Web

Unidad V.

L.I. Esteban Snchez Mendoza

Pgina 145

Programacin Web

Unidad V.

5.2.3 UDDI.
UDDI (Universal Description Discovery and Integration) lenguaje de marcado extensible (XML) basado en el registro de empresas de todo el mundo se lista en la Internet y un mecanismo para registrar y localizar servicios web de aplicaciones. UDDI es una iniciativa de la industria abierta, patrocinado por la Organizacin para el Avance de Estndares de Informacin Estructurada ( OASIS ), permitiendo a las empresas a publicar los servicios y descubrir entre s y definen cmo los servicios o aplicaciones de software interactan a travs de Internet. Un registro de empresas UDDI consta de tres componentes: Pginas blancas - direccin, contacto, y los identificadores conocidos; Pginas Amarillas - categorizaciones basadas en el estndar industrial taxonomas ; Pginas verdes - informacin tcnica acerca de los servicios expuestos por la empresa.

Pginas Blancas. Pginas blancas dan informacin sobre el negocio de prestacin del servicio. Esto incluye el nombre de la empresa y una descripcin de la empresa - posiblemente en varios idiomas. Con esta informacin, es posible encontrar un servicio del que ya se conocen algunos datos (por ejemplo, la localizacin de un servicio basado en el nombre del proveedor). Informacin de contacto de la empresa es tambin disponible - por ejemplo, la direccin de empresas y nmero de telfono y otra informacin como el nmero de Dun & Bradstreet Sistema Universal de Numeracin. Pginas Amarillas. Pginas amarillas proporcionan una clasificacin de los servicios o de negocios, basado en las taxonomas estndar. Estos incluyen la Clasificacin Industrial Uniforme (SIC), la Industria Norteamericana del Sistema de Clasificacin (SCIAN), o el de las Naciones Unidas estndar Cdigo de Productos y Servicios (UNSPSC).

L.I. Esteban Snchez Mendoza

Pgina 146

Programacin Web

Unidad V.

Debido a que una sola empresa puede ofrecer una serie de servicios, puede haber varias pginas amarillas (cada uno describe un servicio) asociado con una pgina blanca (con informacin general acerca de la empresa). Pginas Verdes. Pginas verdes se utilizan para describir la forma de acceder a un servicio web, con informacin sobre los enlaces de servicio. Parte de la informacin est relacionada con el servicio de Web - tales como la direccin del servicio y los parmetros y las referencias a las especificaciones de las interfaces. Otro tipo de informacin no se relaciona directamente con el Servicio Web - lo que incluye correo electrnico, FTP, CORBA y los detalles de telfono para el servicio. Debido a un servicio Web puede tener varios enlaces (como se define en su descripcin WSDL), un servicio puede tener mltiples Pginas Verdes, que cada enlace se necesita tener acceso de otra manera.

5.3 Publicacin de un servicio web.


La implementacin de un servicio Web incluye copiar en el servidor Web el archivo .asmx y los ensamblados utilizados por el servicio Web, pero que no forman parte de Microsoft .NET Framework. Por ejemplo, suponga que tiene un servicio Web denominado StockServices. Para implementar este servicio, crea un directorio virtual en el servidor Web y coloca el archivo .asmx del servicio Web en dicho directorio. El directorio virtual puede ser tambin una aplicacin Web de los Servicios de Internet Information Server (IIS), aunque no es necesario. A continuacin se ilustra la estructura de directorios de una implementacin tpica: \Inetpub \Wwwroot \StockServices StockServices.asmx \Bin

L.I. Esteban Snchez Mendoza

Pgina 147

Programacin Web

Unidad V.

Ensamblados que utiliza el servicio Web y que no forman parte de Microsoft .NET Framework. Elementos publicados con un servicio Web. Al publicar un servicio Web, se implementan los siguientes elementos en un servidor Web. Elemento Directorio de aplicacin Web Descripcin Acta como directorio raz del servicio Web. Los dems archivos se colocan en este directorio. El directorio debe tener el indicador de aplicacin Web de IIS. Acta como la direccin URL base para los clientes que llamen al servicio Web. El nombre del archivo puede ser cualquier nombre de archivo vlido. (Opcional) Acta como mecanismo de descubrimiento para el servicio Web. El archivo .disco no se crea automticamente para un servicio Web. Para obtener informacin sobre la creacin de un archivo de descubrimiento para el servicio Web, vea Cmo habilitar el descubrimiento para servicios Web XML. El nombre del archivo puede ser cualquier nombre de archivo vlido. (Opcional) Si debe reemplazar los valores predeterminados de configuracin, puede incluir un archivo Web.config. Los servicios Web utilizan el archivo de configuracin para permitir la personalizacin y extensibilidad del sistema. Por ejemplo, puede suministrar un archivo Web.config especfico del servicio Web si se requiere autenticacin para el servicio, pero no para otras aplicaciones Web del sistema. Contiene los archivos binarios del servicio Web. Si la clase del servicio Web no se encuentra en el archivo .asmx, el ensamblado que contiene la clase debe estar en el directorio \Bin.

Archivo <MyXMLWebService>.asmx Archivo <MyXMLWebService>.disco

Archivo Web.config

Directorio \Bin

5.4 Consumo de un servicio web.


Una vez que disee y distribuya un servicio web XML en un servidor, cualquier persona podra llegar y beneficiarse con su funcionalidad. Suponiendo que el desarrollador de un sitio web bancario quiere usar uno de esos servicios para hacer clculos de inters para los certificados de depsito. Su aplicacin bancaria deber usar o

L.I. Esteban Snchez Mendoza

Pgina 148

Programacin Web

Unidad V.

consumir su servicio, es decir, acceder y utilizar los mtodos disponibles de un servicio web XML. Los visitantes del sitio pueden usar la calculadora sin siquiera saber de dnde provino. Cuando va a una gasolinera, los encargados le dan un servicio. Por ello usted es el consumidor del servicio. Puede aprovechar cualquier recurso que la gasolinera le ofrezca, como la bomba de gasolina, el tiempo y servicio de los encargados, as como otros elementos. Esto le ahorra el problema de crear su propia bomba de gasolina o de dar servicio a su propio automvil. El consumidor de un servicio web XML puede hacer exactamente lo mismo. Visita un servicio y consume los recursos disponibles. Su equipo podra acceder a un servicio para el procesamiento de textos, por poner un ejemplo. Todas las caractersticas de este servicio estaran disponibles para usted, y no tendra que adquirir e instalar un procesador de textos. El consumidor de un servicio web XML puede ser casi cualquier aplicacin de escritorio, una pgina ASP.NET o un dispositivo mvil con un telfono porttil. Hay 3 etapas para consumir un servicio web xml: Obtener informacin del servicio (descubrimiento). Generar un proxy o intermediario para el servicio. Usar el proxy para invocar los servicios disponibles.

El descubrimiento es el proceso por el que un cliente encuentra informacin de un servicio web xml. Por ejemplo, cuando va a un restaurante, primero lee el men para ver que ofrecen. Los consumidores hacen lo mismo con los servicios web XML necesitan saber qu hace un servicio antes de usarlo.

L.I. Esteban Snchez Mendoza

Pgina 149

Programacin Web El proxy funge como intermediario entre un cliente y un servicio

Unidad V.

Pasos para consumir un servicio web XML

Conclusin. La principal razn para usar servicios Web es que se pueden utilizar

con HTTP sobre TCP (Transmission Control Protocol) en el puerto 80. Dado que las organizaciones protegen sus redes mediante firewalls -que filtran y bloquean gran parte del trfico de Internet-, L.I. Esteban Snchez Mendoza Pgina 150

Programacin Web

Unidad V.

cierran casi todos los puertos TCP salvo el 80, que es, precisamente, el que usan los navegadores. Los servicios Web utilizan este puerto, por la simple razn de que no resultan bloqueados. Es importante sealar que los servicios web se pueden utilizar sobre cualquier protocolo, sin embargo, TCP es el ms comn. Una segunda razn por la que los servicios Web son muy prcticos es que pueden aportar gran independencia entre la aplicacin que usa el servicio Web y el propio servicio. De esta forma, los cambios a lo largo del tiempo en uno no deben afectar al otro. Esta flexibilidad ser cada vez ms importante, dado que la tendencia a construir grandes aplicaciones a partir de componentes distribuidos ms pequeos es cada da ms utilizada.

L.I. Esteban Snchez Mendoza

Pgina 151

Programacin Web

Unidad V.

BIBLIOGRAFA
Domine HTML y DHTML. Lpez Jos. Ed. Alfa Omega, ISBN 970-15-0876-9. Diseo y Creacin de Pginas Web HTML 4.0.Soria Ramn. Ed. Alfa Omega Domine ASP.NET. Pratdepadua J. Jos. Ed.Alfa Omega. http://tuto-mpweb.webcindario.com/5_4.html http://msdn.microsoft.com/es-es/library/s9w05e9b(v=vs.80).aspx http://en.wikipedia.org/wiki/Universal_Description_Discovery_and_Integration http://es.wikipedia.org/wiki/WSDL http://es.wikipedia.org/wiki/Simple_Object_Access_Protocol http://sistemas.itlp.edu.mx/tutoriales/progweb/

L.I. Esteban Snchez Mendoza

Pgina 152

S-ar putea să vă placă și