Question

我有一个基本的html页面，其中包含指向不同站点的链接。我想要做的是跟踪点击次数。我是通过在链接的Click事件上发送0像素图像调用而不在点击事件上返回false来实现的。

除了Safari（在Windows操作系统上）以外，所有浏览器都能正常工作。

当使用javascript点击链接时，我会延迟重定向并将图像请求发送到服务器并记录服务器端的点击。我已经尝试增加延迟但没有成功......跟踪器在所有浏览器上工作gr8除了Safari之外根本没有发送请求。

我不知道为什么但是可能它的safari在发出请求之前等待完整的js执行，并且在执行整个js之后它会被重定向....

=============================================== ==========

<html>
  <head>
    <script type="text/javascript">
      function logEvent(){
    image = new Image(1,1);
    image.onLoad=function(){alert("Loaded");};
    image.onLoad=function(){alert("Error");};
    image.src='http://#path_to_logger_php#/log.php?'+Math.random(0, 1000) + '=' + Math.random(0, 1000);             
    pauseRedirect(500);
      }

      function pauseRedirect(millis){
    var date = new Date();
    var curDate = null;
    do {curDate = new Date();}
    while(curDate-date < millis);
      }
    </script>   
  </head>
  <body>        
    <a href="http://www.google.com" onclick="logEvent(); return true;">Site 1</a><br/>
    <a href="http://www.yahoo.com" onclick="logEvent(); return true;">Site 2</a><br/>
  </body>
</html>

=============================================== ==========

代码适用于chrome，firefox，ie和Opera。仅适用于Safari .....任何线索....

Answer 1

我对所有WebKit浏览器都有同样的问题。在所有其他人中，您只需要执行新的Image（）。src =“url”，即使导航到新页面，浏览器也会发送请求。 WebKit会在您刚刚导航到新页面之前停止发送请求。尝试了几个将图像注入文档的黑客，甚至通过img.clientHeight force a re-paint。我真的不想使用event.preventDefault，因为当链接具有target =“_ blank”，表单提交等时，这会导致很多麻烦。使用同步XmlHttpRequest为支持Cross Origin Resource Sharing的浏览器结束，因为即使您没有阅读响应，它也会将请求发送到服务器。同步请求具有在等待响应时锁定UI线程的不幸副作用，因此如果服务器很慢，页面/浏览器将锁定直到它收到响应。

var supportsCrossOriginResourceSharing = (typeof XMLHttpRequest != "undefined" && "withCredentials" in new XMLHttpRequest());
function logEvent() {
    var trackUrl = 'http://#path_to_logger_php#/log.php?'+Math.random(0, 1000) + '=' + Math.random(0, 1000);
    if(supportsCrossOriginResourceSharing) {
        xhrTrack(trackUrl);
    } else {
        imgTrack(trackUrl);
    }
}

function xhrTrack(trackUrl) {
    var xhr = new XMLHttpRequest();
    xhr.open("GET", trackUrl, false);
    xhr.onreadystatechange = function() {
        if(xhr.readyState >= this.OPENED) xhr.abort();
    }
    try { xhr.send() } catch(e) {}
}

function imgTrack(trackUrl) {
    var trackImg = new Image(1,1);
    trackImg.src = trackUrl;
}

链接点击跟踪在Safari浏览器上不起作用

1 个答案: