4

当 A 在 Facebook 上发布链接，然后 B 在 Chrome 中单击该链接（不是在 Firefox 中，并且尚未测试其他链接）时，B 会看到选项卡上显示的蓝色背景图标 (favicon.ico) 上的 Facebook 白色“f”的链接页面。有时，大概当页面有自己的图标时，刷新该选项卡会将图标替换为正确的图标；但大多数情况下，Facebook 图标仍然存在。起初我认为 Facebook 以某种棘手的方式使用框架，但使用 View Source，情况似乎并非如此。一个人如何编程一个 href 或重定向，以便像 Facebook 那样将自己的 favicon 预加载到链接页面上？

（截屏）

这是我尝试过但没有成功的方法，我的图标被替换为什么都没有（并且仅显示在 Firefox 的选项卡和导航栏中，仅显示在 Chromium 的选项卡中，但这无关紧要）：

http://unixshell.jcomeau.com/tmp/linktest/index.html

jcomeau@unixshell:~/www/www/tmp/linktest$ cat index.html
<html>
<head>
<link rel="shortcut icon" href="favicon.ico" />
</head>
<body>
<a href="redirect.html?url=http://homesteadingsurvivalism.myshopify.com/">homesteadingsurvivalism.myshopify.com</a>
</body>
</html>
jcomeau@unixshell:~/www/www/tmp/linktest$ cat redirect.html 
<html>
<head>
<link rel="shortcut icon" href="favicon.ico" />
<script language="javascript" type="text/javascript">
var newpage = window.location.search.substring(5);
window.setTimeout('window.location = newpage; ', 3000);
</script>
</head>
<body>
<p>Redirecting to selected site, please wait...</p>
</body>

在严的评论之后，我也尝试了没有成功的redirect.cgi：

jcomeau@unixshell:~/www/www/tmp/linktest$ cat redirect.cgi; QUERY_STRING=url=http://this.is.a.test/ ./redirect.cgi 
#!/bin/bash
echo -ne "Content-type: text/html\r\n"
echo -ne "Location: ${QUERY_STRING:4}\r\n"
echo -ne "\r\n"
cat <<-EOF
    <html>
    <head>
    <link rel="shortcut icon" href="favicon.ico" />
    </head>
    <body>
    Redirecting to ${QUERY_STRING:4}
    </body>
    </html>
    EOF
Content-type: text/html
Location: http://this.is.a.test/

<html>
<head>
<link rel="shortcut icon" href="favicon.ico" />
</head>
<body>
Redirecting to http://this.is.a.test/
</body>
</html>
4

2 回答 2

2

当我向http://www.facebook.com/l.php?u=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DBwCjI4mWPFI&h=yAQG6-ic8AQF_aOjn3QCJxdul6VnDN1Ho_ltT2gX90NF-vQ发出 GET 请求时，我得到了以下响应（为了便于阅读，我在 HTML 中添加了一些换行符）：

HTTP/1.1 200
Content-Length: 349
Cache-Control: private, no-cache, no-store, must-revalidate
Expires: Sat, 01 Jan 2000 00:00:00 GMT
P3P: CP="Facebook does not have a P3P policy. Learn why here: http://fb.me/p3p"
Pragma: no-cache
Refresh: 1;URL=http://www.youtube.com/watch?v=BwCjI4mWPFI
X-Content-Type-Options: nosniff
X-Frame-Options: DENY
Set-Cookie: ***removed***
Content-Type: text/html; charset=utf-8
X-FB-Debug: ***removed***
Date: Fri, 27 Apr 2012 00:49:25 GMT
Connection: close

<html>
<head></head>
<body>
<script type="text/javascript">
document.location.replace("http:\/\/www.youtube.com\/watch?v=BwCjI4mWPFI");
</script>
<script type="text/javascript">
setTimeout("(new Image()).src=\"\\\/laudit.php?r=JS&u=http\\u00253A\\u00252F\\u00252Fwww.youtube.com\\u00252Fwatch\\u00253Fv\\u00253DBwCjI4mWPFI\";",5000);
</script>
</body>
</html>

一个简短的试验得知Refresh标题足以让这个工作。这是 PHP 中的一个简单实现：

<?php

header("Refresh: 1;URL=http://www.a-website-without-favicon.com/");

?>

但是，如前所述：这仅在您所指的网站没有网站图标时才有效。

于 2012-04-27T00:54:45.237 回答
1

虽然我不完全确定 Facebook 是如何做到的，但您可以尝试使用此处建议的代理 PHP 脚本和 AJAX 内容加载。

/* proxy.php */
<?php echo file_get_contents($_GET['url']);?>


<html><body><div id="contentArea"></div></body></html>

$("#contentArea").load('proxy.php?url=http://example.com');

首先，您将使用您喜欢的favicon.ico. 然后使用 AJAX，您将加载保留旧favicon.ico.

于 2012-04-17T02:44:37.057 回答