AJAX GET 竞争条件？

Question

我试图通过类似于以下的方法来跟踪在我的网站上单击链接时的事件。

<a href="/example" class="track">Example</a>

<script type="text/javascript">
    jQuery(function($) {
        // track clicks on all anchor tags that require it
        $('a.track').live('click', function(e) {
            // send an AJAX request to our event tracking URL for the server to track it
            $.get('/events/track', {
                    url: $(this).attr('href'),
                    text: $(this).text()
            });
        });
    });
</script>

我遇到的问题是新页面加载会中断 AJAX 请求，因此有时不会跟踪这些事件。我知道 Google Analytics 有一个 _trackPageview 函数，可以附加到 onclick 事件，但这似乎不是问题。我想知道他们的调用与我的调用有什么不同，我看到了这种竞争条件，而 GA 没有。例如：

<a href="/example" onclick="javascript:pageTracker._trackPageview('/click/example');">Example</a>

请注意，我并不担心 AJAX 请求的结果...我只是希望它能够 ping 服务器，告知发生了事件。

（另外，我希望我至少会得到一个答案，即简单地从服务器端而不是客户端跟踪新页面加载。这不是这个问题的可接受答案。我正在寻找就像 Google Analytics（分析）的 trackPageview 函数如何处理锚标记的点击事件，无论是否加载新页面。）

Answer 1

通过像 Charles 这样的代理运行 Google 的 trackPageview 方法表明，对 trackPageview( ) 的调用会通过设置各种参数从 Google 服务器请求像素，这就是大多数分析包最终实现的方式这样的功能（Omniture 也是如此）。

基本上，为了解决异步请求未完成的问题，他们让客户端请求图像并在服务器端处理这些请求中传递的参数。

为了您的目的，您需要实现同样的事情：编写一个实用程序方法，从您的服务器请求图像，通过 URL 参数传递您感兴趣的信息（例如 /track.gif?page=foo.txt）。 html&link=Click%20Me&bar=baz);然后服务器会将这些参数记录在数据库中并发回 gif。

之后，它只是对您收集的数据进行切片和切块以生成报告。

Answer 2

马特，

如果您只是想确保发出跟踪像素请求并且不依赖于响应，那么只需对跟踪像素图像执行 document.write 即可完成工作。

您可以在 onclick 处理程序中执行 document.write 。

锚元素的 href 和 onclick 处理程序之间的 AFA 竞争条件涉及顺序定义良好。

首先执行事件处理脚本
默认操作随后发生（在本例中，默认处理程序是 href）
（来源：锚链接中的 Href 和 onclick 问题）

但是，是的，如果您依赖于跟踪请求对服务器的响应，那么您必须使其同步。

建议的选项是调用一些 javascript 函数来包装已定义的 onclick 处理程序，然后按顺序进行调用。确保您的跟踪请求不是异步的。

尽管建议您不应依赖跟踪像素请求的响应。