Tengo un archivo Javascript ejecutándose en una página y me gustaría registrar ciertos eventos a medida que ocurren. Por ejemplo, tengo una tienda web, y cuando las personas agregan un artículo a su carrito, quiero registrar este evento visitando una página que construí:
function log_event(id) { window.location.href = 'https://example.com/log/cart.php?id=' + id; return false; } La página log/cart.php realmente no tiene nada que mostrar, todo lo que hace es insertar un registro en una base de datos que contiene el artículo que se agregó al carrito y la fecha.
El código que llama a esta función se ve así:
document.getElementById('add-to-cart').addEventListener('click', function() { // Add to the cart ... // Track the item that was added let id = document.getElementById('add-to-cart').getAttribute('data-id'); log_event(id); }); Con mi código actual, log/cart.php en realidad reemplaza la página actual. Quiero que la apertura de log/cart.php solo ocurra en segundo plano sin que el usuario sea interrumpido. No quiero que abra una pestaña o ventana del navegador y permita que el usuario permanezca en la página del producto.
Puede enviar una solicitud AJAX a ese punto final:
function log_event(id) { var xhttp = new XMLHttpRequest(); xhttp.open("GET", 'https://example.com/log/cart.php?id=' + id, true); xhttp.send(); return false; } fetch() también se puede usar, pero tenga en cuenta que es compatible con el navegador (sin IE).