2つのリダイレクト方法

ヘッダー広告
スポンサードリンク

今回はリダイレクトを行う2つの方法についてご紹介致します。

リダイレクトとは・・・

ウェブサイトにおけるリダイレクト(英:redirect)とは、ウェブサイトの閲覧において、指定したウェブページから自動的に他のウェブページに転送されること。URLリダイレクト(URL redirection)とも言われる。
通常はウェブページのURLが変わったときに、元のURLから新しいURLへ誘導するときに用いられる。フィッシング詐欺サイトへの誘導などで用いられている場合もある。

wiki リダイレクト (HTTP) 引用

個人のサイトでリダイレクトを使うタイミングとしては、HTTP⇒HTTPSへと変更した際に、HTTPでアクセスしてきたユーザーを逃さずにHTTPSのサイトへリダイレクトしてあげることがよくあることかと思っています。

リダイレクトを行う方法

HTTPステータス302を返却

まず一つ目のリダイレクト方法は、HTTPステータスコード302を利用する方法です。
一般的なリダイレクトはこちらを利用することがほとんどだと思います。

今回はJSPを利用して302リダイレクトを返却する方法になります。

早速コードの紹介です。

●Redirect.jsp

<%@ page language="java" contentType="text/html;charset=Windows-31J" %>
<%@ page pageEncoding="Windows-31J" %>

<HTML>

<HEAD>

<TITLE>302リダイレクト</TITLE>

</HEAD>

<BODY>

<h1>302リダイレクト処理</h1>

<%
	response.setStatus(HttpServletResponse.SC_MOVED_TEMPORARILY);
	response.setHeader("Location","https://www.yahoo.co.jp/");
%>

</BODY>

</HTML>

解説不要なくらい単純なコードとなっています。

responseのstatusにSC_MOVED_TEMPORARILYをセットすること。
そして、HTTPヘッダーのLocationにリダイレクト先のURLをセットして返却します。

HttpServletResponse.SC_MOVED_TEMPORARILYは定数が設定されており、今回の場合は302が返却されます。
その他の定数としては以下のようなものがあります。

定数
SC_OK200
SC_NO_CONTENT204
SC_MOVED_PERMANENTLY301
SC_MOVED_TEMPORARILY302
SC_FORBIDDEN403
SC_NOT_FOUND404
SC_INTERNAL_SERVER_ERROR500
SC_SERVICE_UNAVAILABLE503

ブラウザは、HTTPステータスコードに302がセットされているのを確認すると、自動でリダイレクトされる仕組みを利用したものになります。
では挙動を確認してみましょう。

1.Redirect.jspをURLに入力

2.リダイレクト結果

するとこのようにURL先にとんだ直後にはリダイレクト先のURLへ転送されます。
ChromeのNetworkを確認すると、302ステータスコードが返却された後に、www.yahoo.co.jpが読み込まれているのがわかるかと思います。

以上がリダイレクトする方法の一つ目になります。

自動Postによるリダイレクト

もう一つご紹介するリダイレクトは、実際には一般的なリダイレクトとは異なる方法で実行します。

自動Postでのリダイレクトの用途としては、
例えば、PCサイトからSPサイトへ遷移するような画面を実装する場合に、ログイン情報を持たせたままSSOログインするケースなどで利用されます。
画面⇒リダイレクト用画面経由(POST)⇒移動先画面へと遷移させることで、リクエストパラメータを保持させたままリダイレクトが可能です。
通常の302リダイレクトで遷移させる場合は、Postでのパラメータを持たせたままは無理(パラメータのデータがなくなってしまう)なのでこの方法を利用します。

他にもHTTP⇒HTTPSへリダイレクトする時に先ほどと同様にPostパラメータを持たせたまま遷移させる場合にはこの方法が利用可能です。

ではコードをご紹介します。

●AutoPost.jsp

<%@ page language="java" contentType="text/html;charset=Windows-31J" %>
<%@ page pageEncoding="Windows-31J" %>

<HTML>

<HEAD>

<TITLE>自動ポスト</TITLE>

<script src="jquery.js"></script>

<script type="text/javascript">
    $(document).ready( function(){
        var $form = jQuery('form[name="PostForm"]');
        $form.submit();
    });
</script>

</HEAD>

<BODY>

<h1>自動ポスト処理</h1>

<form Name="PostForm" Action="https://www.yahoo.co.jp/" method="post">
    <!-- 送りたいデータがある場合は、input属性に値をセット
        <input type="text" name ="XXXXXXX" /> -->
</form>

</BODY>

</HTML>

ここでのポイントは、
$(document).ready を利用してページを開いた瞬間に、Formをsubmitさせてパラメータを送るという部分になります。

なので、この画面はリダイレクトだけに使われるダミーの画面です。

では画面の挙動を確認してみます。

1.Redirect.jspをURLに入力

2.AutoPostでのリダイレクト結果

するとこのように302リダイレクトの時と同様にyahooが表示されました。

ちなみに、このプログラムはjavascriptを利用して遷移しているため、javascriptが無効になっている場合には遷移されません。
今回の場合だと以下のような画面が表示されます。


おまけ
Chromeでjavascriptを有効/無効にする方法

1.Chromeにて設定を選択する

2.設定からコンテンツの設定を選択

3.javascriptを選択

4.javascriptの設定画面にて許可を選択する

これによってChromeでjavascriptを有効/無効を設定することが可能です。

本日は以上!

フッター広告

スポンサードリンク



シェアする

  • このエントリーをはてなブックマークに追加

フォローする