JavaScriptでURLを取得してリダイレクトする方法

JavaScript
JavaScriptでできるリダイレクトの紹介・解説をしていきます。サーバーサイドで設定するリダイレクト方法「.htaccess」が使用できない場合に使用するリダイレクト方法です。Google推奨のリダイレクト方法は「.htaccess」になっております。
質問する生徒
生徒

特定のURLにリダイレクトをかけたいんですけど、「.htaccess」を使用できないサービスで困ってるんですよ。

回答する先生
先生

ではJavaScriptを使用して特定のURLにリダイレクトをかけましょう。

質問する
生徒

リダイレクトかけたいURLは、1つだけでなく複数あるんです。

回答する先生
先生

さまざまな状況を想定して、JavaScriptでできるリダイレクトを紹介します。

条件なしでリダイレクト

$(window).on('load',function(){ 
location.replace('①リダイレクト先URL'); 
});

上記コードを設置したページにきたアクセスを全て①のURLへリダイレクトさせる。

  1. $(window).on('load'読み込みが完了したら実行を指示
  2. location.replace指定したURLに遷移させる

特定のURLを取得してリダイレクト

$(window).on('load',function(){ 
var url = location.href if (url == '①リダイレクト元URL') 
location.replace('②リダイレクト先URL');
 });

①のURLだった場合、②のURLへリダイレクトさせる。

  1. $(window).on('load'読み込みが完了したら実行を指示
  2. location.href現在のURLを取得
  3. location.replace指定したURLに遷移させる

複数のURLを取得してリダイレクト


$(window).on('load',function(){ 
var url = location.href if ( (url == '①リダイレクト元URL')
 || (url == '②リダイレクト元URL')
 || (url == '③リダイレクト元URL')
 || (url == '④リダイレクト元URL') ) 
location.replace('⑤リダイレクト先URL'); 
});

①〜④のURLだった場合、⑤のURLへリダイレクトさせる。

  1. $(window).on('load'読み込みが完了したら実行を指示
  2. location.href現在のURLを取得
  3. ||複数条件がある場合に使用するor
  4. location.replace指定したURLに遷移させる
回答する先生
先生

JavaScriptでできる特定のURLをリダイレクトかける方法を紹介しました。

質問する生徒
生徒

  • 全てのアクセスをリダイレクト
  • 特定のURLをリダイレクト
  • 複数のURLをリダイレクト
状況に応じて使用してみます。