はじめに
DreamHanksの松下です。
前回の記事で簡単なログイン画面の表示までを解説しました。
今回はログイン画面にパスワードを入力して、それをサーバーに送るまでを解説します。
JSPを知る
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <%@ taglib uri="http://www.springframework.org/tags/form" prefix="f"%> <%@ page contentType="text/html; charset=UTF-8"%> <%@ page session="false" %> <html> <head> <title>login</title> </head> <body> <h1> ログイン画面 </h1> <f:form action="${pageContext.request.contextPath }/member/loginProcess" method="post" modelAttribute="loginForm"> <f:input type="password" path="password" /> <input type="submit" value="ログイン"> <f:errors path="password" /> ${message} </f:form> </body> </html> |
JSPは実はjava！？
HTMLタグを記述しているので、クライアントサイドで動いているものだと
勘違いするかもしれません。
しかし、JSPはサーバー内部で動くものです。
プログラマが画面をデザインしやすいようにHTMLタグで書かれていますが、
最終的にはコンパイルされて機械語に訳されて、アクセスがあったときに
HTMLタグをWebブラウザに描画します。
JSPはJavaServer Pageの略で中身はJAVAです。
役割としては、２つあります。
・画面を描画（デザイン）する。
・画面で入力されたものを、サーブレット（コントローラ）と受け渡しをする。
ライブラリについて
|
1 2 |
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <%@ taglib uri="http://www.springframework.org/tags/form" prefix="f"%> |
JSPの上記にあるこの記述は、ライブラリをJSPに注入しています。
基本的にJSP内で使われるタグの形式は下記の３つです。
・html
・JSTL
・Spring MVCのJSPタグ
JSTLとは
JSTLはJavaServer Pages Standard Tag Libraryです。
クライアント側でループ処理や計算処理をしたい場合に、このライブラリを使います。
| 種類 | 説明 |
|---|---|
| core | forEach、if、変数の参照/設定などの基本的なタグ |
| fmt | 数値や日付のフォーマットなど |
| xml | XML文書の解析、XSLスタイルシート |
| functions | 文字列一般関数（containsなど） |
| sql | SQLを発行し、データベース操作する関数 |
上記の表の内容ができます。
しかし、ほとんど「core」しか使いません。
今回も「core」のみを使用します。
「<f:input＞」と「<input＞」の違いについて
<f:input＞がSpring MVCのJSPタグです。
<input＞はhtmlのタグです。
HTMLのタグは画面入力された内容を、Modelに受け渡さないものを画面に描画するために使います
具体的な例としては
・値を受け渡さない画面の制御のためだけの、チェックボックスを描画する
・Submitボタンを描画する
Spring MVCのJSPタグは逆にModelに値を受け渡すために使います。
具体的な例としては
・Model(Form)をJSPに定義する
・画面で入力された値をModelに受け渡す
・action(URL)を定義する
prefixについて
|
1 2 |
prefix="c" %> prefix="f"%> |
ライブラリの末尾に記述されているprefixについて注目いたします。
本来は下記のようにcoreまで記述しなくてはいけませんが、
このように訳して記述できるようにするためのものです。
<core:forEach> ⇒ <c:forEach>
<form:form> ⇒ <f:form>
※Formタグ（画面の内容をサーバーに送る架け橋）
modelAttributeについて
|
1 |
<f:form action="${pageContext.request.contextPath }/member/loginProcess" method="post" modelAttribute="loginForm"> |
formタグ内で「modelAttribute=”loginForm”>」と記述しています。
これは、このJSP内で（画面入力されたものが）この箱（loginForm）に詰め込まれますよ
という意味です。
つまり、詰め込む箱はどれなのか？を定義するものです。
Controllerで行った@ModelAttribute/model.addAttributeとの違い
前回のControllerでmodelのアトリビュートを行いました。
Formタグのアトリビュートとの違いは「JSPにどの箱を持っていくのか？」です。
Contorllerのアトリビュート ⇒ 画面で渡された値が使える。
どのようにしてloginForm（画面で生成した箱）に値をつめるのか？
下記のSpring MVCのJSPタグを使います
|
1 |
<f:input type="password" path="password" /> |
◆Pathingを行う
「path=”password”」はloginForm.javaにあるpasswordエンティティと対応しています。
そして入力された値はSetterメソッドを使って、loginForm.javaにあるpasswordに設定されます
これはSpringMVCモデルの最も強力な点の一つです。
画面からSetterメソッドを内部的に使って、loginForm.javaに設定できるなんて素晴らしくないですか？？
submitについて
|
1 |
<input type="submit" value="ログイン"> |
submitボタンを押下することで、画面で入力された内容を最終的にpathingして
formタグのactionに記述されているURLに遷移するように実行します。
このsubmitボタンはformタグに対して１つある。1対1の関係です。
遷移先はサーバーにあるメソッドです。
<f:form action=”${pageContext.request.contextPath }/member/loginProcess”
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
/** * ログイン画面で入力されたパスワードの整合性を判定するメソッド * @param aa ログイン画面の入力値を保存するform * @param result 入力値のバリデーション結果 * @param model ControllerからViewに値を受け渡すためのパラメータ * @return ログイン画面のJSPファイル名 or 勤務時間選択画面のJSPファイル名 */ @RequestMapping(value = "/loginProcess") public String loginProcess(@ModelAttribute("loginForm") @Valid LoginForm aa, BindingResult result, Model model) { // ヴァリデーションチェック不正がある場合 // result.hasErrors()の意味はエラーがある場合にtrueをreturnするメソッド if (result.hasErrors()) { return "login"; } // 以下省略 |
さいごに
次回は入力されたパスワードの入力内容が、正しい形式でできているか？を確認するために
ヴァリデーションチェックについて解説していきます。
お読みいただきありがとうございました。
コメント