Zobrazenie času na serveru v JavaScriptu

26. července 2001

•

Na mnohých stránkach sa stretávame s výpisom aktuálneho času. Väčšinou sa jedná o čas zistený z lokálneho počítača, čo nie je vždy vyhovujúce. Tento článok vám ukáže ako zobraziť aktuálny čas, zistený zo serveru.

Zobrazovanie aktuálneho času z lokálneho počítača je viac menej zbytočné, pretože väčšinou sa stačí pozrieť na hlavný panel. Tento skript možno niekoho aj prekvapí, prečo je na stránke iný čas (ten správny), oproti tomu lokálnemu na hlavnom panely.

Postup je jednoduchý, najskôr si zistíme čas na servery. Pre nás je vhodná funkcia, ktorá nám vráti počet sekúnd od 1.1. 1970. Potom si vygenerujeme JavaScript kde premennej priradíme hodnotu s počtom sekúnd od 1.1. 1970, ktorú nám vráti funkcia Date(„U“). Teda v PHP bude kód pre naplnenie premennej JavaScriptu počtom sekúnd od 1.1. 1970 vyzerať nasledovne:

<?php
echo „<script language=’JavaScript’>var s = “ . Date(„U“) . „</script>\n“;
?>

Všetok ostatný kód bude JavaScript a HTML. Vytvoríme si formulár, ktorý bude zobrazovať čas na našom lokálnom počítači, servery a rozdiel medzi týmito dvoma časmi.

<form name=“cas“>
<table border=“2″>
<tr><td colspan=“2″ align=“center“>Čas</td></tr>
<tr>
  <td>Lokálny:</td>
  <td><input name=“loklany“></td>
</tr>
<tr>
  <td>Server:</td>
  <td><input name=“server“></td>
</tr>
<tr>
  <td>Rozdiel:</td>
  <td><input name=“rozdiel“></td>
</tr>
</table>
</form>

Pomocou JavaScriptu by sme mohli postupovať nasledovne: k premennej s, ktorá obsahuje počet sekúnd od 1.1. 1970 by sme každých 1000 ms pripočítali jednu sekundu a vhodnou funkciou premenili počet sekúnd na čitateľný formát. Takto som to urobil najskôr i ja, avšak neskôr som zistil, že takto vznikajú veľké rozdiely, ak som si čas porovnával s lokálnym časom. Bude to pravdepodobne tým, že prikázať JavaScriptu, aby každých 1000 ms zmenil čas je nepresné, pretože samotné vykonanie kódu trvá istý čas a tak už po minúte bol rozdiel niekoľko sekúnd.

Tento problém som riešil nasledovne: vytvoril som premennú lokalny_start, ktorá obsahuje počet ms od 1.1. 1970 na lokálnom počítači. K tomu v JavaScripte slúži funkcia getTime() objektu Date().

var lokalny_start = new Date().getTime() // pocet ms od 1.1. 1970 (lokal)

Vytvoríme si funkciu, ktorá sa bude spúšťať každú sekundu. Na jej začiatku si naplníme tri premenné:

lokalny – objekt Date nastavený na aktuálny dátum a čas
posun – rozdiel medzi lokálnym aktuálnym časom a lokálnym časom pri spustení skriptu (načítaní stránky), jednoducho čas od načítania stránky v ms
server – čas na „servery“ v ms (počet sekúnd od 1.1. 1970 získaných zo serveru*1000 + posun)

Hodnoty, ktoré sme potrebovali máme naplnené, avšak v ms, preto si vytvoríme funkciu Format(ms), ktorá nám vstupný argument (počet ms od 1.1. 1970) prerobí na čitateľný formát a tento reťazec nám aj vráti.

function Format(ms){
  var hours=ms.getHours() // hodin
  var minutes=ms.getMinutes() // minut
  var seconds=ms.getSeconds() // sekund
  var days=ms.getDate() // den
  var months=ms.getMonth()+1 // mesiac
  var years=ms.getYear() // rok
  if(years<1000) years+=1900 // odstranenie nekompatibility
  if(minutes<=9) minutes="0"+minutes
  if(seconds<=9) seconds="0"+seconds
  return days + „.“ + months + „. “ + years + “ “ + hours + „:“ + minutes + „:“ + seconds
}

Potom priradíme formulárovým prvkom tie správne hodnoty a zabezpečíme, aby sa funkcia spúšťala každú sekundu.

function Cas(){
  var lokalny = new Date()
  var posun = lokalny.getTime() – lokalny_start
  var server = new Date(s*1000 + posun)
  document.cas.lokalny.value = Format(lokalny)
  document.cas.server.value = Format(server)
  document.cas.rozdiel.value = (lokalny-server)/1000 + “ sek.“
  setTimeout(„Cas()“,999)
  }

Samozrejme skript bude ukazovať nesprávny čas, ak sa už po načítaní stránky pokúsite zmeniť čas na lokálnom počítači. Ak by ste si chceli nastaviť čas podľa času, ktorý ukazuje server, museli by ste po zmene času na lokále znovunačítať stránku (Ctrl-R).

Ukážku, aký čas máte nastavený na vašom lokálnom počítači oproti serveru nájdete tu.