1

我正在尝试遵循https://developers.google.com/web/tools/lighthouse/audits/noopener和https://mathiasbynens.github.io/rel-noopener/的建议，并尝试为rel成为noreferrer noopener。问题是我无法设置该href值，因为它是动态的。我需要对我的内部端点进行 Api 调用以获取 url。因此，我想知道以下是否仍然有效

   <a ng-click="getUrl()" rel="noreferrer noopener">
                            <i class="action icon view"></i>
   </a>

   var getUrl = function() {
         // call some endpoint, on success
         $window.open(url, '_blank');
   }

设置值还有什么rel价值吗？

4

1 回答 1

1

它不起作用：noopener在问题的情况下，该属性不会产生预期的效果——也就是说，对于从没有该href属性的链接打开的窗口/选项卡。简单测试：

<!doctype html>
<title>simple noopener test</title>

<a onclick = "getUrl()"
rel = "noreferrer noopener">Case 1: click here to open a new tab that <b>will</b>
have access to the window object of this document (despite the'noopener')</a>

<p>
<a href="http://example.com"
rel = "noreferrer noopener">Case 2: click here to open a new tab that <b>will not</b>
have access to the window object of this document (because of the'noopener'</a>

<script>
var getUrl = function() {
  window.open("http://example.com", '_blank');
}
</script>

In Case 1 in that example, if you check the window.opener of the new tab/window that gets opened, you’ll see it’s non-null. But check the new window/tab in Case 2, and you’ll see it’s null.

Is there still any value on setting rel value ?

No—for the case in the question, it seems there’s no value in setting noopener, because it’s not going to prevent the new window/tab from access to the window of the document that opened it.

于 2017-08-30T01:07:20.120 回答