Nous créons une application de suivi click, qui construit des chaleur. J'écris un script que les utilisateurs supposent insérer dans leurs pages pour suivre pour travailler.
Cela fonctionne bien sur des éléments, ce qui ne nécessite pas de redirection ou de formulaire soumettre. Par exemple, si je clique sur Au cours des deux derniers jours, j'ai essayé de nombreuses façons de le faire. Tout d'abord, j'ai essayé un appel Ajax normal, puisqu'il s'agissait d'une demande de domaine croisée, je devais utiliser JSONP, mais à nouveau, cet appel AJAX n'avait pas le temps d'exécuter avant la redirection. Ajouter H1 code> ou p code> ou autre, cela fonctionne parfaitement correctement. Mais si je clique sur un A code>, la demande à notre serveur ne se produit jamais avant la redirection normale. P> async: faux code> aurait résolu le problème, mais cela ne fonctionne pas avec les demandes JSONP. J'ai donc décidé d'ajouter une variable de drapeau qui indique qu'il est prudent de se déplacer avec redirection et d'utiliser une boucle vide pendant laquelle elle devait essayer d'essayer dans le rappel Ajax. Mais la boucle tandis que la boucle bloquait le flux d'exécution, le rappel n'a donc jamais eu la possibilité de définir cette variable à true code>. Voici un code simplifié: P> $(document).click(function (e) {
//part of the code is ommited
(new Image).src = baseUrl + '?' + data;
if (tag === "a" || clickedElement.parents().has("a")) {
sleep(100);
}
return true;
});
5 Réponses :
Donc, si je comprends bien, vous souhaitez que vos journaux Ajax terminés avant que la page décharge et suit un lien href. Cela ressemble à un cas parfait où vous pourriez envisager d'utiliser différé dans jQuery. P >
Lorsque votre utilisateur clique sur tout ce qui est censé l'emmener à partir de la page, vérifiez simplement votre statut code> prometteur code>. Si ce n'est pas résolu, vous pouvez lancer une fenêtre modale sur la page et demander à l'utilisateur d'attendre jusqu'à ce que la progression soit terminée. Ensuite, ajoutez un nouveau code> sur votre laissez-moi savoir s'il s'agit du scénario. Si c'est le cas, je vais expliquer plus en détail. Aucune utilisation continue si je n'ai pas compris votre exigence correctement p> différé code>, indiquez-le de modifier l'emplacement href code> une fois que tout est complet. P>
Le script doit fonctionner de manière transparente pour l'utilisateur, je ne peux donc pas utiliser des fenêtres modales.
@ maxt3r - Si vous voulez aller à une page différente, et il y a toujours des éléments en attente sur la page en cours, n'est-ce pas mieux que si vous laissez savoir à l'utilisateur?
Non, ces scripts sont utilisés pour Analytics, le client ne devrait pas savoir à ce sujet. En outre, cela ne devrait pas trop affecter la performance de la page trop.
Vous pouvez enregistrer des informations à Ajax Demande dans des cookies ou localStorage et effectuer un travailleur qui enverra des informations. L'épargne aux cookies ou localStorage est plus rapide que AJAX-Demande. Vous pouvez faire ensuite:
$(document).click(function (e) {
var queue = localStorage.getItem('requestQueue');
queue.push(data);
localStorage.setItem('requestQueue',queue);
});
$(function(){
setInterval(function(){
var queue = localStorage.getItem('requestQueue');
while (queue.length > 0) {
var data = queue.pop();
$.ajax({
...
success: function(){
localStorage.setItem('requestQueue', queue);
}
});
}
},intervalToSendData);
});
J'ai aussi eu cette idée aussi. C'est un peu mon plan de sauvegarde, mais il y a une grande chance qu'il n'y ait pas mon script à la page suivante, de sorte que ces demandes en cache resteront dans les cookies pour toujours.
Et si la page suivante est sur un autre site Web ??
Le JavaScript est essentiellement exécuté dans un seul fil. Il n'est pas possible d'avoir votre fonction de rappel exécuté et d'avoir en même temps une boucle infinie en attente d'une variable de drapeau. La boucle infinie occupera le thread d'exécution unique et le rappel ne sera jamais appelé. P>
La meilleure approche consiste à annuler le gestionnaire par défaut de votre événement et de bouillonner pour celui-ci (renvoyer essentiellement false si vous construisez vraiment votre code de suivi avec jQuery) et effectuez les actions nécessaires (rediriger la page à l'adresse nécessaire si un lien était un lien cliqué ou déclencher d'autres actions par défaut), mais cela prendrait beaucoup de travail prudent pour recréer toutes les combinaisons possibles d'action et de rappel. p>
Une autre approche est de: 1) Recherchez quelque chose de spécifique à votre code dans les données d'événement 2) S'il n'est pas présent - apportez un appel AJAX et dans son rappel de re-déclencher la même chose même sur le même élément, mais cette fois avec votre bit spécifique ajouté aux données paires; Après que l'appel Ajax renvoie false 3) Si vos bits spécifiques sont présents dans les données - ne faites simplement rien, laissez le traitement par défaut de l'événement. P>
L'une ou l'autre approche peut mordre, cependant. P>
$(document).on('click', function (e) {
var scriptTag = document.createElement("script");
scriptTag.setAttribute("type", "text/javascript");
scriptTag.setAttribute("src", url);
document.getElementsByTagName("head")[0].appendChild(scriptTag);
return true;
}
Je jetterais un coup d'œil à l'API Navigator SendBeacon mentionné dans Cette pile Overflow répond ou directement liée à ici . P>
de la description sur le site p>
Navigator.sendBeacon (URL, données) - Cette méthode répond aux besoins des analyses et du code de diagnostic qui tente généralement d'envoyer des données à un serveur Web avant le déchargement du document. P> blockQuote>
Avez-vous essayé PreventDefault?
Où est votre
iTSAfetomoveon code> var déclarée?@JIBIABRAHAM J'ai besoin de la redirection pour arriver, PurtissDefault l'annulerait.
@ sp00m il a été déclaré dans ce gestionnaire de clic