Блог

У меня есть файл Javascript, запущенный на странице, и я хотел бы регистрировать определенные события по мере их возникновения. Например, у меня есть интернет-магазин, и когда люди добавляют товар в свою корзину, я хочу зарегистрировать это событие, посетив страницу, которую я создал:

 function log_event(id) {
  window.location.href = 'https://example.com/log/cart.php?id='   id;
  return false;
}
 

На log/cart.php странице действительно нечего отображать, все, что она делает, это вставляет запись в базу данных, содержащую товар, который был добавлен в корзину, и дату.

Код, вызывающий эту функцию, выглядит следующим образом:

 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);
});
 

С моим текущим кодом log/cart.php фактически заменяет текущую страницу. Я хочу, чтобы открытие log/cart.php происходило только в фоновом режиме без прерывания пользователя. Я не хочу, чтобы он фактически открывал вкладку или окно браузера и позволял пользователю оставаться на странице продукта.

Вы можете отправить запрос AJAX на эту конечную точку:

 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() также может использоваться, но имейте в виду его поддержку браузером (без IE).