为什么 Chrome 中的 mailto 链接与 POST 请求冲突？答案

【问题标题】：Why do mailto links in Chrome conflict with POST requests?为什么 Chrome 中的 mailto 链接与 POST 请求冲突？
【发布时间】：2011-08-17 17:36:51
【问题描述】：

我不完全确定这个问题是否正确，但情况就是这样。我有一个带有两个 POST 请求的网页，它们打开了一段时间（假设不会立即响应），而我可以在页面上做其他事情。我在页面上也有一个 mailto 链接。出于某种原因，在 Chrome 中，当我单击该链接时，这两个请求会立即返回错误。我还注意到 Chrome 中的控制台将 mailto 链接显示为 GET 请求事件（单击它时）。这里发生了什么？即使 Chrome 将 mailto 链接视为请求，为什么它会与页面上的任何其他请求发生冲突？

在 Firefox 中，mailto 链接对请求的影响为零，它们只是继续工作并等待服务器响应。此外，链接本身似乎不是任何类型的请求。顺便说一句，mailto 会打开一个 Outlook 消息窗口（该部分在 Chrome 中工作正常，只是请求失败）。

为了以防万一，我使用 jQuery $.ajax 来发起请求。

有人指出，Chrome 可能至少部分将 mailto 链接视为常规链接，因此会产生一些副作用。那么问题就变成了如何将mailto链接与页面上的请求结合起来？我无法用表单替换链接。

【问题讨论】：

发布代码可能更有帮助。
不确定我可以发布什么内容会有所帮助。 mailto 链接完全是普通的。并且 $.ajax 请求也很简单，实际上它们是从 jQuery 的站点复制粘贴开始的。他们唯一不同寻常的是，反应不会马上出现。他们都被发送到 domready 并且只是坐在那里等待服务器响应。
它还会取消 GET 请求（例如，如果您有跟踪事件的逻辑）。

标签： javascript ajax google-chrome jquery

【解决方案1】：

我最近遇到了这个问题。这实际上发生在 mailto: 或 Chrome 中的任何其他应用程序 URI 上。我使用的解决方案是在 iframe 中加载 URL：

$('body').append('<iframe id="mailto-launcher"></iframe>');
$('#mailto-launcher').get(0).contentWindow.location.href = 'mailto:?subject=test';

您还可以设置 iframe 的样式，使其在页面外呈现（使用绝对定位等）。这将启动邮件客户端，并且仍然保持文档的 AJAX 请求有效。

【讨论】：

【解决方案2】：

Google Analytics 支持建议捕获链接点击，向 GA 发送请求，等待 100 毫秒，然后更新 URL。 100ms 应该足以完成跟踪请求。 https://support.google.com/analytics/answer/1136920?hl=en

这个例子很笨拙，下面是一个自动处理所有链接的修改版本（也包括那些用 javascript 创建的/用 AJAX 加载的）：

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
  function trackOutboundLink(event){
    var url = event.currentTarget.href;
    try {
      _gaq.push(['_trackEvent', 'Outbound Links' , url]);
    } catch(err){}

    setTimeout(function() {
      document.location.href = url;
    }, 100);

    return false;
  }

  $(document).on('click', 'a[href]', trackOutboundLink);
</script>

【讨论】：

【解决方案3】：

不确定，但 Chrome 可能会将点击 mailto 链接视为导航到新页面。

有它的所有副作用，但没有真正的效果（比如重新加载页面。）

【讨论】：

嗯，实际上可能是这样。但这会有点愚蠢，不是吗。为什么会这样对待它？
@ilia：为什么不呢？仅仅因为请求碰巧使用了http 或https 以外的处理程序？您一次只被允许在一个页面上发出一个基本请求。单击一个链接会取消通过您之前单击的其他链接的加载。
抱歉，我不知道......也许 Chrome 只是以不同的方式处理它们，也许更容易（开发方面）让它们像下载一样工作（例如运行默认的电子邮件处理程序。）编辑: 或者可能是 Tomalak 所说的。 ;)
@Tomalak “仅仅因为请求碰巧使用了除 http 或 https 之外的处理程序吗？”嗯，是的！ :) 它不是标准链接，它的行为（至少部分）不像标准链接，所以它不应该导致这个问题。我实际上尝试向它添加目标空白并且它可以工作，但它也会打开一个新的空白选项卡。叹息
@ilia：它完全是一个标准链接。

【解决方案4】：

当单击电子邮件链接时，此问题阻止我向 Google Analytics 发送事件。

作为一种解决方法，我更改了 mailto 的目标：指向 _blank 的链接。这会导致浏览器在打开 Mail.app 之前打开一个空选项卡，但 GA 集成现在可以工作了。

【讨论】：

【解决方案5】：

这里也一样，到 mixpanel 的 POST 被取消了。我们的解决方法是使用 1 秒的 setTimeout 调用 mailto: 链接，它工作得很好。不太好，很难，但周五晚上 10 点在办公室听起来还不错:)

【讨论】：