如果 URL 正在重定向，我的浏览器如何知道我访问了某个页面？

Question

Chrome、Safari、Firefox 或其他浏览器如何知道您访问了重定向链接的目标 URL？

我一直觉得有趣的是，浏览器知道重定向 URL 所在的 URL 并将访问的样式应用于链接。

要了解我在问什么：

• 在 Google 中输入一个随机关键字。
• 在搜索结果中找到一个蓝色链接。不要点击它。
• 复制目标 URL（通常在链接下方以绿色书写）。
• 打开一个新窗口/选项卡并将目标 URL 粘贴到地址栏中，然后点击Enter。
• 返回 Google 搜索结果，该链接立即被访问并变为紫色。

但是，该链接指向某个google.com/url...页面。谷歌是否在他们的标记中放置了一些东西来告诉浏览器将链接的历史关联到哪个 URL 或其他什么？浏览器是否只是以某种方式读取 Google 搜索结果？

Answer 1

如果您在悬停链接时注意状态栏，您会看到它最初指向“干净”的 URL。

只有当您单击链接（使用三个鼠标按钮中的任何一个）时，才会触发 JavaScript 事件，将链接的目标更改为 Google 的 URL 重定向。

要验证我的声明，只需右键单击任何紫色链接并关闭上下文菜单。除非您已经从 Google 的搜索结果中访问过该网站，否则您会看到它改变了颜色。¹

我不知道Google究竟是如何注入重定向 URL ^{2 的}，但总体思路是这样的：

// define a function `f' that changes a link's clean URL to a redirection URL
var f = function () {
    // prepend `http://www.google.com/url?rct=j&url=' to the link's target
    this.href = 'http://www.google.com/url?rct=j&url=' + escape(this.href);
    // don't invoke this function anymore when clicking the link
    this.removeEventListener('click', f);
    // don't invoke this function anymore when right-clicking the link
    this.removeEventListener('contextmenu', f);
}

// save all <a> tags in an array `a'
var a = document.getElementsByTagName('a');

// for each <a> tag in the array `a'
for (var i = 0; i < a.length; i++) {
    // execute function `f' when clicking the link
    a[i].addEventListener('click', f);
    // execute function `f' when right-clicking the link
    a[i].addEventListener('contextmenu', f);
}

你可以试试这个 jsFiddle看看它是如何工作的。

_{¹在 Chromium 25 (Ubuntu 12.10) 和 Chrome 26 (Windows 7) 上测试}

_{²最小化的 JavaScript 有点难以阅读。}