In diesem Tutorial erkläre ich, wie man mit jQuery und PHP das Veränderungsdatum einer Datei prüfen kann.

Mit der Javascript-Bibliothek jQuery lässt sich ohne großen Aufwand eine einfache Ajax-Anwendung realisieren. Im folgenden gehe ich davon aus, dass in die aufgerufene Seite bereits das jQuery-Framework eingebunden wurde (hier kann das Einbinden nachgelesen werden). Dies ist notwendig, damit das nachfolgende Beispiel funktioniert.

Für was benötige ich die Ajax-Technologie?

Mit der Ajax-Technologie können Seiteninhalte nachgeladen werden, ohne dass diese komplett neu geladen werden muss. In diesem Beispiel wird das Änderungsdatum einer Datei überprüft und im Falle einer Änderung der Inhalt eines Containers aktualisiert. Wurde die Datei nicht geändert, verändert sich auch der Inhalt des Containers nicht.

Dieses Tutorial ist meinem Leser Mike gewidmet, der mich bat, diese Materie zu erklären. Ich hoffe, dass ich mit diesem Beispiel ausreichend auf die Frage eingegangen bin. Falls Fragen auftauchen sollte, oder auch sonst, bitte einfach kommentieren!

Beispiel

Für dieses Tutorial verwende ich die Dateien file.txt, index.php, refresh.php, time.txt, timestamp.php und update.php, die ich nachfolgend beschreibe. Die beiden Textdateien (file.txt und time.txt) benötigen volle Schreibrechte (chmod 666), damit der Inhalt bearbeitet werden kann. Ich weiß, dass man dieses Beispiel auch mit weniger Dateien hätte lösen können, ich denke jedoch, dass es mit mehr Dateien übersichtlicher und vor allem verständlicher wird.

Folgender Code wird in den head-Bereich der Homepage (in meinem Fall index.php) geschrieben: 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

<script type="text/javascript">
function update() {
    $("#refresh").load('refresh.php?' + 1*new Date());
};

function timestamp() {
    $.ajax({
        type: "GET",
        url: "update.php",
        success: function(data) {
            $("#timestamp").fadeIn("slow").delay(2000).fadeOut("slow");   
        }
    });
};

$(document).ready(function() {
    $("#refresh").load("refresh.php");
    var refreshId = setInterval(function() {
        $.ajax({
            type: "GET",
            url: "timestamp.php",
            success: function(data) {
                if (data == 'true') {
                    update();
                }		   
            }
        });
    }, 10000);
});
</script>

Die Funktion timestamp() und die darin aufgerufene Datei update.php dienen hier nur dazu, die Datei file.txt zu bearbeiten, so dass ein neuer Zeitstempel erzeugt wird.

Folgender Code wird dorthin geschrieben, wo später die Ausgabe des PHP-Scripts erscheinen soll:

1

<div id="refresh" style="text-align:center;"></div>

Die Datei refresh.php enthält die Ausgabe, die angezeigt werden soll, falls die Datei geändert wurde. In diesem Beispiel wird einfach nur nochmal das letzte Änderungsdatum der Datei ausgegeben.

In der Datei timestamp.php wird überprüft, ob sich der Zeitstempel verändert hat. In diesem Beispiel erhält die Datei das Label “neu”, wenn sie vor weniger als 10 Sekunden verändert wurde. 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

<?php

$datei = "time.txt";
$array = file($datei);
$max = sizeof($array);

if ((strtotime(date('Y-m-d H:i:s')) - strtotime($array[$max-1])) > 10) {
    echo "false";
} else {
    echo "true";
}

?>

In der Datei update.php wird einfach nur der Dateiinhalt verändert. Zusätzlich dazu wird in der Datei time.txt ein neuer Zeitstempel eingetragen, falls eine Änderung vorgenommen wurde. 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

<?php

$datei = fopen("file.txt","w");
fwrite($datei, "Die ist die Datei, die laufend geändert wird.");
fclose($datei);

$datei = fopen("time.txt","a");
fwrite($datei, date("Y-m-d H:i:s", filemtime('file.txt'))."\n");
fclose($datei);

?>

Die Datei time.txt sollte leer sein, in der Datei file.txt kann irgendein Inhalt stehen oder auch leer sein, in diesem Beispiel wird der Inhalt der file.txt beim Update überschrieben.

Erklärung

Im head-Bereich wird alle 10 Sekunden ein Javascript ausgeführt, das überprüft, ob eine aktueller Zeitstempel in der Datei time.txt steht. Wird ein aktueller Zeitstempel gefunden, wird die Funktion update() aufgerufen, die den Inhalt des Containers aktualisiert. Ist kein aktueller Zeitstempel vorhanden, so wird an dem Containerinhalt nichts verändert. Ein neuer Zeitstempel muss dann in die Datei time.txt eingetragen werden, wenn die Datei file.txt verändert wird. Dies geschieht zusammen mit der Veränderung in der Datei update.php.
Da das Javascript im head-Bereich nur alle 10 Sekunden ausgeführt wird, kann es u.U. kurz dauern, bis eine Änderung angezeigt wird. Die Aktualisierungsrate kann natürlich erhöht werden, dies kann jedoch u.U. zu Lasten der Performance des Servers gehen.

Demo