Internet se construye sobre el protocolo de transmisión TCP (Transmision Control Protocol), y sobre un sistema de identificación de los computadores que la forman basado en el protocolo IP:
"192.168.12.1"
. Normalmente
se utilizan nombres simbólicos para referirse a estas direcciones numéricas
(como por ejemplo "www.ua.es"
)La comunicación con TCP/IP se realiza mediante sockets, conexiones entre un computador y otro a través de la que se envían datos. Puede haber más de un socket entre dos mismos ordenadores, con lo que para distinguirlos se emplea un identificador, llamado puerto.
Se han desarrollado una serie de servicios y protocolos basados en TCP/IP y en la arquitectura cliente/servidor, donde una máquina (cliente) solicita peticiones de servicio a otra en la que suelen estar los datos y programas de aplicación (servidor). Algunos de los servicios y protocolos desarrollados son:
Para identificar los recursos de Internet se introdujeron las URL (Uniform Resource Locator), un esquema de nomenclatura de recursos basado en especificar el protocolo utilizado, el servidor y el recurso al que se accede:
Protocolo Servidor [:Puerto] Fichero
El protocolo depende del servicio al que se quiera acceder, y el fichero es la ruta del recurso, en el espacio de direcciones del servidor. Los protocolos de esta nomenclatura corresponden con algunos de los servicios mencionados:
http
: protocolo HTTP para solicitar documentoshttps
: petición segura (encriptada) de documentos mediante
HTTPftp
: petición de ficheros utilizando FTPfile
: acceso a ficheros localesnews
: acceso a artículos de grupos de noticiasmailto
: acceso al envío de correo electrónicotelnet
: conexión con una máquina remotaEjemplos de URL serían:
http://www.ua.es/index.htm ftp://ftp.dccia.ua.es/pub/winzip.exe mailto:pepe@yahoo.com
Los navegadores son clientes que permiten utilizar la mayoría de los protocolos anteriores. Traducen las URL en peticiones al servicio correspondiente.
El protocolo HTTP especifica el modo de comunicación entre una máquina cliente y una máquina servidor, de modo que el cliente solicita vía Web un documento del espacio de direcciones del servidor, y éste se lo sirve.
HTTP es un protocolo que no tiene estado: un cliente realiza una petición al servidor, que contesta y la transacción acaba, con lo que en la siguiente petición que pueda realizar el mismo cliente se deben proporcionar de nuevo todos los datos necesarios para que el servidor sirva correctamente la nueva petición, no habiendo ninguna relación entre las peticiones.
En el protocolo HTTP el cliente realiza una petición que se descompone en:
Comando URI ProtocoloPor ejemplo:
GET /index.html HTTP/1.1
content-type
)
que entiende el cliente, etc). Esta información puede utilizarla el servidor
para generar la respuesta apropiada. Las cabeceras se envían una por línea,
donde cada una tiene el formato:Clave: ValorPor ejemplo:
Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (compatible;MSIE5.0;Windows 98)Tras las cabeceras, el cliente envía una línea en blanco (
\r\n\r\n
) para indicar el final de la sección de cabeceras.
METODO GET
El comando GET
permitía al principio solicitar al servidor un
documento estático, existente en su espacio de direcciones. Luego se vio que
esto no era suficiente, y se introdujo la posibilidad de solicitar búsquedas
al servidor, de forma que el documento no tuviera que ser necesariamente estático,
sino que la búsqueda estuviera condicionada por unos determinados parámetros.
Así, el comando GET
tiene la forma:
GET direccion ? parametros version HTTP
Por ejemplo:
GET /cgi-bin/pagina.cgi?IDIOMA=C&MODELO=a+b HTTP/1.1
Los parámetros se indican con pares nombre=valor, separados por '&'
,
y reciben el nombre de datos de formulario. El URI no puede contener
espacios ni algunos caracteres, por lo que se utilizan códigos especiales, como
el '+' para indicar espacio en blanco, u otros códigos %XX
para
representar otros caracteres. Uno de los trabajos más duros de los programas
CGI es procesar esta cadena de parámetros para extraer la información necesaria.
OTROS METODOS
En la versión 1.1 de HTTP se definen otros métodos además de GET
:
OPTIONS
: para consultar al servidor acerca de las funcionalidades
que proporcionaHEAD
: el servidor responde de forma idéntica a un comando GET
,
pero no devuelve el cuerpo del documento respuesta, sólo las cabeceras. Suele
emplearse para comprobar características del documento.POST
: es similar GET
,
pero se emplea para enviar al servidor un bloque de datos
en el cuerpo de la peticiónPUT
: solicita que el cuerpo de la petición que envía se almacene
en el espacio de direcciones del servidor, con el identificador URI solicitado
(guarda un documento en el servidor)DELETE
: solicita borrar un documento específico del servidorTRACE
: se utiliza para seguir el camino de la petición por
múltiples servidores y proxies (útil para depurar problemas de red).GET Y POST
Los dos métodos más comúnmente usados son GET
y POST
.
Veremos las diferencias entre uno y otro con un ejemplo:
GET
es:GET /dir/cargaPagina.php?id=21&nombre=Pepe HTTP/1.1 <cabeceras>
POST
es:POST /dir/cargaPagina.php HTTP/1.1 <cabeceras> id=21&nombre=PepeVemos que los parámetros se pasan en el cuerpo de la petición, fuera de la línea del comando. Es útil para ocultar los parámetros enviados en la barra de direcciones del navegador.
Comúnmente existen 3 formas de enviar una petición GET
:
http://www.xx.com/pag.html?id=123&nombre=pepe
<a href="http://www.xx.com/pag.html?id=123&nombre=pepe"> Pulsa Aqui </a>
METHOD=GET
(o sin METHOD
) con los dos parámetros a enviar:<html> <body> <form action="http://www.xx.com/pag.html"> <input type="text" name="id" value="123"> <input type="text" name="nombre" value="pepe"> <input type="submit" value="Enviar"> </form> </body> </html>
Para enviar una petición POST, normalmente se utiliza un formulario con METHOD=POST
:
<html> <body> <form action="http://www.xx.com/pag.html" METHOD=POST> <input type="text" name="id" value="123"> <input type="text" name="nombre" value="pepe"> <input type="submit" value="Enviar"> </form> </body> </html>
Las respuestas del servidor también tienen tres partes:
HTTP/1.0 200 OK
Hemos visto que tanto en la petición HTTP como en la respuesta se envía (o se puede enviar) información sobre cabeceras. En el caso de la petición, dichas cabeceras suelen contener información sobre el cliente que realiza la petición: tipo de contenido que admite, tipo de navegador, etc. En el caso del servidor, suelen contener información sobre el contenido que se envía: tipo de contenido enviado, tamaño, etc. También se puede enviar otro tipo de información en las cabeceras tanto de petición como de respuesta.
Vamos a poder implementar programas que lean las cabeceras que envía un cliente (un navegador, por ejemplo) y que modifiquen el documento servido en función de dichas cabeceras (por ejemplo, enviar una página en función del idioma que se especifique). Por otra parte, podremos utilizar las cabeceras que envíe el servidor como respuesta para obligar al navegador a hacer determinadas acciones, como saltar a otra URL.
Veremos a continuación las cabeceras más comunes tanto en las peticiones de los clientes como en las respuestas de los servidores. La RFC donde se especifican estas cabeceras es la 2616.
CABECERAS DE PETICION (HTTP/1.1)
NOMBRE | DESCRIPCIÓN |
Accept | Tipos MIME que puede manejar el cliente |
Accept-Charset | Conjunto de caracteres que el cliente puede manejar |
Accept-Encoding | Define si el navegador puede aceptar datos codificados |
Accept-Language | Idiomas aceptados |
Authorization | Para identificarse cuando se accede a páginas protegidas |
Cache-Control | Opciones relacionadas con el servidor proxy. Esta cabecera se llamaba Pragma en HTTP 1.0 |
Connection | Define si el cliente es capaz de realizar conexiones persistentes (keep-alive, valor por defecto), o no (close). Nueva en HTTP 1.1 |
Content-Length | Longitud de los datos enviados. Aplicable a peticiones POST |
Content-Type | Tipo MIME de los datos enviados. Aplicable
a peticiones POST |
Cookie | Para las cookies que se manejen |
From | Dirección de correo electrónico responsable de la petición |
Host | Unica cabecera requerida por HTTP 1.1. Indica el host y el puerto tal y como se especifica en la URL original. |
If-Modified-Since | El cliente sólo desea el documento si ha sido modificado después de la fecha indicada en esta cabecera. |
Referer | URL origen de la petición. Si estamos en la página 1 y pinchamos en un enlace a la página 2, la URL de la página 1 se incluye en esta cabecera cuando se realiza la petición de la página 2. |
User-Agent | Cliente que está realizando la petición (normalmente muestra datos del navegador, como nombre, etc). |
CABECERAS DE RESPUESTA
NOMBRE | DESCRIPCIÓN |
Allow | Métodos disponibles (GET , POST ,
etc) a los que puede responder el recurso que se está solicitando |
Cache-Control | Dice al cliente en qué circunstancias puede hacer una
caché del documento que está sirviendo:
Esta cabecera se llamaba |
Content-Encoding | Tipo de compresión (gzip, etc) en que se devuelve el documento solicitado |
Content-Language | Idioma en que está escrito el documento. En la RFC 1766 están los idiomas disponibles |
Content-Length | Número de bytes de la respuesta |
Content-MD5 | Una forma de fijar el checksum (verificación de integridad) del documento enviado |
Content-Type | Tipo MIME de la respuesta |
Date | Hora y fecha, en formato GMT, en que la respuesta ha sido generada |
Expires | Hora y fecha, en formato GMT, en que la respuesta debe considerarse caducada |
Last-Modified | Fecha en que el documento servido se modificó por última vez.
Con esto, el documento se sirve sólo si su Last-Modified es
mayor que la fecha indicada en el If-Modified-Since de la cabecera
del cliente. |
Location | Indica la nueva URL donde encontrar el documento. Debe usarse con un código de estado de tipo 300. El navegador se redirigirá automáticamente a la dirección indicada en esta cabecera. |
Refresh | Indica al cliente que debe recargar la página
después de los segundos especificados. También puede indicarse la
dirección de la página a cargar después de los segundos
indicados:Refresh: 5; URL=http://www.unapagina.com |
Set-Cookie | Especifica una cookie asociada a la página |
WWW-Authenticate | tipo de autorización y dominio que debería indicar el cliente
en su cabecera Authorization . |
Para colocar estas cabeceras en un documento se tienen varios métodos, dependiendo
de cómo estemos tratando las páginas (mediante servlets, HTML, etc). Por ejemplo,
con HTML podemos enviar cabeceras mediante etiquetas META
en la
cabecera (<HEAD>
) de la página HTML:
<META HTTP-EQUIV="Cabecera" CONTENT="Valor">
Por ejemplo:
<META HTTP-EQUIV="Location" CONTENT="http://www.unapagina.com">
El código de estado que un servidor devuelve a un cliente en una petición indica el resultado de dicha petición. Se tiene una descripción completa de los mismos en el RFC 2616. Están agrupados en 5 categorías:
200
OK
Todo está bien 204
No Content
No hay documento nuevo
301
Moved Permanently
El documento está en otro lugar, indicado en la cabecera Location 302
Found
Como el anterior, pero la nueva URL es temporal, no permanente. 304
Not Modified
El documento pedido no ha sufrido cambios con respecto al actual (para cabeceras If-Modified-Since
)
400
Bad Request
Mala sintaxis en la petición 401
Unauthorized
El cliente no tiene permiso para acceder a la página. Se debería devolver una cabecera WWW-Authenticate
para que el usuario introduzca login y password403
Forbidden
El recurso no está disponible 404
Not Found
No se pudo encontrar el recurso 408
Request Timeout
El cliente tarda demasiado en enviar la petición
500
Internal Server Error
Error en el servidor 501
Not Implemented
El servidor no soporta la petición realizada 504
Gateway Timeout
Usado por servidores que actúan como proxies o gateways, indica que el servidor no obtuvo una respuesta a tiempo de un servidor remoto
Las cookies son un mecanismo general mediante el que los programas de un servidor web pueden almacenar información en la parte del cliente de la conexión. Es una forma de añadir estado a las conexiones HTTP, aunque el manejo de cookies no es parte del protocolo HTTP, pero es soportado por la mayoría de los clientes.
Las cookies son objetos de tipo:
nombre = valor
donde se asigna un valor determinado (una cadena de texto) a una variable del nombre indicado. Dicho objeto es almacenado y recordado por el servidor web y el navegador durante un período de tiempo (indicado como un parámetro interno de la propia cookie). Así, se puede tener una lista de cookies con distintas variables y distintos valores, para almacenar información relevante para cada usuario (se tienen listas de cookies independientes para cada usuario).
El funcionamiento es: el servidor, con la cabeceras Set-Cookie
,
envía al cliente información de estado que éste almacenará. Entre la información
se encuentra la descripción de los rangos de URLs para los que este estado es
válido, de forma que para cualquier petición HTTP a alguna de esas URLs el cliente
incluirá esa información de estado, utilizando la cabecera Cookie
.
La sintaxis de la cabecera Set-Cookie
es:
Set-Cookie: CLAVE1=VALOR1;...;CLAVEN=VALORN [OPCIONES]
donde podremos agrupar en una cabecera varias cookies, o definir una cookie por cabecera. Las OPCIONES son una lista opcional, compartida por todas las cookies de la cabecera, con cualquiera de estos atributos:
expires=FECHA;path=PATH;domain=DOMINIO;secure
domain
y path
definen las URL en
las que el navegador mostrará las cookies. domain
es por defecto
el hostname del servidor. El navegador mostrará la cookie cuando acceda
a una URL que se empareje correctamente con ambos atributos. Por ejemplo,
un atributo domain= "eps.ua.es"
hará que el navegador
muestra la cookie cuando acceda a cualquier URL terminada en "eps.ua.es"
.
path
funciona de forma similar, pero con la parte del path de
la URL. Por ejemplo, el path "/foo"
hará que el navegador
muestre la cookie en todas las URLs que comiencen por "/foo"
.expires
define la fecha a partir de la cual las cookies
caducan.
La fecha se indica en formato GMT, separando los elementos
de la fecha por guiones. Por ejemplo:expires=Wed, 09-Nov-1999 23:12:40 GMT
secure
hará que la cookie sólo se transmita si el canal de
comunicación es seguro (tipo de conexión HTTPS).Set-Cookie
, una por cada
cookie. E incluso dentro de una misma cabecera Set-Cookie
se
podrán incluir varias cookies, todas ellas con los mismos atributos de domain
,
path, expires...
Por otra parte, cuando el cliente solicita una URL que empareja con el dominio y path de algunas cookies, envía la cabecera:
Cookie: CLAVE1=VALOR1;CLAVE2=VALOR2;...;CLAVEN=VALORN
El número máximo de cookies que está garantizado que acepte cualquier navegador es de 300, con un máximo de 20 por cada servidor o dominio. El tamaño máximo de una cookie es de 4096 bytes.
RFC: los documentos RFC (Request For Comment)
forman un conjunto de notas acerca de Internet. Tratan sobre diferentes aspectos
de la comunicación entre computadores. Podemos encontrar información sobre todos
los RFC en http://www.rfc-editor.org
.
Si conocemos el número de RFC, normalmente podemos encontrar el documento en
http://www.rfc-editor.org/rfc/rfcXXXX.txt
(sindo XXXX el
número de RFC).
MIME: MIME (Multipurpose Internet Mail Extensions) es un estándar oficial de Internet que indica cómo se deben formatear los mensajes para que puedan intercambiarse entre diferentes sistemas de correo electrónico. Permite incluir cualquier tipo de dato (texto, audio, video, imágenes, etc). Las RFC que definen los tipos MIME son la 2045, 2046, 2047, 2048 y 2049. Algunos tipos comunes son:
application/msword
: documento de Microsoft Wordapplication/pdf
: documento PDFapplication/postscript
: fichero postscriptapplication/x-gzip
: fichero comprimido gzipapplication/x-java-archive
: fichero JARaudio/midi
: fichero de sonido MIDItext/html
: documento HTMLtext/plain
: fichero de texto planoimage/gif
: imagen GIFimage/jpeg
: imagen JPEGimage/png
: imagen PNGvideo/mpeg
: película MPEGGMT: el formato de fecha y hora GMT tiene la siguiente estructura:
Wdy, DD Mon YYYY HH:MM:SS GMT
donde:
Wdy
es el identificador de 3 caracteres del día de la semana
(Sun
, Sat
, etc)DD
son los dos dígitos del día del mes (01
, 23
,
12
, etc)Mon
es el identificador de 3 caracteres del mes (Feb
,
Mar
, etc)YYYY
: son los 4 dígitos del añoHH:MM:SS
indica la hora, minuto y segundo, en formato de 24
horas (01:02:33
, 21:15:58
, etc)Esta representación está basada en las RFC 822, 1036 y 1123
El servicio Web o WWW (World Wide Web) es una forma de representar la información en Internet basada en páginas. Una página WWW puede incluir tres tipos de información: texto, gráficos e hipertexto. Un hipertexto es texto resaltado que el usuario puede activar para cargar otra página WWW. La diferencia entre un documento de hipertexto y un documento normal consiste en que el hipertexto contiene, además de la información, una serie de enlaces o conexiones con otros documentos relacionados, de manera que el lector puede pasar de un tema a otro y volver al documento original en el momento en que le interese. De esta forma, se permite combinar texto y gráficos, y mediante hiperenlaces podremos cargar páginas de cualquier otro lugar de Internet.
HTML (HyperText Markup Language), es un lenguaje simple utilizado para crear documentos de hipertexto para WWW. No es un lenguaje de descripción de página: no permite definir de forma estricta la apariencia de una página, aunque a veces se utilice para ello, pero la presentación de la página es muy dependiente del navegador empleado.
Por tanto, HTML se limita a describir la estructura y el contenido de un documento. Es un "lenguaje de descripción de página" independiente de la plataforma en que se utilice, y no es necesario utilizar un editor particular para crear un documento HTML (podemos trabajar con el editor de DOS o con el bloc de notas, por ejemplo)
Para poder utilizar el servicio Web se necesitan dos partes. Por un lado, un lugar donde poner las páginas WWW que se requieran, a disposición del público en Internet. Es lo que se llama un servidor WWW. Por otro lado, el usuario que quiere acceder a dichas páginas tiene que utilizar un programa (cliente WWW) que lea las páginas WWW e interprete su significado. Ejemplos de estos programas son los navegadores Internet Explorer o Netscape.
Interconectar documentos por todo el planeta implica tener algún método de identificar unívocamente un documento en la red. La dirección única de un documento en WWW se llama URL (Uniform Resource Locator) y se compone de los siguientes elementos:
134.158.48.1
es la dirección de
la máquina sioux.in2p3.fr
en la que sioux
representa
el nombre de la máquina y .in2p3.fr
el nombre del ámbito.
protocolo://nombre_servidor/arbol_directorios/documento
La sintaxis completa es:
protocolo://usuario:password@nombre_servidor:puerto/ arbol_directorios/documento?parametrosEjemplos de URL:
http://www.ua.es/index.htm http://www.unapagina.com?param1=valor1¶m2=valor2 ftp://ftp.dccia.ua.es/pub/winzip.exe
HTML define la estructura y contenido de los documentos insertando en el texto
de los mismos una serie de marcas (tags o etiquetas), que delimitan
elementos del documento como cabeceras, párrafos, etc y se usan para dar un
tratamiento diferente al texto que se encuentre entre ellas. Son fragmentos
de texto encerrados entre los signos "<"
y ">"
(teniendo por tanto el formato "<marca>
").
Las marcas funcionan muchas veces por parejas, una para indicar el inicio de
acción de la marca, y otra para indicar el final. La marca de inicio consiste
en una letra o una palabra, y la marca de final es la misma letra o palabra
precedida por "/"
. Existen, no obstante, algunas marcas
que no requieren su pareja de cierre, como <BR>
(que fuerza
un salto de línea). Es importante señalar que las marcas, en general pueden
estar indistintamente en mayúsculas o en minúsculas.
texto normal <marca> texto afectado por la marca </marca> resto del texto
Hay que indicar que, para las etiquetas que se abren y se cierran, tendremos que cerrar una etiqueta DESPUES de haber cerrado las que se han abierto después (es decir, se cierran en orden inverso al que se abren). Un texto está afectado por todas las marcas que se han abierto antes que él, sin haberse cerrado.
texto normal <marca1> texto afectado por la marca <marca2> texto de marca1 y marca2 </marca2> otra vez texto de marca1</marca1> resto del texto
Algunas marcas pueden admitir atributos, pudiendo tener cada uno de
estos atributos un valor. Este valor ira entre comillas ("
)
si es alfanumérico:
<marca atributo1=numerico atributo2="alfanumerico">
Ejemplos:
<pre width=50> <a href="/home/default.html">
Una página HTML tiene en general el formato:
<html> <head> ... Lineas de cabecera </head> <body> ... Cuerpo del documento </body> </html>
CABECERA
La cabecera de un documento HTML está limitada por las marcas HEAD
,
y en ella se introduce información acerca del documento, como por ejemplo:
<title>El titulo del documento</title>
<META HTTP-EQUIV="Cabecera" CONTENT="Valor">
CUERPO
El contenido del documento se indica en el cuerpo del mismo, delimitado por
las marcas BODY
. Veremos en los siguientes apartados algunos de
los elementos más comunes utilizados en esta parte.
COMENTARIOS
Podemos colocar comentarios en el documento (comentarios que ignorará el navegador), con:
<!-- ... comentario ... -->
Podemos colocar títulos de mayor o menor tamaño en el documento, y dividirlos
así en secciones. Los títulos o encabezados están contenidos dentro de etiquetas
H#
, siendo #
un número del 1 al 6 que indica el tamaño
de la fuente del encabezado (1 para el mayor tamaño, 6 para el menor):
<h1>Encabezado de letra grande</h1> <h6>Encabezado de letra pequeña</h6> |
Encabezado de letra grandeEncabezado de letra pequeña |
Para definir y separar bloques de texto se emplean una serie de marcas que definen párrafos, texto preformateado, etc. Algunas marcas de bloques son:
<P>...</P>
se utiliza para delimitar párrafos.<PRE>...</PRE>
se utiliza para visualizar
el texto que contiene respetando el formato en que fue escrito.<BLOCKQUOTE>...</BLOCKQUOTE>
se utiliza
para tabular a la derecha (cuando se abre la marca) y a la izquierda (cuando
se cierra).<BR>
indica un salto de línea.<HR>
se emplea para representar una línea horizontal. <p>Esto esta dentro de un parrafo</p> Un texto <br> Otro texto <hr> |
Esto esta dentro de un parrafo Un textoOtro texto |
Algunas marcas HTML permiten controlar la apariencia del texto. Por ejemplo:
<FONT>...</FONT>
establece las características
de la fuente para el texto que encierra.<B>...</B>
o <STRONG>...</STRONG>
pone en negrita el texto que
encierra.<I>...</I>
o <EM>...</EM>
pone en cursiva el texto que
encierra.<U>...</U>
pone en subrayado el texto que
encierra. <font size="5" color="blue">Fuente azul tamaño 5</font> <br> <b>Letra negrita</b> <br> <b><i><u>Letra negrita, cursiva y subrayado</u></i></b> |
Fuente azul tamaño 5 Letra negrita Letra negrita, cursiva y subrayado |
Para definir las listas, utilizamos dos etiquetas:
<UL>...</UL>
para definir listas no ordenadas<OL>...</OL>
para definir listas ordenadasDentro de estas dos marcas, se utilizan marcas:
<LI>...</LI>
para definir los elementos
de la lista <ul> <li>Elemento 1 de lista</li> <li>Elemento 2 de lista</li> <ul> <ol> <li>Elemento 1 de lista</li> <li>Elemento 2 de lista</li> </ol> |
|
<IMG>
es la marca que permite incluir una imagen.
Esta marca irá siempre completada por el atributo "src
"
que permite dar la dirección del fichero gráfico que contiene la imagen:
<img src="/imagenes/unaimagen.gif">
El valor del atributo src
permite especificar la ruta de la imagen
como URL también. Para navegadores que no puedan cargar la imagen, podemos poner
en el atributo alt
el texto alternativo que se verá si no se ve
la imagen:
<img src="/imagenes/unaimagen.gif" alt="Imagen de ejemplo">
Podemos alinear la imagen con el texto mediante el atributo align
,
indicando dónde va la imagen con respecto al texto de su línea:
<img align="right" src="/imagenes/unaimagen.gif">
El lector explora un documento HTML haciendo clic sobre las zonas activas para
así acceder a nuevos documentos. En HTML definimos una zona activa (que puede
ser un texto o una imagen) que se asocia a la URL a la que se quiere acceder,
y haciendo clic sobre esa zona se accederá a dicha URL. Para definir el hiperenlace
se utiliza la marca <A>
con la sintaxis:
<a href="URL">Texto o imagen a mostrar</a>
Podremos hacer enlaces:
<a href="http://www.ua.es">Universidad de Alicante</a>Universidad de Alicante<a href="http://www.ua.es"><img src="dccia.gif"></a>El atributo
href
permite indicar la dirección a la que salta el enlace al pinchar sobre él. Notar que entre las marcas<A>
y</A>
podemos colocar tanto texto como una imagen.
<A>
con un atributo name, con el nombre
con el que queramos identificar la zona:<a name="ancla1">...</a>
- Luego en la zona donde coloquemos el enlace, en el
href
hacemos referencia a la marca anterior, precedida por'#'
:<a href="#ancla1">Enlace hacia ancla1</a><a href="pagina.htlm#ancla1"> Enlace hacia ancla1 de otra pagina </a>Al hacer click sobre el enlace "Enlace hacia ancla1" iremos a la zona de código etiquetada con
<a name="ancla1">
de nuestro documento (en el primer caso) o de la páginapagina.html
(en el segundo caso).
Para crear tablas, encerramos la tabla entre las marcas <TABLE>...</TABLE>
.
Podemos pasarle como atributo border
el grosor del borde de la
tabla, y en el atributo width
la anchura (en porcentaje o en píxeles)
<table border="0" width="50%"> ... </table>
Dentro de la tabla, utilizamos las siguientes marcas:
<TH>...</TH>
para definir las cabeceras
de la tabla<TR>...</TR>
para definir las filas de la
tabla<TD>...</TD>
para definir cada una de las
columnas dentro de cada fila Por ejemplo:
<table border="2"> <th>Cabecera 1</th><th>Cabecera 2</th> <tr> <td>Columna 1.1</td> <td>Columna 1.2</td> </tr> <tr> <td>Columna 2.1</td> <td>Columna 2.2</td> </tr> </table>
Cabecera 1 | Cabecera 2 |
---|---|
Columna 1.1 | Columna 1.2 |
Columna 2.1 | Columna 2.2 |
Las marcas td
pueden tener atributos, como width
para indicar sus características (anchura, color, fuente, etc).
Un formulario es una plantilla para representar un conjunto de datos y generar en la pantalla cuadros de diálogo. Se podrán tener zonas en las que se introducirá un texto, casillas de verificación, listas de selección, etc. El usuario rellenará zonas en el formulario que se identifican con un nombre simbólico. Cuando el formulario se envía al programa que lo va ha tratar, éste recibe el identificador de cada zona y el valor introducido.
La marca <FORM> ... </FORM>
define un formulario
y dentro de ella se situarán todas las marcas que generan los diversos elementos
que componen el formulario. Esta marca debe ir acompañada por
dos atributos:
METHOD
: define el modo de transferencia de los datos del formulario
(GET
o POST
). Por defecto es GETACTION
: URL del programa que tratará los datos del formulario
cuando se envíe<form method="post" action="mipagina.jsp"> ... </form>
Los elementos que se coloquen dentro del formulario tienen los siguientes atributos comunes:
NAME
: nombre del elemento. VALUE
: valor del elemento. Para un campo de texto es el texto
que aparece en el cuadro, para un botón es la etiqueta del botón, y para un
checkbox es el valor asociado a la casilla cuando está pulsada.Podemos tener varios elementos iguales con el mismo nombre, considerando así un mismo elemento con múltiples valores.
Entre los elementos que podemos colocar dentro de un formulario, destacamos:
<INPUT>
indicamos
distintas formas de introducir datos por el usuario. Distinguimos cada una
de estas formas mediante el atributo type
de dicha marca. Tenemos,
por ejemplo:
type
,
o podemos poner type="text"
:
<input name="texto1" value="">
- Botones SUBMIT: al pulsar este botón se enviará el formulario a la URL indicada en el
action
del mismo:<input type="submit" name="botonS" value="Pulsame">
- Botones RESET: al pulsar este botón se borrarán los datos de los campos del formulario:
<input type="reset" name="botonR" value="Borrar">
- Checkboxes y botones de radio: casillas que se marcan y se desmarcan al pulsar sobre ellas:
<input type="checkbox" name="casillas" value="casilla1" checked> <input type="checkbox" name="casillas" value="casilla2">La casilla que tiene un atributo checked aparece marcada. Para los botones de radio, el
type
esradio
, y la diferencia con los checkboxes es que sólo puede haber una casilla marcada.
- Campos ocultos: campos donde guardamos una información que no queremos mostrar:
<input type="hidden" name="oculto" value="Datos">
<SELECT>...</SELECT>
indicamos listas de elementos. Cada uno de los elementos se pone dentro de
la marca entre etiquetas <OPTION>...</OPTION>
.
Si la marca <SELECT>
tiene el atributo multiple
,
es una lista fija, y si no, es una lista desplegable. Para listas fijas, en
su atributo size
indicamos cuántos elementos están visibles (el
resto se puede ver con barras de desplazamiento).<select name="lista1"> <option>Opcion 1</option> <option>Opcion 2</option> </select> <select multiple name="lista2" size="3"> <option>Opcion 1</option> <option>Opcion 2</option> </select>
<TEXTAREA>...</TEXTAREA>
indicamos areas de texto de varias líneas. El atributo rows
indica
el número de filas visibles del área, y cols
el número de columnas
visibles (se verán las filas y columnas que se indiquen en estos atributos,
aunque se pueden tener más, viéndolas todas con las barras de desplazamiento):<textarea name="texto1" rows=5 cols=40> El texto del area </textarea>
Un ejemplo de formulario:
<form action="unapagina.php" method="post"> Nombre: <input name="nombre" value="Pepe"> <br> Validado: <input type="checkbox" value="validado" checked> <br> Comentarios: <textarea name="comentarios" rows=5 cols=50> </textarea> <br> <input type="submit" value="Enviar"> </form>
Algunos símbolos (como por ejemplo '<'
, 'á'
, 'é'
,
etc) no pueden representarse bien directamente en código HTML, y para representarlos
se utilizan otros símbolos que los sustituyen:
< | < |
> | > |
& | & |
(espacio en blanco) | |
" | " |
ñ | ñ |
á | á |
é | é |
í | í |
ó | ó |
ú | ú |
Á | Á |
É | É |
... | ... |
Por ejemplo:
"Hola" Esto es un texto con mayúsculas y < menor que y mÁs mayúsculas
Resultaría:
"Hola" Esto es un texto con mayúsculas y < menor que y mÁs mayúsculas
Tomcat es un servidor HTTP especializado en servlets y JSP. Realizado por el equipo de desarrollo del servidor Apache, es un servidor open source y de libre distribución. Se puede encontrar información detallada sobre Tomcat, Apache, y todo el llamado "proyecto Jakarta" en:
Para poder instalar Tomcat tenemos que tener instalada previamente la versión
1.2 o posterior de JDK. Una vez hecho esto, deberemos tener una variable de
entorno JAVA_HOME
que apunte al directorio donde se ha instalado
JDK (algunas versiones de Tomcat ya la establecen automáticamente).
Una vez tengamos JDK instalado, ya podemos instalar Tomcat:
Tomcat necesita además otra variable de entorno, llamada CATALINA_HOME
,
que apunte al directorio donde está instalado Tomcat. Si no se autoestablece
deberemos asignarla nosotros.
Una vez tenemos instalado Tomcat, dentro del subdirectorio bin
tenemos, entre otros, dos ejecutables (ficheros .bat
para Windows
y .sh
para Unix):
startup
: al ejecutar este comando se arranca el
servidor. shutdown
: al ejecutar este comando se detiene el
servidor.Si al ejecutar estos programas desde MS-DOS nos aparece un error del tipo "Sin espacio en entorno", vamos a la opción de Propiedades dentro de esa ventana de MS-DOS, y en la pestaña Memoria colocamos un valor para Entorno inicial de 4096. Luego cerramos las ventanas de MS-DOS que tengamos y volvemos a abrir una, que ya tendrá dicha configuración.
Dependiendo de la versión de Tomcat (normalmente, a partir de la versión 4), en Windows se crea una carpeta en el menú de Programas en el botón de Inicio. Ahí tendremos accesos directos para lanzar y detener el servidor.
Una vez tengamos el servidor arrancado podemos probarlo con la dirección raíz:
http://localhost:8080/
Que debería mostrar una página como:
Figura 1. Página de inicio de Tomcat
NOTA: las pruebas que hagamos, generalmente las haremos sobre nuestra propia máquina, con lo que las direcciones que tecleemos tendrán la forma:
http://localhost:8080/...
donde luego la dirección localhost
y el puerto 8080
se sustituyen en la realidad por la dirección donde coloquemos el servidor y
el puerto por el que establezcamos que atienda peticiones.
Con algunos tipos de cambios que hagamos en las aplicaciones web que tengamos en Tomcat habrá que detener el servidor y volverlo a lanzar, para que Tomcat recoja dichas actualizaciones. Más adelante también se explicará alguna forma de instalar las aplicaciones y realizar cambios sin necesidad de detener por completo el servidor.
Dentro de Tomcat, nos pueden interesar especialmente algunos de los siguientes directorios: