缓解“tabnabbing”不打破window.open()特征

安全问题性能命中网站打开一个新窗口都相当清楚。然而,应用相对= noopener缓解了其自身的缺点,而不是向后兼容。

在这篇文章中,我将专注于除了支持带来的问题相对= noopener在谷歌C​​hrome浏览器版本49上面的链接是你的队列读上去就可以了,如果你不熟悉的问题。

可以理解的是,这些弹出窗口都被设计成更改主文档中的“开门红”窗口的功能。一项补充帮助导航窗口可以链接用户的权利的文件。此功能在很大程度上是由Web开发社区遗忘了,直到安全谨慎的开发商在让第三方任意重定向只是因为他们会在新窗口中打开开门红页面实现了固有的安全问题。

在专为个人电脑的网站,你偶尔会遇到一种情况是网站要创建一个小的免费窗口。忽略世纪90年代末和21世纪初的弹出广告的流行,还是有一些合法的使用情况对这些窗口。例如。聊天工具,补充文件和视频弹出奏。这些用途转化为移动网页浏览器创建新的选项卡为平台不支持传统的计算机窗的概念。

然而,谷歌的Chrome版本49高达77停止支持window.open()当与标准组合-featuresnoopener特征。Chrome浏览器77是当前稳定版本,在发布的时间。例如,您既可以设置一个新打开的窗口的大小或位置要么取消设置window.opener。每当使用后者的功能,所有其他窗口的功能被忽略。

这意味着下面的两个例子将创建谷歌浏览器完yabo亚博体育下载全相同的尺寸和屏幕位置的窗口。第二示例的所提供的大小和位置的限制被忽略。

window.open( “https://example.com/”,NULL, “noopener = 1”);window.open(“https://example.com/”空“noopener = 1,高度= 500,宽度= 500,顶部= 100,左= 100“);

第二个例子工作在最新版本的Firefox和Safari浏览器就好了。

您可以创建达到同样的效果与使用noopener并获得与在同一时间老版浏览器Chrome的兼容性和更好的向后兼容性。我将引导您完成整个过程。

首先,通过创建一个空的窗口(使用空字符串或启动关于:空白)与期望的尺寸和位置。下面的示yabo亚博体育下载例创建一个新的500×500像素窗口从顶部往下100像素离开活动画面的角落。该窗口被存储在弹出变量。

VAR弹出= window.open( “关于:空白”,NULL,“高度= 500,宽度= 500,顶部= 100,左= 100“);

现在,您已经用正确的尺寸和位置打开一个未命名的空窗。然后,您可以继续通过设置临时窗口的标题给用户一些反馈。如果您没有设置标题,用户可以在一段时间窗“无题”盯着。您可以通过显式取消设置关闭上tabnabbing门弹出揭幕战。将其设置为空值能够完成任务。

最后,你可以在空白页面重定向到目标页面。下面的示yabo亚博体育下载例重定向弹出我们在上面创建https://example.com/

popup.document.title = “载入中...”;popup.opener = NULL;popup.location.replace( “https://example.com/”);

HTML规范作为2019年9月28日版的,叶子比其他所有功能noopener不确定的。我真的不能称之为谷歌Chrome浏览器的行为的错误,即使它从所有其他网络浏览器偏离。这个问题也影响到其他基于铬的Web浏览器,如勇敢,Opera和维瓦尔第。

我试图将此问题报告给Chromium项目。然而,错误提交表单返回上提交一个HTTP 400错误消息。请记录显示,我试过了。