锚标记 - 在 iphone/6s plus 中没有让鼠标按下日志

Question

我正在尝试在 mywebsite 上记录一些事件。我在我的文档上添加了 mousedown 侦听器并获取单击任何元素的事件。 每当单击任何元素时，我都会在我的服务器上发出请求。 它在桌面浏览器和安卓手机上也能正常工作。 但是在 iphone/safari 中，锚标记的事件正在捕获，但在将请求发送到服务器之前，它正在导航到另一个页面。而且我的日志没有保存在服务器上。

我这样添加了监听器：

   window.addEventListener("mousedown", function(e) {
console.log("mouse donwn called>>")
var { value, innerHTML, type, tagName,  } = e.target || {};
var params = {value,innerHTML, type,tagName};
  fetch("http://127.0.0.1:6360/log-tracking", {
      method: "POST",
      headers: {
          "Content-type": "application/json",
          Accept: "application/json"
      },
      body: JSON.stringify(params)
  });
});

我的服务器是：

  app.all("/log-tracking", async (req, resp) => {
     console.log("server called>>>>>>>>");

     });

但是对于锚标签，iphone6s/7中没有保存日志。

请就此提出任何建议。

Answer 1

当您在 windows 上获得鼠标按下事件时，我在这里设置条件，如果您在锚标记上有事件，将默认阻止重定向并保持您的日志成功提交。从日志文件得到响应后。它会将页面重定向到目标 URL。

window.addEventListener("mousedown", function(e) {

if(e.target.tagName.toLowerCase() === 'a')
{
  e.preventDefault();
  var url = e.target.href; //this is the url where the anchor tag points to.
  var { value, innerHTML, type, tagName,  } = e.target || {};
  var params = {value,innerHTML, type,tagName};
  fetch("http://127.0.0.1:6360/log-tracking", {
   method: "POST",
   headers: {
      "Content-type": "application/json",
       Accept: "application/json"
   },
   body: JSON.stringify(params)

   }).then(function(response) {
     window.location=url;
   });
}
else 
{ 
 console.log("mouse donwn called>>")
 var { value, innerHTML, type, tagName,  } = e.target || {};
 var params = {value,innerHTML, type,tagName};
 fetch("http://127.0.0.1:6360/log-tracking", {
   method: "POST",
   headers: {
      "Content-type": "application/json",
       Accept: "application/json"
   },
   body: JSON.stringify(params)
  });
}
});