在JavaScript中隐藏/欺骗引用者的最可靠方法是什么？

Question

通常，引荐来源可追溯到：

• JavaScript的document.referrer
• 请求标头，例如PHP的$_SERVER['HTTP_REFERER']

我已经设置了一个Codepad演示 ，它显示了这些属性，用于测试目的。

要求：

1. 应该有效地隐藏原始引用者，至少对于所有鼠标事件都是如此。
2. 跨浏览器支持（至少Chrome和Firefox）。
   
3. 独立，没有任何外部内容（插件，库，重定向页面......）。
4. 无副作用：链接不应被改写，历史记录项应予以保留 。

在关注<a href="url">链接时，该解决方案将用于隐藏引荐来源。

---

用例的确切描述

如在Webapps上的此问题中所述，Google搜索中的链接会在点击时进行修改。 所以，

1. Google可以跟踪您的搜索行为（隐私 - ）
2. 页面请求稍有延迟。
3. 链接的网页无法跟踪您的Google搜索查询（隐私++）
4. 拖动/复制的网址类似于http://google.com/lotsoftrash?url=actualurl 。

我正在开发一个用户脚本（Firefox）/内容脚本（Chrome） ^{（ 代码 ）} ，它删除了Google的链接残缺事件。 结果，处理了第1,2和4点。

第3点仍然存在。

• Chrome： <a rel="noreferrer">
• Firefox： data-URIs 。 我已经创建了一种复杂的方法来实现左键和中键的这个功能，同时仍然执行第4点。 但是，我正在努力使用右键单击方法。

Answer 1

我找到了一个适用于Chrome和Firefox的解决方案。 我在用户脚本中实现了代码， 不要跟踪我谷歌 。

演示（在Firefox 9和Chrome 17中测试）： http ： //jsfiddle.net/RxHw5/

推荐人隐藏Webkit（Chrome，..）和Firefox 37+（33 + *）

基于Webkit的浏览器（如Chrome，Safari） 支持 <a rel="noreferrer"> ^规范 。
通过将此方法与两个事件侦听器组合，可以完全实现Referrer隐藏：

• mousedown - 单击，中键单击，右键单击contextmenu，...
• keydown （ Tab Tab Tab ... 输入 ）。

码：

function hideRefer(e) {
   var a = e.target;
   // The following line is used to deal with nested elements,
   //  such as: <a href="."> Stack <em>Overflow</em> </a>.
   if (a && a.tagName !== 'A') a = a.parentNode;
   if (a && a.tagName === 'A') {
      a.rel = 'noreferrer';
   }
}
window.addEventListener('mousedown', hideRefer, true);
window.addEventListener('keydown', hideRefer, true);

*自33以来，Firefox支持rel=noreferrer ，但支持仅限于页内链接。 当用户通过上下文菜单打开选项卡时，仍会发送引荐来源。 此错误已在Firefox 37中^{修复 [ bug 1031264 ]} 。

引用者隐藏旧版Firefox

Firefox不支持rel="noreferrer"直到版本^{33` [ bug 530396 ]} （或37，如果你想隐藏上下文菜单的引用者）。

可以使用data-URI + <meta http-equiv=refresh>来隐藏Firefox（和IE）中的引用者。 实现此功能更复杂，但也需要两个事件：

• click - 单击，中键单击， 回车
  
• contextmenu - 右键单击​​， Tab Tab ... Contextmenu

在Firefox中， click事件被激发每个mouseup 和链接（或表单控件），按下回车键 。 contextmenu事件是必需的，因为click事件对于这种情况触发得太晚。

基于数据URI和瞬间超时：
触发click事件时， href属性会暂时替换为data-URI。 事件结束，并发生默认行为：打开data-URI，具体取决于target属性和SHIFT / CTRL修饰符。
同时， href属性恢复到其原始状态。

触发contextmenu事件时，链接也会contextmenu更改。

• Open Link in ...选项将打开data-URI。
• “ Copy Link location选项指的是已还原的原始URI。
• ☹ Bookmark选项指的是数据URI。
• ☹ Save Link as数据URI的点。

码：

// Create a data-URI, redirection by <meta http-equiv=refresh content="0;url=..">
function doNotTrack(url) {
   // As short as possible. " can potentially break the <meta content> attribute,
   // # breaks the data-URI. So, escape both characters.
   var url = url.replace(/"/g,'%22').replace(/#/g,'%23');
   // In case the server does not respond, or if one wants to bookmark the page,
   //  also include an anchor. Strictly, only <meta ... > is needed.
   url = '<title>Redirect</title>'
       + '<a href="' +url+ '" style="color:blue">' +url+ '</a>'
       + '<meta http-equiv=refresh content="0;url=' +url+ '">';
   return 'data:text/html,' + url;
}
function hideRefer(e) {
   var a = e.target;
   if (a && a.tagName !== 'A') a = a.parentNode;
   if (a && a.tagName === 'A') {
      if (e.type == 'contextmenu' || e.button < 2) {
         var realHref = a.href; // Remember original URI
         // Replaces href attribute with data-URI
         a.href = doNotTrack(a.href);
         // Restore the URI, as soon as possible
         setTimeout(function() {a.href = realHref;}, 4);
      }
   }
}
document.addEventListener('click', hideRefer, true);
document.addEventListener('contextmenu', hideRefer, true);

结合两种方法

不幸的是，没有直接的方法来功能检测这个功能（更不用说帐户的错误）。 因此，您可以选择基于navigator.userAgent的相关代码（即UA-sniffing），或者使用其中一种来自如何检测rel =“noreferrer”支持的复杂检测方法？ 。

Answer 2

你不能创建一个驻留在iframe中的链接系统吗？

如果围绕每个链接包装iframe，则iframe可以充当外部取消引用。 用户可以单击框架内的链接，打开其引用者设置为iFrame位置的页面，而不是实际页面。

Answer 3

根据要求，使用JavaScript：

var meta = document.createElement('meta');
meta.name = "referrer";
meta.content = "no-referrer";
document.getElementsByTagName('head')[0].appendChild(meta);

这会将以下元标记添加到网页的head部分：

<meta name="referrer" content="no-referrer" />

截至2015年，这是您阻止发送Referer标头的方法。

Answer 4

Javascript中有一个跨浏览器解决方案，它删除了引用者，它使用动态创建的iframe，你可以看一看概念证明 （免责声明：它使用了我写的一点JS库）。

Answer 5

您可以使用新的Referrer Policy标准草案来防止将referer标头发送到请求源。 例：

<meta name="referrer" content="none">

虽然Chrome和Firefox已经实现了推荐人政策的草案版本，但您应该小心谨慎，因为例如Chrome期望no-referrer而不是none （我也never见过某个地方）。 如果您只添加三个单独的元标记，我不知道该行为，但是如果不起作用，您仍然可以只实现一个短脚本，该脚本迭代所有三个值并检查在设置属性后是否确实设置了值元标记的属性。

此元标记适用于当前页面上的所有请求（ajax，图像，脚本，其他资源...）和导航到另一个页面。

Answer 6

可以在以下位置找到非常全面（但简短）的分析：

http://lincolnloop.com/blog/2012/jun/27/referrer-blocking-hard/

本文分析了在其他答案（js方法，iframe重定向）中解释的两种方法，最后提出了一个中介重定向页面方法，就像在谷歌搜索链接中看到的那样。

Answer 7

这比第一眼看上去更棘手。 看看这个项目的代码：

https://github.com/knu/noreferrer

他承诺你想要什么，但你必须在链接页面上做。

Answer 8

您要求的内容无法在Firefox中完成。

当前上下文菜单实现始终将当前文档作为引用者传递：

// Open linked-to URL in a new window.
openLink: function () {
    var doc = this.target.ownerDocument;
    urlSecurityCheck(this.linkURL, doc.nodePrincipal);
    openLinkIn(this.linkURL, "window", {
        charset: doc.characterSet,
        referrerURI: doc.documentURIObject // <----------------
    });
},

// Open linked-to URL in a new tab.
openLinkInTab: function () {
    var doc = this.target.ownerDocument;
    urlSecurityCheck(this.linkURL, doc.nodePrincipal);
    openLinkIn(this.linkURL, "tab", {
        charset: doc.characterSet,
        referrerURI: doc.documentURIObject // <----------------
    });
},

// open URL in current tab
openLinkInCurrent: function () {
    var doc = this.target.ownerDocument;
    urlSecurityCheck(this.linkURL, doc.nodePrincipal);
    openLinkIn(this.linkURL, "current", {
        charset: doc.characterSet,
        referrerURI: doc.documentURIObject // <----------------
    });
}, 

显然，不允许用户脚本更改上下文菜单实现，因此唯一的出路是浏览器扩展。

（或者，这将是一个非常糟糕的黑客，通过在contextmenu事件上调用preventDefault()来禁用上下文菜单，并使用您自己的自定义上下文菜单）

Answer 9

我使用jquery实现了一个简单但有效的iframe解决方案。

https://jsfiddle.net/skibulk/0oebphet/

(function($){
  var f = $('<iframe src="about:blank" style="display: none !important;">').appendTo('body');
  $('a[rel~=noreferrer]').click(function(event){
    var a = $(event.target.outerHTML);
    a.appendTo(f.contents().find('body'));
    a[0].click();
    return false;
  });
})(jQuery);

Answer 10

如果我们使用JavaScript提交FORM，这样就没有引用者了。

document.form_name.submit()

基本上我们提交一个带有所需ACTION方法的表格。