¿Qué es un referrer?

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.

Compartir Enlace