0

tengo un código que me muestra el tiempo restante a una fecha y hora establecidas por mí, pero solo sé hacerlo usando la hora local (la que tenga el usuario en el ordenador), pero yo necesito que se use la del servidor a la hora de calcular el tiempo.

Esta es una parte del código (con la hora local como referencia):

<script type="text/javascript">

var target_date = new Date("May 17, 2018 20:18:20").getTime();
var days, hours, minutes, seconds;

function timeLeft() {
var countdown = document.getElementById("countdown");
setInterval(function () {
    var current_date = new Date().getTime(); //AQUÍ SE RECOGE LA HORA LOCAL DEL USUARIO
    var seconds_left = (target_date - current_date) / 1000;
    days = parseInt(seconds_left / 86400);
    seconds_left = seconds_left % 86400;
    hours = parseInt(seconds_left / 3600);
    seconds_left = seconds_left % 3600;
    minutes = parseInt(seconds_left / 60);
    seconds = parseInt(seconds_left % 60);

if (days >= 1) {
    temporizador.innerHTML = 'Faltan '  + days + ' días.';
} else if (hours >= 1) {
    temporizador.innerHTML = 'Faltan '  + hours + ' horas.';
} else if (minutes >= 1) {
    temporizador.innerHTML = 'Faltan '  + minutes + ' minutos.';
} else if (seconds >= 1) {
    temporizador.innerHTML = 'Faltan '  + seconds + ' segundos.';
} else {
    temporizador.innerHTML = 'Finalizado';
}

            }, 1000);

}

</script>

¿Alguien me ayuda a reemplazar eso por una variable que recoja la fecha del servidor?

2
  • La fecha del servidor solo esta disponible en el servidor. Por lo tanto no puedes hacerlo en javascript. Tendrias que hacerlo en PHP a menos que uses Ajax.
    – alanfcm
    Commented el 17 may. 2018 a las 18:37
  • Mira mi respuesta.
    – lalengua
    Commented el 17 may. 2018 a las 18:44

2 respuestas 2

0

Recientemente he tenido un problema/duda similar al respecto. Personalmente, no recomiendo que utilices la hora del servidor si vas a realizar un temporizador. Ya que deberías estar haciendo constantemente peticiones al servidor. La única solución que respondiese concretamente a tu petición sería pedir la fecha actual al servidor una vez, y a partir de ahí, mediante JS ir actualizando esa misma hora, añadiendole milisegundo a milisegundo. No sé hasta que punto puede ser viable esa opción.

Esta es la solución a la que yo he llegado, a mi manera :)

JavaScript

$(function(){
    var tiempoRestante= undefined;  
    var timer;
    $.ajax({
        url : "./Controller/AuctionController.php",
        method: "POST",
        data : {"metodo":"tiempoSubasta", "codSubasta": $("#tiempoRestante").attr("data")}
    }).done(function (response){
        // console.log(response);
        var json = JSON.parse(response);
        tiempoRestante = json*1000;
        timer = setInterval(comprueba,1000);

    });



    function formatearTiempoRestante(fechaFin){
        var fechaActual = new Date();
    // Tomar todos los segundos que diferencian con respecto a la fecha final
        var dif = Math.abs(fechaFin - fechaActual) / 1000;

        // calcula y resta los dias
        var days = Math.floor(dif / 86400);
        dif -= days * 86400;

        // calcula y resta las horas
        var hours = Math.floor(dif / 3600) % 24;
        dif -= hours * 3600;

        // calcula y resta los minutos
        var minutes = Math.floor(dif / 60) % 60;
        dif -= minutes * 60;

        // lo que queda son segundos
        var seconds = Math.floor(dif % 60);

        return new Array(formatFechas(days, 10), formatFechas(hours, 10), formatFechas(minutes, 10), formatFechas(seconds, 10));
    }

    function comprueba (){
        if(tiempoRestante - (new Date()) <=0){
            clearInterval(timer);
            $("#tiempoRestante").text("SE ACABÓ");
        }else{
            var tiempo = formatearTiempoRestante(tiempoRestante);

            if(tiempo[0]<=0 && tiempo[1] <= 0 && tiempo[2] <=0 && tiempo[3] <=0) {
                clearInterval(timer);
                $("#tiempoRestante").text("SE ACABÓ");
            }else{
                $("#dias").text(tiempo[0]);
                $("#horas").text(tiempo[1]);
                $("#minutos").text(tiempo[2]);
                $("#segundos").text(tiempo[3]);
            }
        }


    }


});


function formatFechas(nr, base){
  var len = (String(base).length - String(nr).length) + 1;
  return len > 0? new Array(len).join('0') + nr : nr;
}`

PHP - Controller

<?php

require_once("../Model/dbmanager.php");

session_start();
class AuctionController{

    public function __construct($metodo){

        // $this->$metodo();
    }

    public static function ejecuta($metodo){
        self::$metodo();
    }

    public function tiempoSubasta(){
        $codS = $_POST['codSubasta'];
        $fechaFin = DbManager::getFF($codS);
        if($fechaFin==-1){
            echo "ERROR";
        }else{

            echo json_encode(strtotime($fechaFin),JSON_FORCE_OBJECT);
        }

    }

}

if(isset($_POST['metodo'])){
    AuctionController::ejecuta($_POST['metodo']);
}else{
    header("Location: ../index.php");
}


?>

PHP - BD

<?
class DbManager{
    public static function getConnection(){
        $inst = Conexion::getInstance();
        return $inst->getConnection();
    }

    public static function getFF($codSubasta){
        $connection = self::getConnection();
        $sql = "SELECT FechaFin FROM Subasta WHERE CodSubasta =".$codSubasta;
        $result = $connection->query($sql);
        if($result){
            $row = $result->fetch_array();
            return $row["FechaFin"];
        }else{
            return -1;
        }

    }
}
?>

PHP - Conexion

<?php
class Conexion{
    protected $con;
    private $_host = "localhost";
    private $_username = "dwes";
    private $_pass = "abc123.";
    private $_database = "subastas";
    protected static $instance;
    private function __construct(){
        $this->con = new mysqli($this->_host, $this->_username,$this->_pass, $this->_database);

        // Error handling
        if(mysqli_connect_error()) {
            trigger_error("Failed to conenct to MySQL: " . mysql_connect_error(),
                 E_USER_ERROR);
        }
    }

    private function __clone(){}

    public function getConnection() {
        return $this->con;
    }
    /**
        @return instance
    */
    public static function getInstance() {
        if(!self::$instance) { // If no instance then make one
            self::$instance = new self();
        }
        return self::$instance;
    }
}
?>

Espero que te pueda servir de ayuda.

-1

Agrega la fecha del servidor a un elemento del HTML de tu archivo PHP, por ejemplo si estas utilizando un index.php agrega un input y coloca en el value con PHP la hora del servidor con la función date():

<input id="serverDate" type="hidden" value="<?php echo date('Y-m-d')?>">

Después en tu archivo de javascript obtienes el value del input y lo pasas al constructor de Date

var serverDate = document.getElementById('serverDate').value; 

var target_date = new Date(serverDate).getTime();
1
  • Esta respuesta tampoco considera la diferencia horaria entre cliente (JS) y servidor (PHP).
    – lalengua
    Commented el 17 may. 2018 a las 19:08

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.