0

En esta oportunidad los molesto ya que estoy tratando de armar un script que al cerrar el navegador envíe por ajax el tiempo que duro la visita en el sitio.

Según tengo leído el evento solo se puede hacer con el método navigator.sendBeacon con javascript, el problema de este script es que no llegan los datos por ajax.

¿Es posible que ambos input sean hidden y el valor llegue igual? ¿En que estoy fallando?

Muchas gracias

Como contador utilizo la librería: TimeMe JS https://github.com/jasonzissman/TimeMe.js/blob/master/timeme.js

<script src="timeme.js"></script>
    <script type="text/javascript">
        TimeMe.initialize();
        window.onload = function(){
            setInterval(function(){
                var timeSpentOnPage = TimeMe.getTimeOnCurrentPageInSeconds();
                document.getElementById('timeInSeconds').value = timeSpentOnPage.toFixed(2);
            }, 25);
        }
    </script>
    <script type="text/javascript">
    window.onunload = function analytics(event) {
      if (!navigator.sendBeacon) return;

      var url = "s.php";


      var xq = document.getElementById("stats").value;
      var sid = document.getElementById("sid").value;


      var data = "sid=" + sid + "&time=" + xq;


      var status = navigator.sendBeacon(url, data);


      console.log("sendBeacon: URL = ", url, "; data = ", data, "; status = ", status);
    };

</script>

Y el html es el siguiente

<div class="time-message">
        <h1>
            <input type="text" id="sid" value="22" />
            <input type="text" id="timeInSeconds" value="" />
        </h1>
    </div>

1 respuesta 1

0

Lo puedes hacer usando un Blob con javascript para que se te haga mas fácil.

function getValue(el) {
  return document.getElementById(el).value;
}
window.addEventListener('unload', function () {
  if (!navigator.sendBeacon) return;
  var sid = getValue('sid');
  var xq = getValue('stats');
  var data = {
    sid: sid,
    time: xq
  };
  var blob = new Blob([JSON.stringify(data)], {
    type: 'application/json'
  });
  navigator.sendBeacon('./s.php', blob);
})

Para recoger los datos desde PHP, lo puedes hacer de la siguiente forma

<?php
$sid = $_POST['sid'];
$xq = $_POST['time'];
// aquí puedes ejecutar la inserción de esos datos a tu base de datos

El método sendBeacon envía datos mediante el método POST.

5
  • @ExPxHx he editado mi respuesta, espero y eso te pueda ayudar. el 16 may. 2020 a las 22:11
  • Muchas gracias por tu ayuda!, estaba revisando y en PHP las variables por post llegan todas NULL, alguna idea? muchas gracias de nuevo!
    – ExPxHx
    el 17 may. 2020 a las 0:01
  • Puedes intentar usando $_REQUEST en lugar de $_POST el 17 may. 2020 a las 1:33
  • La solución: $data = json_decode(file_get_contents('php://input'), true); $sid = $data['sid']; $time = $data['time'];
    – ExPxHx
    el 17 may. 2020 a las 2:52
  • Gracias por tu ayuda! un fuerte abrazo
    – ExPxHx
    el 17 may. 2020 a las 2:52

Tu Respuesta

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

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