Horloge sur la page Web en utilisant le serveur et l'heure du système?

J'ai besoin d'ajouter une horloge à une page web. L'horloge doit être synchronisé avec un serveur, mais je n'ai vraiment pas envie de l'avoir constamment vérifier que le serveur que la page sera ouvert 24/7 sur plusieurs Pc. Est-il un moyen pour obtenir l'heure du serveur, puis utiliser les systèmes de l'horloge de la tenir à jour et vérifier que le serveur toutes les 15 minutes ou la garder synchronisés?

source d'informationauteur Shawn

  1. 16

    La façon dont je suis allé à ce sujet avant est:

    • Prenez le temps à partir du serveur,
    • Prenez le temps à partir du client (immédiatement)
    • Obtenir un décalage.
    • Lors de l'affichage de l'horloge, appliquer le décalage à l'heure actuelle sur le client.

    Vous avez seulement besoin de mettre à jour cette occasionnellement à partir du serveur.

    Le problème que vous avez eu à régler, c'est que en faisant une demande pour obtenir le temps à partir du serveur, il y aura un délai avant que vous pouvez obtenir le client à temps. Vous pouvez probablement minimiser cela en utilisant une requête ajax vers le serveur de temps et rien d'autre, ce qui permet de réduire les frais généraux et de la latence réseau, etc.

  2. 12

    +Date.now() retourne ms depuis l'époque Unix. Donc:

    • D'obtenir du temps de serveur
    • Calculer la différence entre l'heure du serveur et l'heure locale
    • Mise à jour de l'horloge à chaque seconde ou à la minute (selon ce que vous êtes en affichage) par l'obtention de l'heure locale et de l'ajuster en fonction de la différence
    • Toutes les 15 minutes de mise à jour de la différence.

    Ou quelque chose comme ça.

    Voici un violon démonstration de la première moitié:

    var serverTime = 1310127993162; //this would come from the server obviously
var localTime = +Date.now();
var timeDiff = serverTime - localTime;

setInterval(function () {
    console.log(+Date.now() + timeDiff);
}, 1000);
  3. 4

    une idée est de réponse datetime sur la page lorsqu'elle est demandée.
    comme:

    <html>
your serveside codes,
<script>
var serverdatetime = new Date("<%=Datetime.Now%>");
//use serverdatetime and update it after 15 mins.

// you can use ajax to get datetime
setTimeout(function(){
    $.ajax({
  url: 'http://yourhost.com/getdate',
  success: function( data ) {
    // use data and update serverdatetime
  }
});},54000);
</script>
server codes

</html>

    **note : ceci est une idée seulement, ne peut pas fonctionner

  4. 4
    Server Time: <input type="text" id="clock" value="" size='8'>

<script type="text/javascript">
var serverTime = <?php echo time() * 1000; ?>; //this would come from the server
var localTime = +Date.now();
var timeDiff = serverTime - localTime;

setInterval(function () {
    var realtime = +Date.now() + timeDiff;
    var date = new Date(realtime);
    // hours part from the timestamp
    var hours = date.getHours();
    // minutes part from the timestamp
    var minutes = date.getMinutes();
    // seconds part from the timestamp
    var seconds = date.getSeconds();

    // will display time in 10:30:23 format
    var formattedTime = hours + ':' + minutes + ':' + seconds;

    $('#clock').attr('value',formattedTime); <-- input id=clock
}, 1000);
</script>
  5. 0

    Vous pouvez obtenir l'heure actuelle à partir du serveur à chaque chargement de page, de sorte que même sur la première charge, vous aurez l'heure actuelle du serveur.
    Après cela, vous pouvez utiliser un timer javascript sur la page de cocher à chaque seconde, et ensuite vous aurez pratiquement une horloge de travail synchronisé avec le serveur. Vous pouvez également essayer d'appliquer les décalages, comme l'a suggéré, mais je ne le recommande pas car il y a du lag pendant les publications.

    Requête Ajax pourrait être une option intéressante.

    Des doutes, vous pouvez également cochez cette horloge!

    Aussi, W3Schools est une grande référence pour le javascript.

  6. 0
    <script>
var ctoday = <?php echo time() * 1000 ?>;
setInterval(function() {ctoday += 1000;},1000);
function startTime() {
    var today = new Date(ctoday);
    var montharray = new Array("Jan","Feb","Mar","Abr","May","Jun","Jul","Ogu","Sep","Oct","Nov","Des");
    var h = today.getHours();
    var ampm = h >= 12 ? 'PM' : 'AM';
    h = h % 12;
    h = h ? h : 12;
    var m = today.getMinutes();
    var s = today.getSeconds();
    h = checkTime(h);
    m = checkTime(m);
    s = checkTime(s);
    document.getElementById('txt').innerHTML =
    checkTime(today.getDate())+" "+montharray[today.getMonth()]+" "+today.getFullYear() + " (" + ampm +" " + h + ":" + m + ":" + s +")"; 
    setTimeout(startTime, 1000);
}

function checkTime(i) {
    if (i < 10) {i = "0" + i};
    return i;
}
</script>
<body onLoad="startTime();">
    <span id="txt"></span>
</body>
    1. Créer une Variable contient le temps de serveur à l'aide de PHP.
    2. Ajoute 1000 à l'horodatage toutes les 1 s (1000 = 1 s).
    3. maintenant obtenir la Heures.
    4. Maintenant instancier une nouvelle date avec incrémenté de l'heure.
    5. crée un mois, les noms de
    6. détecter AM ou PM.
    7. convertir les heures format de 24 à 12
    8. Obtenir le procès-verbal
    9. Obtenir les secondes
    10. ajouter 0 conduit si le nombre d'heures inférieur à 10
    11. ajouter 0 conduit si minutes moins de 10
    12. ajouter 0 conduit si secondes de moins de 10
    13. Maintenant concaténer tous les temps et de la date et de les mettre dans l'élément du DOM
      avec l'ID "txt"
    14. répéter la fonction toutes les 1 s
    15. fonction ajoute 0 à conduire les numéros de < 10
  7. 0

    Essayer de code ci-dessous ce :

    var m_serverDateTime;
var currentOffsetedTime;
var diffMilliseconds;

$(document).ready(function () {
   m_serverDateTime = getServerDateTime();/*your function to get server time 
by ajax call */   
diffMilliseconds = GetServerTimeDifference(m_serverDateTime);

});

 function GetServerTimeDifference(serverdatetime) {
  var fromdate = new Date();

  var todate = new Date(serverdatetime);

  var localdiffMilliseconds = todate - fromdate;

  return localdiffMilliseconds;
 }

setInterval(function () {
  //var currentOffsetedTime = new Date().setMinutes(diffMinutes);
  currentOffsetedTime = new Date();
  currentOffsetedTime.setMilliseconds(diffMilliseconds);

  $('#lblTimer').text(format(currentOffsetedTime, 'dd/MM/yyyy  HH:mm'));
}, 1000);
  8. 0

    vous suffit de prendre un temps de date et heure du serveur, de la charge d'appeler cette méthode et l'utilisation des moments js pour le format de la date:

    var timeMiliSecond = new Date(serverTime).getTime();
 callRepeatedly() {
    setTimeout(() => {
         timeMiliSecond = timeMiliSecond+1000;         
         serverTime=moment(newDate(timeMiliSecond)).format('MM-DD-YYYY HH:mm:ss');
         this.callRepeatedly();
      }, 1000)  
  }