无头谷歌浏览器:如何防止网站知道他们的窗口是否聚焦



有没有办法阻止站点知道它们是否可见?

也许是命令行标志?我在这里查过了,但找不到合适的https://peter.sh/experiments/chromium-command-line-switches/.

我认为他们使用了页面可见性API:https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API

如果你的目标是欺骗可见性API,那么在相关页面或框架中注入这段脚本:

await page.evaluate(`
Object.defineProperty(window.document,'hidden',{get:function(){return false;},configurable:true});
Object.defineProperty(window.document,'visibilityState',{get:function(){return 'visible';},configurable:true});
window.document.dispatchEvent(new Event('visibilitychange'));
`);

它首先覆盖window.hidden,使其返回false。然后,它触发visibilitychange事件来通知文档,以防页面已经隐藏。

或者在创建文档后立即覆盖API:

await page.evaluateOnNewDocument(`
Object.defineProperty(window.document,'hidden',{get:function(){return false;},configurable:true});
Object.defineProperty(window.document,'visibilityState',{get:function(){return 'visible';},configurable:true});
`);

页面可见性API

根据文档"页面可见性",API可以在文档不可见时避免页面执行不必要的任务,从而节省资源并提高性能。

根据页面可见性级别2 W3C编辑草案:

页面可见性API定义了一种方法,用于以编程方式确定顶级浏览上下文的可见性状态,并在可见性状态更改时得到通知。在不知道页面的可见性状态的情况下,web开发人员一直在设计网页,就好像它们总是可见的一样。这不仅会导致更高的机器资源利用率,而且会阻止web开发人员根据网页对用户是否可见来做出运行时决策。在了解网页的可见性状态的情况下设计网页可以改善用户体验并提高网站的能效。

使用此API,web应用程序可以根据用户是否可见来选择更改其行为。例如,当页面不再可见时,此API可用于缩减工作。


可见性状态

顶层浏览上下文的文档可以处于以下任一可见性状态:

  • 隐藏:文档在任何屏幕上都不可见
  • 可见:文档至少在一个屏幕上部分可见

可见性状态通过VisibilityState枚举反映在API中,如下所示:

enum VisibilityState {
"hidden", "visible"
};

扩展

本规范对文档接口进行了如下扩展:

partial interface Document {
readonly attribute boolean hidden;
readonly attribute VisibilityState visibilityState;
attribute EventHandler onvisibilitychange;
};

用法示例

为了提高用户体验和最佳CPU和电源效率,应用程序可以在应用程序可见时自动播放视频,并在应用程序隐藏时自动暂停播放:

const videoElement = document.getElementById("videoElement");
// Autoplay the video if application is visible
if (document.visibilityState === "visible") {
videoElement.play();
}
// Handle page visibility change events
function handleVisibilityChange() {
if (document.visibilityState === "hidden") {
videoElement.pause();
} else {
videoElement.play();
}
}
document.addEventListener('visibilitychange', handleVisibilityChange);

此外,@MichalMahemoff在这篇博客中进一步表示,多标签浏览是目前的常态,你不能仅仅因为你的应用程序正在运行就认为用户正在观看它,而新的页面可见性API让你的应用程序发现它是否可见。您可以使用API来减少不必要的网络活动和计算。如果您使用的是当前ChromeChromium版本中的任何一个,如果当前页面通过document.webkitHidden隐藏,您可以在控制台中试用。但是,document.webkitVisibilityState将返回一个指示当前状态的字符串,该字符串是visiblehiddenprerendered中的一个。当这些更改发生时,例如当用户打开应用程序的选项卡或离开该选项卡时,将触发一个新的webkitvisibilitychange事件。


解决方案

所有这些交互都可以使用visibility.js来观察,visibility.js是页面可见性API的包装器,允许您确定您的网页对用户是可见的,还是隐藏在后台选项卡或预呈现中。它还允许您在JavaScript逻辑中使用页面可见性状态,并通过禁用不必要的定时器和AJAX请求来提高浏览器性能,或改善用户界面体验(例如,当用户切换到另一个浏览器选项卡时,通过停止视频播放或幻灯片放映(。

特定于Firefox的解决方案:另一种特定于火狐的解决方案可以是为火狐使用禁用页面可见性API扩展,该扩展将禁用所有页面的API。

在这里你可以找到关于如何在geckodriver 中永久安装扩展的详细讨论

特定于Chrome的解决方案:另一种特定于Chrome浏览器的解决方案可以是使用Chrome Web Store中的Don't Make Me Watch扩展。

在这里,您可以找到关于如何使用python 在selenium中的chrome驱动程序中加载扩展的详细讨论

相关内容

最新更新