La publicación AJAX se cancela mediante la redirección

Question

Estoy escribiendo una pequeña secuencia de comandos para capturar clics de enlaces y guardar la URL del enlace en una tabla de base de datos para hacer un seguimiento de cuántas veces se hace clic en cada enlace. Los enlaces son a sitios externos.

Capturo el evento click en mi función de JavaScript, uso jQuery para publicar en una página PHP que guarda los datos en MySQL y luego la función de JavaScript redirige al usuario a la URL del enlace en el que hizo clic.

El problema que me estoy encontrando es que parece que la publicación nunca se completa debido a la redirección. He solucionado esto llamando a la redirección dentro de la devolución de llamada posterior, pero eso agrega unos segundos de retraso porque no se llama hasta después de que se complete la publicación. Estoy buscando una forma de publicar los datos y redirigir al usuario de inmediato, independientemente de si la publicación tiene éxito o no.

Este es el código actual con la solución alternativa. Funciona bien, pero agrega la demora:

function trackClicks(event) 
{ 
    var clicked = $(this).attr('href'); 

    $.post 
    (
     $('#track-click-post-url').attr('value'), 
     { 
      action: 'track_landing_page_clicks', 
      clicked_url: clicked, 
      nonce: $('#track-click-nonce').attr('value') 
     }, 
     function(response) 
     { 
      window.location = clicked; 
     } 
    ); 

    event.preventDefault(); 
} 

Y esto es lo que me gustaría hacer, pero cuando lo intento nunca se completa:

function trackClicks(event) 
{ 
    var clicked = $(this).attr('href'); 

    $.post 
    (
     $('#track-click-post-url').attr('value'), 
     { 
      action: 'track_landing_page_clicks', 
      clicked_url: clicked, 
      nonce: $('#track-click-nonce').attr('value') 
     } 
    ); 

    window.location = clicked; 
    event.preventDefault(); 
} 

Answer 1

jQuery no proporciona una devolución de llamada para lo que estás buscando. Estos son los estados listos disponibles:

Value State Description 
0 UNSENT open()has not been called yet. 
1 OPENED send()has not been called yet. 
2 HEADERS_RECEIVED send() has been called, and headers and status are available. 
3 LOADING Downloading; responseText holds partial data. 
4 DONE The operation is complete. 

Usted está buscando readystate 2, ya que es la primera que está consciente del hecho de que el servidor ha recibido el mensaje.

Esto debe conseguir que fuera de la tierra:

var xhr = new XMLHttpRequest(); 
xhr.open("POST", clicked); 
xhr.onreadystatechange = function() { 
    if (xhr.readyState >= 2) window.location = clicked; 
}; 
xhr.send($('#track-click-post-url').attr('value')); 

https://developer.mozilla.org/en/XMLHttpRequest para su posterior lectura.

Answer 2

Al salir de una página, todos pendientes las solicitudes se eliminan y se carga la nueva página. La primera forma es la correcta. Sí, habrá un retraso cuando se haga clic en un enlace, eso se debe a que se está ejecutando la solicitud POST.

No se puede ejecutar una solicitud en el fondo de una página, si el usuario no está en esa página.

Quizás pueda guardar la URL del enlace en una cookie y ponerla en el DB cuando se cargue la página siguiente.

Answer 3

¿Por qué publicar usando Javascript cuando va a cargar una página de alguna manera?

Simplemente actualice el db con el enlace al que se hizo clic en la página nueva.

Quizás usando la URL de referencia para rastrear en qué página fue el clic.

O alguna otra solución para saber en qué página se hizo clic (por ejemplo, url param) o de alguna otra manera.