JSP と Servlet ざっくりまとめ

Java の `JSP` , `Servlet` を使った Web App 開発のはなし
`JSP` と `Servlet` の関係をざっくりまとめる
細かいことは気にしない！！いったんは流れが分かればOK！！！！
説明で使ってるサンプルプロジェクトは GitHub [java-webapp-clump](https://github.com/sueasen/java-webapp-clump) にあります
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/51758/2e0d3c6e-ceec-cc96-ee6b-81be4cf2dae6.png)

# JSP, Servlet の役割
- JSP
    画面を作るやつ
    表示・入力・URL実行
- Servlet
    画面(ブラウザ)から呼ばれて処理を呼ぶやつ
    表示する画面決める・入力を受け取る・処理を呼び出す・処理結果を設定する

# URL で画面（JSP）を表示
まずは画面が表示されるまでのつながり

### ざっくりした流れ
1. ブラウザでURLを実行 ( URL直接うったり画面のボタン押したり etc..  )
1. `Servlet` が呼び出される
1. `Servlet` が `JSP` を返す
1. ブラウザにJSPが表示 ( 画面を表示 )

あとは 1～4 を繰り返す。
`Servlet` がブラウザから URL で呼び出されて `JSP` を返すことでやりとりしてる。

### URL - Servlet のつながり
URL から `Servlet` を呼び出すときに気にするところ
- `HttpServlet` を継承
- `@WebServlet` が URL パスになる
- URL を直接、うったときは `get` になるので `doGet` メソッドが実行される

```Java:RetroForIfServlet.java
@WebServlet("/retro_forif") // ここが URL のパス になる
public class RetroForIfServlet extends HttpServlet { // HttpServlet を継承する

	@Override
	protected void doGet(HttpServletRequest request, HttpServletResponse response) // このメソッドが呼ばれる
			throws ServletException, IOException {
        // ・・・
	}

	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response) // このメソッドは今は気にしない
			throws ServletException, IOException {
		// ・・・
	}
}
```

これで `RetroForIfServlet` の `doGet` メソッド が URL に
http://localhost:8080/java-wabapp-clump/retro_forif
をうったら呼び出される
画面にあるリンクとかクリックしたときも同じ

※Java の WebアプリのURLの見方はこんな感じ
http(s):// `サーバ名・IP` : `ポート番号` / `アプリ名` / `アプリで決めたURLパス（ここでは Servlet で決めたやつ）`

### Servlet - JSP のつながり
`Servlet` から `JSP` を呼び出すときに気にするところ
- `request.getRequestDispatcher` で表示したい `JSP` を指定 ( webaapp から相対パス )
- `forward` で JSP に処理を転送 ( JSP が実行される )

```Java:RetroForIfServlet.java
	/** RetroForIfServlet.doGet メソッド */
    // 	@Override
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String view = "/WEB-INF/view/retroForIf.jsp";
		RequestDispatcher dispatcher = request.getRequestDispatcher(view); // JSPを相対パスで指定して取得
		dispatcher.forward(request, response); // JSP に処理を転送
	}
```

これで `RetroForIfServlet` の `doGet` メソッドの処理で `retroForIf.jsp` が実行されるようにしている
`retroForIf.jsp` が実行されることでブラウザに画面が表示される

# JSP - Servlet の値の受け渡し
画面 `JSP` から入力した値や `Servlet` から渡す値のつながり
JSP, Servletの値の受け渡しで使うスコープとしてリクエストスコープ、セッションスコープ、アプリケーションスコープがある
EL式でスコープを省略したときは リクエストスコープ、セッションスコープ、アプリケーションスコープの順で優先して取得できる

- リクエストスコープ：クライアント（ブラウザ）から1回の通信が有効範囲
- セッションスコープ：クライアント（ブラウザ）からの通信が有効範囲（ブラウザ閉じたりタイムアウトするとデータなくなる）
- アプリケーションスコープ：アプリが有効範囲（アプリを落とす（サーバ停止）するとデータなくなる）

## リクエストスコープ使った Servlet と JSP の受け渡し
### JSP から Servlet に値を渡す
`JSP` から `Servlet` に値を渡すときに気にするところ
- `JSP`
    - `form` タグを使って `action` に URLパス , `method` に `post` を設定 ( `Servlet` の `doPost` メソッドが呼べる)
    - `input` タグを使って `name` に キー を設定
    - `input` タグの `type` = `subimit` はボタン
- `Servlet`
    - `doPost` メソッドを使う
    - `request.setCharacterEncoding` で文字コード指定 (指定しないと日本語が文字化けする)
    - `request.getParameter` で `input` タグの `name` に設定した キー を指定で値を取得
    (取得した値を `String` になる...用途に応じて型を変えてあげる, オブジェクト使えない...)

```JSP:retroForIf.jsp
    <form action="retro_forif" method="post"> // action が URLパス, method に post
        <label>input：</label>
        <input type="number" name="input1" size="2" value="${input1}" min = "0" max = "9" required placeholder="0-9" /> // name にキーを設定
        <input type="hidden" name="workno" value="1" /> // name にキーを設定
        <input type="submit" /> // submit でボタンを配置
    </form>
```

```Java:RetroForIfServlet.java
	/** RetroForIfServlet.doPost メソッド */
	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		request.setCharacterEncoding("UTF-8"); // 文字コードを指定, `UTF-8` が良く使われる

		if ("1".equals(request.getParameter("workno"))) { // workno の値を取得
			int input = Integer.parseInt(request.getParameter("input1")); // input1 の値を取得
    		// ・・・
		} 
		// ・・・
	}
```

### Servlet から JSP に値を渡す
`Servlet` から `JSP` に値を渡すときに気にするところ
- `Servlet`
    - `request.setAttribute` で キー と 値 を設定 (オブジェクトを設定できる)
    - `JSP` - `Servlet` で取得した値をとっておきたいときも設定が必要
- `JSP`
    - `${ キー }` のみでOK（オブジェクトの時はメソッドも使える）
    - 値がブラウザで表示される

```Java:RetroForIfServlet.java
	/** RetroForIfServlet.doPost メソッド */
	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		// ・・・

		if ("1".equals(request.getParameter("workno"))) {
    		// ・・・
			request.setAttribute("result1", result); // result1 をキーにして値を設定
			request.setAttribute("input1", input); // input1 をキーにして値を設定
			request.setAttribute("target1", target); // target1 をキーにして値を設定
		} 
		// ・・・
	}
```

```JSP:retroForIf.jsp
    <form action="retro_forif" method="post">
        <label>input：</label>
        <input type="number" name="input1" size="2" value="${input1}" min = "0" max = "9" required placeholder="0-9" /> // input1 の値を取得
        <input type="hidden" name="workno" value="1" />
        <input type="submit" /> // submit でボタンを配置
    </form>
    <p>当てる数は．．．
        <c:if test="${!empty target1}"><span class="target"><c:out value="${target1}"/></span></c:if> // target1 の値を取得
    </p>
    <textarea rows="3" cols="80" name="result1" disabled placeholder="結果は．．．"><c:out value="${result1}"/></textarea> // result1 の値を取得
    <hr/>
```

## セッションスコープ使った Servlet と JSP の受け渡し
リクエストスコープを使った値の受け渡しだとページ遷移などで情報をとっておけない
セッションスコープを使うことで情報をオブジェクトとしてとっておくことができる（※同一セッション内のみ）
セッションスコープ使った `Servlet` と `JSP` に値を渡すときに気にするところ

- `Servlet`
    - `request.getSession()` でセッションスコープが取得できる
    - セッションスコープへの値の設定、取得に関してはリクエストスコープと同様のメソッド使える
        - `request.getSession().setAttribute(キー, 値)` で キー と 値 を設定 (オブジェクトを設定できる)
        - `request.getSession().getAttribute(キー)` で設定した値を取得（`Object` が戻ってくるのでキャストする必要あり）
    - `request.getSession().invalidate()` でセッション情報を破棄
- `JSP`
    - `${ キー }` のみで基本的にはOK（オブジェクトの時はメソッドも使える）
    - `Servlet` でリクエスト, セッションに対して同じキーで設定した時はリクエストが優先されてしまう
    - リクエスト、セッションで同じキーを設定した時にセッションの情報を取りたいときは `${ sessionScope.キー }` で取得

```Java:Servlet - セッションスコープへの値設定
		// セッションスコープ値設定
		request.getSession().setAttribute("key", object);
		// セッション破棄
		request.getSession().invalidate();
```
```JSP:JSP - セッションスコープからの値取得
		// リクエストに同一キーがない時（基本はこちらでOK）
		${key}
		// リクエストに同一キーがある時
        ${sessionScope.key}
```

## アプリケーションスコープ使った Servlet と JSP の受け渡し
アプリケーションで情報を保持する方法としてアプリケーションスコープがある
ただしサーバ停止すると失われるのでDBを使うことが多いかも．．．
パフォーマンスとかでDBのデータ（マスタデータ）をキャッシュするとかで使うことがある
アプリケーションスコープ使った `Servlet` と `JSP` に値を渡すときに気にするところ

- `Servlet`
    - `getServletContext()` でアプリケーションスコープが取得できる
    - アプリケーションスコープへの値の設定、取得に関してはリクエストスコープと同様のメソッド使える
        - `getServletContext().setAttribute(キー, 値)` で キー と 値 を設定 (オブジェクトを設定できる)
        - `getServletContext().getAttribute(キー)` で設定した値を取得（`Object` が戻ってくるのでキャストする必要あり）
- `JSP`
    - `${ キー }` のみで基本的にはOK（オブジェクトの時はメソッドも使える）
    - `Servlet` でリクエスト, セッション、アプリケーションに対して同じキーで設定した時はリクエストが優先されてしまう
    - リクエスト、セッション、アプリケーションで同じキーを設定した時にアプリケーションの情報を取りたいときは `${ applicationScope.キー }` で取得

```Java:Servlet - アプリケーションスコープへの値設定
		// アプリケーションスコープ値設定
		getServletContext().setAttribute("key", object);
```
```JSP:JSP - アプリケーションスコープからの値取得
		// リクエスト、セッションに同一キーがない時（基本はこちらでOK）
		${key}
		// リクエスト、セッションに同一キーがある時
        ${applicationScope.key}
```

# Servlet, JSP を作ってみる

## Servlet, JSP で簡単に画面を表示

URL をリクエストしたらJSPを表示する流れを作ってみる

### 1. Servlet とりあえず doGet のみのクラス作成

- `/java-webapp-clump/src/main/java/presentation/servlet` 直下に作成
- `HttpServlet` を継承
- `@WebServlet` にURLパスを指定 ( 下のコード例 http://localhost:8080/java-wabapp-clump/web_app_work )
- `doGet` メソッドをオーバーライド
-  `request.getRequestDispatcher` で表示したい `JSP` を指定 ( 下のコード例 /src/main/webapp/WEB-INF/view/work.jsp )

```Java:WorkServlet.java
package presentation.servlet;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/web_app_work")
public class WorkServlet extends HttpServlet {

	@Override
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String view = "/WEB-INF/view/work.jsp";
		RequestDispatcher dispatcher = request.getRequestDispatcher(view);
		dispatcher.forward(request, response);
	}
}

```
 
### 2. JSP とりあえずなんか表示するの作る

- `/java-webapp-clump/src/main/webapp/WEB-INF/view` 直下に作成
- 最初の5行が `JSP` の設定
- それ以降は `HTML` をベースに `JSP` を使ってる

```JSP:work.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ page isELIgnored="false" %>

<!doctype html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>JavaDevelop</title>
    <link rel="shortcut icon" href="<c:url value="/assets/favicon.ico" />">
    <link rel="stylesheet" href="<c:url value="/assets/bootstrap.min.css" />">
    <link rel="stylesheet" href="<c:url value="/assets/bootstrap-icons.css" />">
    <link rel="stylesheet" href="<c:url value="/assets/styles.css" />">
</head>

<body>

    <%@ include file="./_headerNavbar.jsp" %>

    <main>
        <div class="container workspace">
            <h2>Hello World!</h2>
        </div>
    </main>

    <footer class="footer mt-auto fixed-bottom py-3 bg-secondary"></footer>

    <script src="<c:url value="/assets/bootstrap.bundle.min.js" />"></script>
    <script src="<c:url value="/assets/script.js" />"></script>
</body>

</html>
```
### 3. URL を実行して画面が表示できるか確認

ここまでやれば以下の URL 実行で画面が表示される！
http://localhost:8080/java-wabapp-clump/web_app_work

## JSP 入力できるようにして Servlet で受け取って JSP に返す

先ほどのServlet → JSP 表示までをもとにして次は入力して画面に表示までを作ってみる

### 1. JSP 入力できるようにする（mainタブの中を修正）

- `/java-webapp-clump/src/main/webapp/WEB-INF/view/work.jsp` の `main` タブの中を編集
- `form` タグが重要, `action` に URLパス, `method` に "post" を指定 ( 下のコード例で上で作った `Servlet` の `doPost` メソッド実行 )
- 入力項目は `input` タグを使う, `name` を設定 ( `Servlet` で入力値を取得するときに使う )
- 実行ボタンは `input` タグで `type` に "submit" を指定
 
```JSP:work.jsp

    <main>
        <div class="container workspace">
            <h2>Hello World!</h2>
	        <form action="web_app_work" method="post">
	            <label>入力：</label>
	            <input type="text" name="input1" />
	            <input type="submit" />
	        </form>
        </div>
    </main>

```

### 2. Servlet で入力を取得してなんかしら値を JSP に返す（doPostを追加）

- `request.setCharacterEncoding` で文字コード指定 ( 指定しないと日本語が文字化けする可能性あり )
- `request.getParameter( "JSPで設定した name" )` で入力値を取得
- `request.setAttribute( "キー" , 値 )` で返したい値を設定 ( `JSP` で値を取得するときにキーを使う ) 
- 最後の `doGet` メソッド呼び出しで JSP を再度、表示する

```Java:WorkServlet.java

	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		request.setCharacterEncoding("UTF-8");

		String input1 = request.getParameter("input1");
        request.setAttribute("result1", "入力したのは " + input1);

		doGet(request, response);
	}

```

### 3. JSP で返ってきた値を表示する（mainタブの中に追記）

- `/java-webapp-clump/src/main/webapp/WEB-INF/view/work.jsp` の `main` タブの中を編集
- `${ Servlet で設定したキー }` で値を取得
- `c:out` を使ってるのは安全のため．．．
    入力に `<script>alert(11111)</script>` とか入れるとスクリプトが実行できてしまう

```JSP:work.jsp

    <main>
        <div class="container workspace">
            <h2>Hello World!</h2>
	        <form action="web_app_work" method="post">
	            <label>入力：</label>
	            <input type="text" name="input1" />
	            <input type="submit" />
	        </form>
            <hr/>
            <p>返ってきた値は．．．<c:out value="${result1}"/></p>
            <p>出るけど危険．．．${result1}</p>
        </div>
    </main>

```

### 4. URL を実行して画面を表示して入力してボタン押して動きを確認

ここまでやれば以下の URL 実行で画面が表示される！
表示された画面のテキスト入力して送信ボタン押して動きを出力まで確認できるはず

http://localhost:8080/java-wabapp-clump/web_app_work

## Servlet/JSP の受け渡しにオブジェクト（DTO）を使ってみる

先ほどのServlet・JSP の入力の受け渡しのところで Servlet → JSP に返すところをオブジェクト（DTO）にまとめたのを作ってみる

### 1. Servlet・JSPの受け渡し用の オブジェクト(DTO) を 作成

- `/java-webapp-clump/src/main/java/dto` 直下に作成

```Java:Work.java

package dto;

/**
 * {@link Work}
 */
public class Work {

	/** 入力値 */
	private String input;

	/**
	 * コンストラクタ
	 * @param input 入力値
	 */
	public Work(String input) {
		this.input = input;
	}

	/**
	 * input を取得します
	 * @return input
	 */
	public String getInput() {
		return input;
	}

	/**
	 * input を設定します
	 * @param input 入力値
	 */
	public void setInput(String input) {
		this.input = input;
	}

	/**
	 * てきとうな文字列を返します
	 * @return てきとうな文字列
	 */
	public String tekito() {
		return "てきとうすぎる...";
	}

	/**
	 * てきとうな文字列を返します
	 * @return てきとうな文字列
	 */
	public String tekito(String tekito) {
		return "てきとうすぎる...引数..." + tekito + "...入力..." + input;
	}
}

```

### 2. ServletでDTOのインスタンス生成してJSPで使えるように設定（doPostに追記）

- `request.setAttribute` を使って DTO を設定

```Java:WorkServlet.java

	@Override
	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		request.setCharacterEncoding("UTF-8");

		String input1 = request.getParameter("input1");
		request.setAttribute("result1", "入力したのは " + input1);

		request.setAttribute("resultDto", new Work(input1)); // この行を追加

		doGet(request, response);
	}

```

### 3. JSP でDTOを使って表示する（mainタブの中に追記）

- `/java-webapp-clump/src/main/webapp/WEB-INF/view/work.jsp` の `main` タブの中を編集
- getter は `${ Servlet で設定したキー.インスタンス変数 }` で使える
- メソッド は `${ Servlet で設定したキー.メソッド }` で使える
- メソッドの文字列の引数は シングルクォーテーション `'` で括る (数字は括らないでOK)

```JSP:work.jsp

    <main>
        <div class="container workspace">
            <h2>Hello World!</h2>
	        <form action="web_app_work" method="post">
	            <label>入力：</label>
	            <input type="text" name="input1" />
	            <input type="submit" />
	        </form>
            <hr/>
            <p>返ってきた値は．．．<c:out value="${result1}"/></p>
            <p>出るけど危険．．．${result1}</p>
            <hr/>
            <hr/>
            <p>DTOつかってみると．．．</p>
            <p>getter は変数名で取得できる：<c:out value="${resultDto.input}"/></p>
            <p>メソッドも使える：<c:out value="${resultDto.tekito()}"/></p>
            <p>メソッドも使える：<c:out value="${resultDto.tekito('わたすあたい')}"/></p>
            <p>DTOだけだと：<c:out value="${resultDto}"/></p>
        </div>
    </main>

```
### 4. URL を実行して画面を表示して入力してボタン押して動きを確認

ここまでやれば以下の URL 実行で画面が表示される！
表示された画面のテキスト入力して送信ボタン押して動きを出力まで確認できるはず２

http://localhost:8080/java-wabapp-clump/web_app_work


## HTML(JSP)/CSS つかって見た目をかえる

HTML と CSS を関連付けることで見た目を変えることができる
よく使われる方法として．．．
- HTML でタグや class 属性 を設定しておき
- CSS でタグや class ごとにスタイルを定義する

CSSの設定方法でよく使うやつの例を参考として記載
```CSS:CSS の設定方法でよく使うやつの例
/* tag : そのまま */
div {
  background-color: #000000;
}
/* id属性 : "#" を頭につける */
#test {
  background-color: #000000;
}
/* class属性 : "." を頭につける */
.test {
  background-color: #000000;
}
```
HTML, CSS （＋JavaScript） をうまく使うと見た目を変えることができるくらいで覚えておこう～


### 例 divタグの背景色を HTML, CSS 使って変えてみる

#### 1. CSS を編集（追記する）

- `/java-webapp-clump/src/main/webapp/assets/styles.css` に追記

```CSS:style.css
.back_red {
  background-color: red;
}
.back_blue {
  background-color: blue;
}
.back_pink {
  background-color: pink;
}
.back_green {
  background-color: green;
}
```

#### 2. JSP で divタグ を準備してブラウザに表示してみる

- `/java-webapp-clump/src/main/webapp/WEB-INF/view/work.jsp` の `main` タブの中に追記
- `<div class="css で定義した class (「.」を除いた形) ">・・</div>` を `div` タグ に `class` 属性を指定- 
- http://localhost:8080/java-wabapp-clump/web_app_work で表示を確認してみる（`class` 属性の値を変えると色が変わる）

```JSP:work.jsp

            <div class="back_red">てきとうなわく</div>
```

### 例 divタグの幅とかを HTML, CSS 使って動かしてみる

#### 1. CSS を編集（追記・修正する）

- `/java-webapp-clump/src/main/webapp/assets/styles.css` に追記・修正
- http://localhost:8080/java-wabapp-clump/web_app_work で表示を確認してみる（枠に動きがつく）

```CSS:style.css
.back_red {
  background-color: red;
  animation-name: animation1;          /* 定義する keyframess の名前と合わせる */
  animation-duration: 3s;              /* 動きをつける間隔 */
  animation-iteration-count: infinite; /* 動かす回数 infinite は無限 */
}
.back_blue {
  background-color: blue;
  animation-name: animation1;
  animation-duration: 3s;
  animation-iteration-count: infinite;
}
.back_pink {
  background-color: pink;
  animation-name: animation1;
  animation-duration: 3s;
  animation-iteration-count: infinite;
}
.back_green {
  background-color: green;
  animation-name: animation1;
  animation-duration: 3s;
  animation-iteration-count: infinite;
}

/* 0, 50, 100% で変化中のスタイルを指定、0%が開始時点, 100%が終了時点 */
@keyframes animation1 {
  0% {
    width: 20%;
  }
  100% {
    width: 100%;
  }
}

```


# Apendex

## JSP でよく使う HTML のタグ

- form タグ (入力を送るとき)
```JSP
    <form action="URLパス" method="post or get">
	    <label>入力：</label>
        <input type="text" name="input1" />       <!-- input はいくつでもかける -->
	    <input type="submit" />                   <!-- type submit で送信 -->
    </form>
```

- input タグ (入力項目)
```JSP
        <!-- いろいろあるので適当に．．． -->
        <label>入力 テキスト：</label>
        <input type="text" name="input1" /><br/>
        <label>入力 数字：</label>
        <input type="number" name="input2" /><br/>
        <label>入力 日付：</label>
        <input type="date" name="input4" /><br/>
        <label>入力 カラーコード：</label>
        <input type="color" name="input5" /><br/>
        <label>入力 ファイル：</label>
        <input type="file" name="input6" /><br/>
```

## JSP で処理・式を簡易に使う方法

JSP は基本的には HTML の構文を使って書くが．．．
HTML とは違い処理(条件分岐, 繰り返し etc) や 式を簡易に使う方法があるのでざっくり...

### JSPで処理を使う方法 : taglib

- JSP で使えるように taglib の設定を記載

```JSP
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

// 記載方法はこんな感じ
<%@ taglib prefix="JSP内で書くときのタグ名になる" uri="taglibのURI" %>
```
|タグライブラリ|概要|
|---|---|
|core<br>`prefix="c"`|変数操作, 条件分岐, 制御構文, URL管理などの基本機能|
|i18n<br>`prefix="fmt"`|メッセージ, 通過などのロケール, 数値, 日付などのフォーマット処理の機能|
|function<br>`prefix="fn"`|コレクション(List, Map配列など)処理, 文字列操作の機能|

- taglib の使い方(HTML のタグと大枠は一緒)

```JSP
// 1行で書ききれる場合
<preficで設定したname:処理名 attribute1="値1" attribute2="値2" ・・・ />

// 間にJSPの処理が必要な場合
<preficで設定したname:処理名 attribute1="値1" attribute2="値2" ・・・ >
    // 処理記載
</preficで設定したname:処理名>
```

- 書き方の例をいくつか

```JSP
// 出力 c:out
<c:out value="出力内容"/>

// 値設定 c:set
<c:set value="設定値" />

// 条件分岐 c:if
<c:if test="条件を記載">
    // 条件に一致した場合の処理
    // else ない...
</c:if>

// 条件分岐 c:choose
<c:choose>
    <c:when test="条件1">
        // 条件1に一致した場合の処理
    </c:when>
    <c:when test="条件2">
        // 条件2に一致した場合の処理
    </c:when>
    <c:otherwise">
        // 上の条件にはまらない場合の処理
    </c:otherwise>
</c:choose>

// 繰り返し c:forEach
<c:forEach items="配列, リストなど" var="配列, リストを取り出した値を設定する変数名">
    // var の変数を使いながら処理
</c:forEach>

// 日付フォーマット fmt:formatDate
<fmt:formatDate value="日付の値" pattern="yyyy/MM/dd HH:mm:ss.SSS などの出力形式" />

```

### JSP で式を使う方法 : EL式

- JSP で使えるように EL式 の設定を記載

```JSP
<%@ page isELIgnored="false" %>
```

- 書き方はこんな感じ

```JSP
${式を書く}
```

- 書き方の例をいくつか
`$` で囲むと `10+10` とかもできるけど使い方としては Servlet で設定した値を参照するときが多いのでその書き方
taglib の属性の値としてもEL式が使える

```JSP
// Servlet で request.setAttribute("key", 値) で設定した値の取得
${key}
※ taglib の属性の値として使う
<c:out value="${key}"/>

// Servlet で request.setAttribute("key", クラス) で設定したクラスのgetterから値の取得
${key.propetyName} ※getXxx の xxx のみにする感じ

// Servlet で request.setAttribute("key", クラス) で設定したクラスのメソッドを実行して戻り値を取得
${key.method()} ※引数も設定すれば渡せるけど型を合わせるのは大変...

// Servlet で request.setAttribute("key", 配列 or List) で設定した 配列 or List の値を取得
${key[0]}
${key[1]}
※ c:forEach と合わせて使うことが多いかも
<c:forEach items="${key}" var="val">
    {$val} // 処理で使う時は var で指定した変数を使う
</c:forEach>

// Servlet で request.setAttribute("key", Map) で設定した Map の値を取得
${key.mapKey}

```

- EL式にある暗黙オブジェクト
宣言とか設定とかを Servlet, JSP でしてなくても使える暗黙オブジェクトがある
色々あるので今はそんなのあるんだなの理解でOK、気になるやつをちょっと調べるとHTTP通信わかるようになるかも！？

|暗黙オブジェクト|概要|
|---|---|
|{$requestScope}}| リクエストスコープ(1回リクエスト) に設定したキー、値のマップみたいないやつ|
|{$sessionScope}}| セッションスコープ(同一タブの画面遷移) に設定したキー、値のマップみたいないやつ|
|{$applicationScope}}| アプリケーションスコープ(アプリ全体) に設定したキー、値のマップみたいないやつ|
|{$pageScope}}| ページスコープ に設定したキー、値のマップみたいないやつ|
|{$param}}| リクエストパラメータ に設定したキー、値のマップみたいないやつ|
|{$header}}| リクエストヘッダ に設定したキー、値のマップみたいないやつ|
|{$cookie}}| クッキー に設定したキー、値のマップみたいないやつ|