問題 × 解決策

ページに内部リンクから移動してきたかどうかを判定する方法

問題

内部リンクから移動してきたかどうかを判定するには?

解決策

「document.referrer」でリファラーのURLを取得し、自サイトのホスト名が含まれるかどうかを「indexOf」で調べて判定する。

 

内部リンクから移動してきたかどうか

リファラ―を利用し、ページに内部リンクから移動してきたかどうかを判定する方法をご紹介します。

今回は以下の記事の応用になります。
リファラ―のURLによって処理を分ける方法

「document.referrer」でリファラーのURLを取得できる。

「document.referrer」を使用することで、リファラーのURLを取得することができます。

var referrer = document.referrer;

現在のリファラーのURL

例として、現在のリファラーのURLを以下に出力させます。

ポイント!

上記のリファラーのURLには「ホスト名(http://またはhttps://のすぐ後の○○.○○ ※スラッシュまで・スラッシュ含まず)」が含まれていることを確認できます。このホスト名を利用します。

 

現在のサイト(自サイト)のホスト名の取得

現在のサイト(自サイト)のホスト名を取得するには、以下の記述を行います。

var nowhost = location.hostname;

現在のサイト(自サイト)のホスト名

例として、現在のサイト(自サイト)のホスト名を以下に出力させます。

「indexOf」である値の中に特定の文字列が含まれているかを判定する。

「indexOf」を使用することで、ある値の中に特定の文字列が含まれているかを判定することができます。

'検索に掛けたい文字列'.indexOf('検索したい文字列')

返ってくる値

特定の文字列が含まれている場合 0以上の数値(該当した位置)
特定の文字列が含まれていない場合 -1

記述例

実際に処理を分ける記述例は以下になります。

var nowhost = location.hostname;
var referrer = document.referrer;
if(referrer.indexOf( nowhost ) != -1) {
	// 自サイトから来ている場合(内部リンク)
} else {
	// 自サイト以外から来ている場合(外部リンク)
}

コメント

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

one + 4 =

「問題 × 解決策」
月別アーカイブ一覧

「問題 × 解決策」
月別アーカイブ一覧