noopenerとnoreferrerの違い！！アフィリエイト広告への影響

2020年7月6日 2020年7月7日

wordpressのリンク指定で別タブで開く（target=_blank）を指定して保存すると、自動的にaタグのrel属性にnoopenerとnoreferrerが追加されるのをご存じですか？

このnoopenerとnoreferrerについて、知っていないとアフィリエイト広告を設置している方に大きな影響を及ぼすので、noopenerとnoreferrerの意味と影響について紹介していきます。最近クリック数が減ったなと感じている方は、是非参考にしていただければと思います。

・あなたのリンク設定は大丈夫？
-----noopenerとnoreferrerの違いと意味
-----noopenerのみの記述で大丈夫？
-----別タブリンクを使う場合の対処法
・noopenerとnoreferrerの違い！！アフィリエイト広告への影響まとめ

あなたのリンク設定は大丈夫？

あなたはサイト作成をする中で、別タブリンクを指定する場合にtarget=_blankを指定していませんか？
このtarget=_blankを使って別タブリンクを指定する方法は、近年セキュリティ上の重大な脆弱性が指摘されています。
※Googleのデベロッパー向けサイトにおいても、その危険性が指摘されているので、対策をする必要性があります。

そのため使用する場合にはaタグのrel属性にnoopenerと、noopenerに対応していないブラウザ対策に、noreferrerを追加することが推奨されています。

しかしながらnoreferrerを追加することによって、アフィリエイトリンクをクリックしても、リンク先で商品を購入しても成果報酬としてカウントされないという技術的な問題が発生しているのです。

この問題はアフリエイトをされている方には、死活問題となってきます。
特にwordpressを使用している方は、別タブリンクを指定して保存するとnoopenerとnoreferrerが自動的に追加されるので、しっかりと対策をする必要があるのです。

noopenerとnoreferrerの違いと意味

<a href="" target="_blank" rel="noopener noreferrer"></a>

rel="noopener"について

このnoopenerは別タブで開くtarget=_blankを利用する際のセキュリティ対策として、使用されるようになりました。
このnoopenerを記述せずにtarget=_blankを使用していると、リンク先にサイトに悪意のあるJavascriptが記載されていた場合に、リンク元のサイトのページを不正に改ざんすることが可能になってしまうからです。

この改ざんを防止するためにも、セキュリティ対策の一環として、別タブで開くtarget=_blankを使用する際にはnoopenerを絶対に記述する必要があるのです。

ところがこのrel属性のnoopenerに対応していないブラウザが存在します。
そのための対策として、noreferrerを記述する対策が取られているのですが、ここにアフリエイトとの問題が発生しています。

rel="noreferrer"について

noreferrerはnoopenerの代替として使用されている方法です。
しかしこのnoreferrerを使用することによって、参照元のサイトが特定できないようになってしまいます。参照元のサイトがわからなくなることで、成果報酬が発生してもASP側がどこのサイト（アフリエイター）に報酬を払うべきなのか判断できないのです。

ですからアフリエイトリンクを設置する際には、必ずnoreferrerは記載しないことが重要となってくるのです。

noopenerのみの記述で大丈夫？

noopenerに対応していないブラウザはIEとEdge(特定のバージョンまで)になります。
ですからいずれnoopenerのみの記述でも問題ないようになってきます。

noopenerに対応したブラウザが気になる方は、下記サイトにてご確認ください。
Can I Use

別タブリンク（target=_blank）を使う場合の対処法

wordpressを使用している方は、下記コードをテーマフォルダ内のfunction.phpに記述してください。

//エディターでrel="noopener noreferrer"自動付加の解除
add_filter('tiny_mce_before_init','tinymce_allow_unsafe_link_target_demo');
function tinymce_allow_unsafe_link_target_demo( $mce_init ) {
	$mce_init['allow_unsafe_link_target']=true;
	return $mce_init;
}

//投稿時に強制付加されるnoreferrer削除
add_filter( 'wp_targeted_link_rel', 'wp_targeted_link_rel_custom_demo', 10, 2 );
function wp_targeted_link_rel_custom_demo( $rel_value, $link_html ){
	$rel_value = str_replace(' noreferrer', '', $rel_value);
	return $rel_value;
}

このコードを追加することによって、aタグのrel属性に自動的にnoreferrerを追加されることを防止することが可能となるのです。

注意していただきたいことは、すでにaタグのrel属性にnoreferrerが記述されて投稿されている記事に関しては、自動的に削除はされないので、別途削除していくことが必要です。

下記のプラグインを使用すると、投稿内の特定の文字を検索して置換ができるので、すでに投稿されている記事のnoreferrerを削除してください。

検索・置換をするwordpressプラグイン

・Search Regex
・Better Search Replace