我看到人们建议每当在链接中使用target =“blank”在不同的窗口中打开它时，她应该放置rel =“noopener noreferrer”。我想知道这是如何阻止我在Chrome中使用开发者工具，以及删除rel属性的。然后点击链接...
这仍然是保持漏洞的简单方法吗？
答案 0 :(得分：34)
您可能误解了漏洞。您可以在此处详细了解：https://www.jitbit.com/alexblog/256-targetblank---the-most-underestimated-vulnerability-ever/
基本上，将rel="noopener noreferrer"添加到链接可以保护您网站的用户不会让您链接到的网站可能会劫持浏览器（通过流氓JS）。
您要求通过开发者工具删除该属性 - 这只会潜在地将您（篡改该属性的人）暴露给漏洞。
答案 1 :(得分：12)
与target="_blank"上的rel="noopener noreferrer"链接 are vulnerable ，以便在用户的注意力被新打开的标签转移时，在后台调换推荐人页面。添加rel修复了该漏洞。
理论上你可以通过操作移除rel="noopener noreferrer" 客户端 ......但你为什么要这样做？你所做的只是故意让自己容易受到攻击。
访问同一网站（并且不修改自己的客户端代码）的其他用户仍然是安全的，因为服务器仍然会提供#top {
top: 0;
position: fixed;
z-index: 1;
}
.topbar {
height: 90px;
background-color: #24414e;
border-left: 2px solid #24414e;
border-right: 2px solid #24414e;
border-top: 2px solid #24414e;
border-bottom: 2px solid #24414e;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
animation-name: greeting;
animation-duration: 8s;
animation-delay: 1s;
}
@keyframes greeting {
0% {
background: url('https://cdn.dribbble.com/users/751466/screenshots/3360272/hello-3.gif');
background-size: 100% 100%;
}
60% {
opacity: 1;
}
}
/*
.topbar:hover{
background:url('https://cdn.dribbble.com/users/751466/screenshots/3360272/hello-3.gif');
background-size: 100% 100%;
}
*/
.logo {
transform: translateY(50%);
font-family: "Dancing Script";
color: #ffffff;
}
.holder {
width: 5%;
height: 80%;
margin-right: 30px;
margin-top: 10px;
}
.out {
margin-top: 46px;
color: #ffffff;
margin-right: 0;
}
.out:hover {
text-decoration: underline;
}
.menu {
height: 15%;
margin-top: 0px;
background-color: #f7ce3e;
}
/*
.iconbar{
margin-top: 20px;
margin-right: 20px;
margin-left:20px;
height =
text-align: center;
border-left: 2px solid #24414e;
border-right: 2px solid #24414e;
border-top: 2px solid #24414e;
border-bottom: 2px solid #24414e;
}
*/
.icon {
margin-top: 10px;
color: #24414e;
animation-name: iconSlide;
animation-duration: 1s;
}
.txt {
font-size: 15px;
visibility: hidden;
margin-top: 0px;
color: #24414e;
}
@keyframes iconSlide {
0% {
transform: translateX(600%);
}
100% {
transform: translateX(0);
}
}
.icon-1:hover~.txt-1 {
visibility: visible;
}
.icon-2:hover~.txt-2 {
visibility: visible;
}
.icon-3:hover~.txt-3 {
visibility: visible;
}
.icon-4:hover~.txt-4 {
visibility: visible;
}
.icon-5:hover~.txt-5 {
visibility: visible;
}
.icon-6:hover~.txt-6 {
visibility: visible;
}
.icon:hover {
color: #ffffff;
}
.rest {
height: 100%;
}
.contacts {
position: relative;
z-index: -1;
}。您的删除仅适用于您。
答案 2 :(得分：5)
所有主流浏览器都通过更新默认行为以确保安全，而无需指定 rel 属性，从而解决了此问题。在About rel=noopener中阅读更多内容。
答案 3 :(得分：2)
没有答案指出您实际上想要传递引用而忽略任何“安全风险”警告的情况：例如，当您链接您自己的外部网站（显然没有描述的安全漏洞），并且您希望出于任何原因传递引用标头。
例如，在我的例子中，在数据分析工具中，我想查看有多少访问者通过单击 Web 应用程序内的链接来阅读文档，以及有多少来自搜索引擎，因此我想利用引用标头区分这些用户组。
我在谷歌搜索了一些信息之后来到这里，然后我抑制了 react/jsx-no-target-blank eslint 警告内联。在链接网站（例如您自己的文档）时，您可以这样做：
{/* Safe link to the own website *//* eslint-disable-next-line react/jsx-no-target-blank */}
<a href="https://my-own-website.com" target="_blank">
Learn more
</a>
答案 4 :(得分：1)
锚标记rel =“ noopener”或rel =“ noreferrer”属性可以提高网站安全性，但是有些人希望忽略它，因为他们认为这会影响网站搜索引擎的优化。这只是一个神话。 它可以保护您的网站访问者的机密性，并通过传播恶意代码来阻止外部网站。
答案 5 :(得分：1)
关于Lighthouse Best Practices audits报告：
将
rel="noopener"或rel="noreferrer"添加到以下任何外部链接： 提高性能并防止安全漏洞。
通常，当您使用target="_blank"时，请始终添加rel="noopener"或rel="noreferrer"：
例如：
<a href="https://www.kaiostech.com/store/" target="_blank" rel="noreferrer">
KaiStore
</a>
rel="noopener"阻止新页面访问window.opener属性，并确保它在单独的进程中运行。rel="noreferrer"具有相同的效果，但也阻止了Referer标头发送到新页面。有关更多信息，请参见official document。
答案 6 :(得分：-1)
如果开发者控制台显示有关noopener noreferrer的警告，请确保同时添加noopener和noreferrer。链接应如下所示：
<a href="www.google.com" target="_blank" rel="noopener noreferrer" />