Homepagebau
Dateiversion:
diesen Beitrag diskutieren,
ergänzen, eine Frage stellen

PHP goes JavaScript

Schwierigkeit: für Fortgeschrittene

 

Skript und Beispiel downloadenversion: 04.09.2003


ZIP-Archiv
3 kbyte

Hinweis: Für die Installation dieses Skripts benötigen sie PHP4


Beschreibung:

Dieses Skript erzeugt die gleiche Uhr wie die reine JavaScript Version. Allerdings wird nicht die Systemzeit des Clients (also des Rechners des Besuchers) sondern die Zeitangabe des Servers verwendet.

Manche Webmaster finden das interessanter, als nur die Zeit anzuzeigen welche der Besucher bei Windows ohnehin rechts unten auf dem Desktop sieht.

Wie geht das?

Ich hoffe wir sind uns einig, dass PHP nicht geeignet ist um eine Uhr zu realisieren. PHP ist eine serverseitige Sprache und hat auf das Dokument im Browser keinen Einfluss. Das ist eine klassische Aufgabe für JavaScript. Die Frage ist: wie bekommen wir die Serverzeit, aus PHP in JavaScript?

Die Lösung liefert uns der Unix-Zeitstempel (UTC). Dabei handelt es sich um eine allgemein gebräuchliche Darstellung von Zeitangaben, welche uns sowohl unter JavaScript als auch PHP zur Verfügung steht.

// JavaScript

var zeitobjekt = new Date(UTC);

Unter JavaScript können wir mit Hilfe des Konstruktors Date() aus einem Unix-Zeitkode ein Objekt erzeugen, welches wir für die weitere Bearbeitung nutzen können. Alles was wir nun noch brauchen ist die passende PHP-Funktion, welche uns die Serverzeit als UTC liefert. Dies erreichen wir über die Methode "time()".

// PHP

$serverzeit = time();

Die Angabe in PHP erfolgt in Sekunden - allerdings verwendet JavaScript Millisekunden. Folglich fehlen uns 3 Nullstellen in der Darstellung, welche wir ergänzen müssen:

// PHP

$serverzeit = time()*1000;

setzen wir nun beides zusammen...

// JavaScript vs PHP

var zeitobjekt = new Date(<? echo time()*1000 ?>);

Damit haben wir unser JavaScript nun mit der Serverzeit initialisiert. Nun haben wir zwar die Startzeit, aber noch keine Uhr und uns bleibt daher die Aufgabe, daraus in JavaScript die aktuelle Zeit zu berechnen. Um dies zu tun, können wir uns nun allerdings der Systemuhr des Clientrechners bedienen. Alles was wir tun müssen, ist die Differenz zwischen Serverzeit und Systemzeit von der aktuellen Zeitangabe des Clients abzuziehen. Also:

// aktuelle Zeit berechnen

var differenz = (new Date()).getTime() - <? echo time()*1000 ?>;

var aktuelleZeit = new Date( (new Date()).getTime() - differenz );

Um das Ganze etwas handlicher zu machen, verpacken wir nun unseren Ansatz in eine Funktion.

// aktuelle Zeit berechnen als Funktion

var differenz = (new Date()).getTime() - <? echo time()*1000 ?>;

function javaScriptTime() {
  return new Date( (new Date()).getTime() - differenz );
};

var aktuelleZeit = javaScriptTime();

Damit sind wir nun am Ziel. Die von uns neu gestaltete Funktion javaScriptTime() liefert uns nun ein Zeitobjekt auf Grundlage der aktuellen Serverzeit. Der Rest des Skripts ist identisch zu jeder beliebigen anderen JavaScript-Uhr.

Tutorial Fortsetzung: Das Date-Objekt und JavaScript - Uhren