【社内勉強会】JSPの基礎(2017/09/06) ～作成中～



# 0. はじめに


------------------
## 対象者
* JSP初心者

### 前提知識
* Javaの基本的な構文
* Tomcatの基本的な知識
* Eclipseの基本的な使い方
* HTTP(GET,PUTメソッド、リクエスト/レスポンス)
* HTMLの基本構文
* Servletの基礎：http://qiita.com/yuji38kwmt/items/0221c1d386f262db89e0


------------------
## 伝えたいこと
* JSPとServletの関係
* JSPとHTMLの違い

------------------
## 目次
1. JSPとは？

------------------
# 1. JSPとは？


------------------
##  JSP(JavaServer Page)とは？

>HTML内にJavaのコードを埋め込んでおき、Webサーバで動的にWebページを生成してクライアントに返す技術のこと。

※ [Wikipedia JavaServer Pages](https://ja.wikipedia.org/wiki/JavaServer_Pages) 引用

* 1999年リリース(Servletが生まれてから2年後）
* 最新バージョンは2.3
* テンプレートエンジン
* 類似技術はPHPやASPなど


------------------
## JSPのsample

```jsp:hello.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" import="java.util.*" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<%=new Date() %><%-- アクセス日時を表示 --%>
</body>
</html>
```

* HTMLページに中に処理を埋め込んでいる

------------------
## JSPはServletに変換される

* Tomcatのworkディレクトリ配下に、`hello_jsp.java`と`hello_jsp.class`が生成される
  - Eclipseで起動：`%ECLIPSE_WORKSPACE%/.metadata/.plugins/org.eclipse.wst.server.core/tmp0/work/`
  - 直接Tomcatで起動：`%TOMCAT_HOME%/work/`

```java:hello_jsp.java
//public final class hello_jsp
//public void _jspServiceメソッドの処理
response.setContentType("text/html; charset=UTF-8");
pageContext = _jspxFactory.getPageContext(this, request, response,
			null, true, 8192, true);
_jspx_page_context = pageContext;
application = pageContext.getServletContext();
config = pageContext.getServletConfig();
session = pageContext.getSession();
out = pageContext.getOut();
_jspx_out = out;

out.write("\r\n");
out.write("<!DOCTYPE html>\r\n");
out.write("<html>\r\n");
out.write("<head>\r\n");
out.write("<meta charset=\"UTF-8\">\r\n");
out.write("</head>\r\n");
out.write("<body>\r\n");
out.print(new Date() );
out.write("\r\n");
out.write("</body>\r\n");
out.write("</html>");
```


------------------
## ServletとJSPの違い

* Servlet：Javaの処理で、HTMLタグを書く
* JSP：HTMLタグの中に、Javaの処理を書く

[「Servlet」と「JSP」の違い](http://wa3.i-3-i.info/diff185java.html)


------------------
### JSPとHTMLの違い

* JSPは、サーバサイドのサーブレットコンテナが処理する
* HTMLは、クライアントのブラウザが処理する



------------------
## いつJSPが生成されるか？
* デフォルトではアクセスしたときに生成される



-------
# JSPの構文

--------
## 実行環境

* Tomcat 8
* Java8


-------
## JSP Pageディレクティブ

* `<%@page %>`：Pageディレクティブ。JSPの宣言のようなもの
    - contentType
    - import

```jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" import="java.util.*" %>
```

-------
## スクリプト `<% %>`

* `_jspService`メソッド内に処理が組み込まれる。
   - 定義した変数はローカルスコープ
   

```jsp:sample.jsp
<span>
<%
Date date = new Date();
out.print(date);
%>
</span>
```





-------
## スクリプト `<%= %>`

スクリプトとして処理を行い、その結果を出力する

```jsp:sample.jsp
<h1><%=new Date() %></h1>
```      


```java:sample_jsp.java
out.write("<h1>");
out.print(new Date() );
out.write("</h1>\r\n");
```      



-------
## スクリプト `<%! %>`

* 変数は、Servletのインスタンス変数に、メソッドはインスタンスメソッドになる

* インスタンス変数なので、スレッドセーフでないことに注意。

http://www.asahi-net.or.jp/~gq4r-msm/html/k-age63/jsp/html/java-web300-jsp-script.html


```jsp:sample.jsp
<%!
int count = 0;
int pow(int i) { return i*i;}
%>
<span><%=count++%></span>
```     


--------
## 暗黙オブジェクト

![image.png](https://qiita-image-store.s3.amazonaws.com/0/37903/6f95926c-f917-48d3-e351-31cdb22476df.png)

※ https://www.javadrive.jp/servlet/jsp_object/index1.html 引用

--------
### 変換されたサーブレット

* `_jspService`メソッド内で、暗黙オブジェクトが生成されている。

```java:sample_jsp.java
  public void _jspService(final javax.servlet.http.HttpServletRequest request, final javax.servlet.http.HttpServletResponse response)
      throws java.io.IOException, javax.servlet.ServletException {

    final java.lang.String _jspx_method = request.getMethod();
    if (!"GET".equals(_jspx_method) && !"POST".equals(_jspx_method) && !"HEAD".equals(_jspx_method) && !javax.servlet.DispatcherType.ERROR.equals(request.getDispatcherType())) {
      response.sendError(HttpServletResponse.SC_METHOD_NOT_ALLOWED, "JSPs only permit GET POST or HEAD");
      return;
    }

    final javax.servlet.jsp.PageContext pageContext;
    javax.servlet.http.HttpSession session = null;
    final javax.servlet.ServletContext application;
    final javax.servlet.ServletConfig config;
    javax.servlet.jsp.JspWriter out = null;
    final java.lang.Object page = this;
    javax.servlet.jsp.JspWriter _jspx_out = null;
    javax.servlet.jsp.PageContext _jspx_page_context = null;


    try {
      response.setContentType("text/html; charset=UTF-8");
      pageContext = _jspxFactory.getPageContext(this, request, response,
      			null, true, 8192, true);
      _jspx_page_context = pageContext;
      application = pageContext.getServletContext();
      config = pageContext.getServletConfig();
      session = pageContext.getSession();
      out = pageContext.getOut();
      _jspx_out = out;

      out.write("\r\n");
      out.write("<!DOCTYPE html>\r\n");      
  //....    
  }
```



--------
## JSPスコープ

以下の順に、スコープが広くなる

* page: JSPページ内で定義された変数
* request：HTTPのリクエストごと
* session：PCごと(同じセッションかどうかはCookieで判断）
* application：アプリケーション全体


http://www.atmarkit.co.jp/ait/articles/0701/20/news017.html

可能な限り狭いスコープに情報を設定すること！


--------
## JSP タグライブラリ

スクリプトよりもタグライブラリを使う

http://tag.main.jp/
--------
## EL式（Expression Language）



--------
## JSPはオワコン？