Howto: zliczanie kliknięć w linki zewnętrzne na naszej stronie



Ostatnio postanowiłem sprawdzić, w jaki (prosty) sposób można zliczać kliknięcia w linki zewnętrzne na naszej stronie. Przez linki zewnętrzne rozumie wszystkie te, które kierują Internautę na stronę poza naszą domeną.

Pogrzebałem w sieci i trafiłem na pomysł zliczania owych kliknięć po przez utworzenie wywołania do obrazka, który de facto będzie prostym plikiem server-side (lub cgi) zapisującym akcje do bazy.

W poniższym (bardzo prostym) przykładzie, wszystkie linki mają wywołanie funkcji clk() w momencie zdarzenia onClick. Co to oznacza - każde kliknięcie wpierw wywoła kod clk(), a dopiero później ewentualnie przekieruje na wskazany odnośnik.

Funkcja clk() z parametrem link, sprawdza czy przeglądarka obsługuje obrazki (document.images), a następnie czy link jest w obrębie domeny. Jeśli nie jest - to tworzymy nowy obiekt typu Image. Przy czym warto zauważyć, że samo utworzenie obiektu wraz z podaniem atrybutu src wykona żądania do serwera.
Co ważne w atrybucie src podaliśmy lokalizację pliku zliczającego klinięcia (w przykładzie track_exit.php) przez co umożliwimy zalogowanie zdarzenia onClick w bazie danych.

Budowy pliku tarck_exit.php nie podaję, gdyż każdy może utworzyć go na dowolny sposób w dowolnym języku programowania, od C, perla, pythona, php po ruby czy jave. Pełna swoboda :-)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Zliczanie kliknięć w linki zewnętrzne</title>
<script>
function clk(link) {
  if (document.images){
    if (!link.match(document.location.host)) {
      new Image().src="/track_exit.php?link=" + link;
    }
  }
  return false;
}
</script>
</head>
<body>

Przykładowe linki:

<a href="http://www.example.com" onclick="return clk(this.href)">Zliczamy kliknięcie</a><br />
<a href="/index.html" onclick="return clk(this.href)">Link w obrębie domeny (nie zliczamy kliknięcia)</a>

</body>
</html>

Informacje i linki


Pozostałe wpisy
SVN w służbie aplikacji webowej
Google wprowadza motywy do GMail


Dodaj komentarz

Poświęć chwilę na komentarz - wyraź swoją opinię na temat poruszony w tej wiadomości.

*
Udowodnij, że nie jestś botem - przepisz słowo z obrazka poniżej. Click on the picture to hear an audio file of the word.
Click to hear an audio file of the anti-spam word

Komentarze

Brak komentarzy - bądź pierwszy - dodaj komentarz!