Sie haben JavaScript deaktiviert. Vermutlich sind Sie ein Kollege und wollen nur sehen, ob meine Website auch ohne JavaScript funktioniert.
Andernfalls: Bitte aktivieren Sie JavaScript!

webdesign weisshart Startseite

zurück zum Standard-Style

Ein einfacher Klick-Zähler

Hinweis:
Dieser Artikel ist älter als 18 Monate / wurde seit 18 Monaten nicht aktualisiert. Dies kann (muss aber nicht) dazu führen, dass der Artikel, und / oder darin beschriebene Techniken, nicht mehr aktuell sind. Bitte berücksichtigen Sie diesen Hinweis bei der Lektüre.

Symbolbild Wasserzähler
Foto: delo Pixabay-Lizenz

Es muss nicht immer gleich ein mächtiges Analysetool wie Google Analytics oder Matomo sein. Manchmal will man einfach nur wissen, wie oft ein bestimmter Link innerhalb der Site angeklickt wird. Ich hab' das mal mit wenigen Zeilen PHP und AJAX realisiert.

1. Das zu zählende <a> -Tag wird um ein onclick erweitert:
Aus

<a href="eine_datei.pdf" >Eine Datei</a>

wird

<a href="eine_datei.pdf" onclick="dlcount('beispiel');" >Eine Datei</a>

2. Das JavaScript bzw AJAX-Script; am besten unmittelbar vor dem schließenden </body> -Tag:

<script> function dlcount(e) { var xmlhttp = new XMLHttpRequest(); xmlhttp.open("GET", "dlcounter/dlcounter.php?sendValue=" + e, true); xmlhttp.send(); } </script>

3. Und jetzt noch die folgende PHP-Datei dlcounter.php, die das Auswerten der Klicks erledigt, in ein neu angelegtes Verzeichnis (im Beipiel heißt dieses Verzeichnis dlcounter)

<?php session_start(); if(!isset($_SESSION['ip-sperre'])||$_SESSION['ip-sperre'] < time()- 30){ $_SESSION['ip-sperre'] = time(); $incoming = $_GET['sendValue']; $filename = $incoming."_dlcounter.txt"; if (file_exists($filename)) { $file = fopen($filename,"r+"); $zaehler = fgets($file,255); fclose($file); } else { $zaehler = 0; } $zaehler++; $file = fopen($filename,"w"); fwrite($file,$zaehler); fclose($file); $inhalt = date("Y-m-d H:i:s").' - '.$incoming.': '.$zaehler."\n"; $file2 = fopen("dlcounter.log","a+"); fwrite($file2,$inhalt); fclose($file2); } else { // echo "Sperre aktiv"; } ?>

Im Verzeichnis dlcounter wird jetzt bei jedem Klick eine Datei namens beispiel_dlcounter.txt geändert. In dieser Datei nur eine Zahl: die Anzahl der bisher erfolgten Klicks. Die Datei beispiel_dlcounter.txt muss übrigens nicht manuell angelegt werden, sondern sie wird beim ersten Klick automatisch erstellt.

Gleichzeitig wird eine Log-Datei namens dlcounter.log erstellt bzw. aktualisiert. Der Inhalt dieser Datei sieht dann beispielsweise so aus:

2021-03-05 11:56:59 - beispiel: 1 2021-03-05 12:06:17 - beispiel: 2 2021-03-05 15:52:32 - beispiel: 3 2021-03-05 16:02:12 - andererlink: 1 2021-03-05 17:23:04 - beispiel: 4 usw.

Das Verzeichnis dlcounter bzw. die .log und .txt Dateien jetzt noch mit einem Zugriffsschutz vor fremden Blicken verstecken. Z.B. mittels folgender Anweisung in einer .htaccess-Datei:

<FilesMatch "\.(log|txt)$"> AuthType Basic AuthName "Logfiles" AuthUserFile /pfad_zur_.htusers/.htusers require valid-user </FilesMatch>

Das Script kann beliebig viele Links handhaben. Es muss lediglich für jeden Link im onclick ein individueller Name an Stelle von "beispiel" vergeben werden.

Creative Commons Lizenzvertrag

Artikeltexte und Code-Snippets: Creative Commons CC BY-SA 4.0
Medien (Bilder, Videos, Audios) sind evtl. urheberrechtlich geschützt.

2 Kommentare

  1. Herr Jörißen schrieb am Mittwoch, 02.06.21 17:03 Uhr:

    Habe viel gelärnt und werde das gelernte zu kümftig ,auch in meiner arbeit als Profesionaler entwickeler anwenden.

    LG Jöri0en

  2. Folco schrieb am Mittwoch, 07.09.22 17:45 Uhr:

    Tolles Skript, funzt super. Vielen Dank!

Über Ihren Kommentar zu diesem Artikel freue ich mich.
Wenn Sie aber Fragen haben, und eine Antwort erwarten, nutzen Sie bitte das Supportforum! Die Nutzung des Forums ist auch ohne Registrierung möglich.

? Anweisungen zur Eingabe von BB Code Wenn Javascript verfügbar ist, können Sie die obigen Schaltflächen zum Einfügen der folgenden Steuercodes verwenden (an der Cursorposition oder um gegebenenfalls markierten Text):

[b]als wichtig <strong>[/b] hervorgehobener Text
[c]Quellcode[/c] oder optisch hervorgehobenes Zitat