可以设置about:blank的图标吗？

Question

我尝试设置使用 javascript 打开的 about:blank 页面的图标。似乎无法正常工作或通过devtools编辑html。

这是代码。

open(`javascript:(()=>{return \`<iframe src="${location.href}" frameborder="0"></iframe><script>document.title = "${document.title}"; document.head.innerHTML += "<link rel='icon' type='image/png' href='https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${location.origin}&size=64'>"<\/script><style>* {margin: 0; width: 100%; height: 100%;}</style>
    \`})()`, "_blank")

我认为这会请求谷歌的favicon api并应用所述favicon，开发工具中似乎没有任何CORS错误。由于某种原因，如果您手动打开 about:blank 并在标题中添加网站图标链接，那么它就可以工作。

Answer 1

浏览器的同源策略可防止脚本向与脚本来源不同的来源（域、协议或端口）发出请求。

在您的情况下，您尝试从与页面来源 (

https://t2.gstatic.com

) 不同的来源 (

about:blank

) 加载网站图标。这违反了同源策略，这就是它不起作用的原因。

当您在

about:blank

页面的标题中手动添加网站图标链接时，您实际上是在浏览器本身的上下文中执行此操作，而不是通过脚本。这绕过了一些安全限制。