37 - Creación y lectura de una cookie


El protocolo HTTP es desconectado. Esto significa que cada vez que solicitamos una página a un servidor representa una conexión distinta.

Una cookie es una pequeña cantidad de datos almacenada por el navegador del usuario cuando solicita una página a un servidor. El que envía que se genere la cookie es el servidor.

Una cookie consta de un nombre, un valor, una fecha de expiración y un servidor. Una cookie está limitada a 4KB.

Luego que una cookie es creada sólo el sitio que la creó puede leerla. Luego de creada una cookie, cada vez que el navegador del usuario visita el sitio, se envía dicha cookie.

Otra cosa importante que hay que tener en cuenta es que el usuario del browser puede configurar el mismo para no permitir la creación de cookies, lo que significa que el uso de cookies debe hacerse con moderación y cuando la situación lo requiera. De todos modos, el 95% de los navegadores están configurados para permitir la creación de cookies.

Supongamos que queremos que los usuarios que entran a nuestro sitio puedan configurar con qué color de fondo de página quiere que aparezca cada vez que ingresa al sitio. Al color seleccionado por el visitante lo almacenaremos en una cookie. En caso que no exista el color, por defecto es blanco.

La primera página mostrará un formulario con tres controles de tipo radio para la selección del color. También esta página verificará si existe la cookie creada, en caso afirmativo fijará el fondo de la página con el valor de la cookie. Tengamos en cuenta que la primera vez que ejecutemos este programa la página es de color blanco, luego variará según el color seleccionado en el formulario.

pagina1.asp

<html>
<head>
<title>Problema</title>
</head>
<body 
<%
if request.cookies("color")<>"" then
response.write(" style=""background-color:" & request.cookies("color") 
& """ ")
end if
%>
>
<form action="pagina2.asp" method="post">
Seleccione de que color desea que sea la página de ahora en más:<br>
<input type="radio" value="rojo" name="radio">Rojo<br>
<input type="radio" value="verde" name="radio">Verde<br>
<input type="radio" value="azul" name="radio">Azul<br>
<input type="submit" value="Crear cookie">
</form>
</body>
</html> 

Lo primero que tenemos que tener en cuenta que esta página es de tipo ASP ya que debemos verificar si la cookie existe para fijar el color de fondo.

El objeto request tiene una propiedad llamada cookies que le pasamos como parámetro el nombre de la cookie que debe rescatar. Si la cookie no existe retorna una cadena vacía, en caso que exista retorna el valor de la cookie.

<body 
<%
if request.cookies("color")<>"" then
  response.write(" style=""background-color:" &request.cookies("color") 
& """ ")
end if
%>
>

En caso que exista la cookie procedemos a inicializar la propiedad de la hoja de estilo background-color con el color almacenado en la cookie.

La primera vez que solicitamos esta página al servidor seguro que la cookie no existe por lo que el color de la página es blanca, que es el color por defecto para el fondo de una página HTML.

El resto de la página contiene un formulario que nos permite seleccionar de un grupo de radios el color que queremos para el fondo de la página.


Ahora analicemos la pagina2.asp que contiene el código donde se crea la cookie (recordemos que la cookie se almacena en la computadora que solicita la página.

pagina2.asp

<%option explicit%>
<html>
<head>
<title>problema</title>
</head>
<body>
<%
dim col
col=request.form("radio")
if col="rojo" then
  response.cookies("color")="#ff0000"
  response.cookies("color").expires = Date + 365
else
  if col="verde" then
    response.cookies("color")="#00ff00"
    response.cookies("color").expires = Date + 365
  else
    if col="azul" then
      response.cookies("color")="#0000ff"
      response.cookies("color").expires = Date + 365
    end if
  end if 
end if
%>
<a href="pagina1.asp">Ir a la otra página</a>
</body>
</html>

Definimos una variable y rescatamos la propiedad value del control radio seleccionado en el formulario de la pagina1.asp:

dim col
col=request.form("radio")

El primer if es para verificar si el valor del radio seleccionado es la cadena "rojo":

if col="rojo" then
  response.cookies("color")="#ff0000"
  response.cookies("color").expires = Date + 365
else

En caso que sea verdadera creamos la cookie asignándo el valor respectivo:

  response.cookies("color")="#ff0000"

Otra cosa importante es definir por cuanto tiempo la computadora que solicitó la página debe almacenar la cookie, una forma sencilla es asignando a la propiedad expires de la cookie respectiva la fecha actual más un valor entero que representa la cantidad de días:

 
  response.cookies("color").expires = Date + 365

Los otros if solo tiene el objetivo de guardar otros valores a la cookie.

Luego cuando retornemos a la página primera veremos como el color de fondo se modifica por el seleccionado.

Podemos ver que si cerramos el navegador y ejecutamos nuevamente la pagina1.asp el color de fondo de la página toma el color que habíamos seleccionado previamente.


Retornar