Loose-Info.com
Last Update 2019/11/17
TOP - 各種テスト - Web関連 - <a target="_blank">使用時のテスト

<a target="_blank">で新規タブでページを開く場合の、既存ページ書き換えに関する動作確認

テスト概要(実行結果)

その1
<a>タグの href 以外の属性指定が、target="_blank" のみである場合
・リンク先ページからリンク元ページの書き換えが発生
・Webサーバーのログへの参照元情報の出力有り

その2
<a>タグの href 以外の属性指定が、target="_blank" rel="noopener" である場合
・リンク先ページからリンク元ページの書き換えの発生は無し
・Webサーバーのログへの参照元情報の出力有り

その3
<a>タグの href 以外の属性指定が、target="_blank" rel="noopener noreferrer" である場合
・リンク先ページからリンク元ページの書き換えの発生は無し
・Webサーバーのログへの参照元情報の出力無し

実行環境

Apache 2.4.34
Google Chrome 78.0

使用ファイル

各テスト共通

page0001.html
<html> <head> <meta charset="utf-8"> <title>リンク元ページ</title> </head> <body> <a href="page0002.html" target="_blank"> _blankのみ </a> <br> <a href="page0002.html" target="_blank" rel="noopener"> _blank + noopener </a> <br> <a href="page0002.html" target="_blank" rel="noopener noreferrer"> _blank + noopener + noreferrer </a> </body> </html>

page0002.html
<html> <meta charset="utf-8"> <title>リンク先ページ</title> <body> <script> window.opener.location.href = "page0003.html"; </script> リンク先ページ<br> リンク元を書き換え </body> </html>

page0003.html
<html> <head> <meta charset="utf-8"> <title>リンク先ページによって書き換えられたページ</title> </head> <body> <span style="color: blue"> _blankのみ </span> <br> <span style="color: blue"> _blank + noopener </span> <br> <span style="color: blue"> _blank + noopener + noreferrer </span> </body> </html>


その1

<a>タグの href 以外の属性指定が、target="_blank"> のみである場合
(ブラウザの新規ページは新規タブで追加される形式で確認)

******* 実行前 *******
タブ1(既存)
page0001.html
ページタイトル : リンク元ページ

******** 操作 ********
「_blankのみ」をクリック

******* 実行後 *******
タブ1(既存)
page0003.html
ページタイトル : リンク先ページによって書き換えられたページ

タブ2(新規)
page0002.html
ページタイトル : リンク先ページ

ログ出力
"GET /**/**/**/**/page0001.html HTTP/1.1" 200 360 "-" "***** Chrome/78.0.*****" "GET /**/**/**/**/page0002.html HTTP/1.1" 200 212 "http://**/**/**/**/**/page0001.html" "***** Chrome/78.0.*****" "GET /**/**/**/**/page0003.html HTTP/1.1" 200 328 "http://**/**/**/**/**/page0002.html" "***** Chrome/78.0.*****"


その2

<a>タグの href 以外の属性指定が、target="_blank"> rel="noopener" である場合
(ブラウザの新規ページは新規タブで追加される形式で確認)

******* 実行前 *******
タブ1(既存)
page0001.html
ページタイトル : リンク元ページ

******** 操作 ********
「_blank + noopener」をクリック

******* 実行後 *******
タブ1(既存)
page0001.html
ページタイトル : リンク元ページ    リンク先ページからの書き換え無し

タブ2(新規)
page0002.html
ページタイトル : リンク先ページ

ログ出力
"GET /**/**/**/**/page0001.html HTTP/1.1" 200 360 "-" "***** Chrome/78.0.****" "GET /**/**/**/**/page0002.html HTTP/1.1" 200 212 "http://**/**/**/**/**/page0001.html" "***** Chrome/78.0.*****"


その3

<a>タグの href 以外の属性指定が、target="_blank"> rel="noopener noreferrer" である場合
(ブラウザの新規ページは新規タブで追加される形式で確認)

******* 実行前 *******
タブ1(既存)
page0001.html
ページタイトル : リンク元ページ

******** 操作 ********
「_blank + noopener + noreferrer」をクリック

******* 実行後 *******
タブ1(既存)
page0001.html
ページタイトル : リンク元ページ    リンク先ページからの書き換え無し

タブ2(新規)
page0002.html
ページタイトル : リンク先ページ

ログ出力
参照元情報の出力無し
"GET /**/**/**/**/page0001.html HTTP/1.1" 200 360 "-" "***** Chrome/78.0.*****" "GET /**/**/**/**/page0002.html HTTP/1.1" 200 212 "-" "***** Chrome/78.0.*****"