JMiur [E]

Eso de los códigos misteriosos hizo que alguien preguntar ¿qué es document.referrer?

En JavaScript hay un "objeto" llamado document que es una referencia a la página que estamos viendo; con eso, podemos modificarla:
document.write("HOLA");
u obtener alguna información como por ejemplo:

document.bgColor es el color de fondo [click]
document.domain es el dominio del servidor [click]
document.location la URL [click]
document.title el titulo de la página [click]
document.referrer es la página de la que viene el usuario [click]

Así que, consultando el dato de document.referrer sabremos si se ha ingresado desde otro blog, desde algún enlace externo o si llegó desde un buscador en cuyo caso también nos dirá qué estaba buscando.

Es fácil comprobarlo, si agregáramos un elemento HTML a nuestro blog y allí pusiéramos esto:
<script type="text/JavaScript">document.write(document.referrer)</script>
estaríamos mostrándo a quien ingresa, desde donde viene o nada si es que es un ingreso directo.

¿Para que sirve saber eso? Muchos lo utilizan para mostrar determinado contenido en función del acceso; por ejemplo, es común que ciertos sitios coloquen publicidad cuando se ingresa a través de buscadores pero no lo hagan si se ingresa de otro modo, es una forma de privilegiar a los usuarios habituales. Del mismo modo hay decenas de ejemplos en la web que juegan con ese dato.

En netmechanic.com proponen algunos métodos sencillos, por ejemplo, un mensaje de bienvenida:
<script type="text/JavaScript">
if (document.referrer != '') {
alert('Gracias por visitarnos desde '+document.referrer);
}
</script>
Claro que esto así puesto daría como resultado cosas un poco extrañas :)

Otra forma de usarlo es para dirigir a los visitantes a otra página
<script type="text/JavaScript">
if (document.referrer = 'http://deDondeVienen") {
location.href = "http://aDondeRedirigimos";
}
</script>
No es muy agradable hacer eso, en todo caso, es mejor mostrar un pop-up:
<script type="text/JavaScript">
function newWindow(newContent) {
if (document.referrer = 'http://deDondeVienen") {
winContent = window.open(newContent, 'nextWin', 'right=0,top=20,width=350,height=350,toolbar=no,scrollbars=no,resizable=no')
}
}
newWindow('URL_contenido')"
</script>
En webtaller.com hay más opciones, una de ellas es más razonable ya que filtra los resultados:
<script type='text/JavaScript'>
//<![CDATA[
// creamos una lista de direcciones web que nos interese detectar, cualquiera sea
var procedenciaValida = new Array(
'http://www.google',
'http://bing.com',
'http://twitter.com'
);
// creamos una lista de mensajes para cada una de esas direcciones
var mensajeValido = new Array(
'Llegó utilizando el buscador de Google',
'Llegó utilizando el nuevo buscador de Microsoft',
'Hizo click en un enlace de Twitter'
);
// verificamos si el visitante llega desde alguna de ellas
var ok = false;
var elMensaje = 0;
for(i in procedenciaValida) {
if(document.referrer.indexOf(procedenciaValida[i]) > -1) {
ok = true; // si es así será true
cual = i;
}
}
// y si es así, hacemos algo
if(ok) {
document.write(mensajeValido[cual]);
}
//]]>
</script>
Ese "algo" a hacer puede ser cualquier cosa, un texto, una imagen, una ventana, un elemento oculto, sólo hay que usar la imaginación.

1 comentario:

Felipe  

Gracias por la información JMiur.
Si he visto muchas paginas que generan flash, banners y sobre todo aquello de bloques publicitarios cuando el navegante llega por un motor de busqueda.
Se me ocurre que queriendo generar contenido un poco dinámico o personalizado, se podría emplear para por ejemplo usuarios que provengan de Facebook o Twitter, y utilizar sus APIS para mostrar sus nombres de usuario y foto.
Me gusta la idea, y pensandolo bien no es complicado. :)
Voy a hacer la prueba. ;)

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR