ICT関連の学習備忘録

ICTの学習をアウトプットするワークブックサイト

ICT関連の学習備忘録

2019/10/03:Eclipseでプロジェクト作成

EclipseによるJSP作成手順

EclipseによるJSP作成手順
・Serversプロジェクトの作成
・動的Webプロジェクトの作成
・JSPの作成
・Tomcatへのプロジェクト搭載&起動

Eclipseでプロジェクト作成準備

パースペクティブを開く→Java EEを追加。

サーバーの作成
ファイル→新規→その他→サーバー・次へ→Tomcat8・次へ

プロジェクトの作成
ファイル→新規→新規動的 Web プロジェクト→ターゲット・ランタイム「Tomcat8」
→動的 web モジュールバージョン「3.1」→構成「Tomcat8デフォルト構成」
→次へ→次へ→Web モジュール「web.xmlデプロイメント記述子の生成」チェック→完了

サーバ起動
サーバウィンドウで対象サーバ(ローカルホストの・・・)で右クリック→追加及び除去
→使用するプロジェクトを構成済みへ追加→完了→実行でサーバ起動
※追加及び除去をする事でserver.xml内にコンテキストが追加される。
※サーバーの設定ファイルはサーバの作成で作成したプロジェクト内に設置されている。

JSP・スクリプトを構成する要素

JSPの構成要素
・HTMLタグ
・コメント
・スクリプト(暗黙オブジェクト)
・ディレクティブ
・アクションタグ
・EL式(Expression Language)
・JSTL(JSP Standard TagLibrary)

スクリプトの主な要素
・コメント
 <%-- --%>
 .jsp内でコメントを記述する時に使用
・スクリプト宣言
 <%! %>
 フィールドの宣言やメソッドを記述する時に使用
・スクリプトレット
 <% %>
 メソッドを呼び出すときやフィールドに値を設定したい時に使用
 ※_jspServiceメソッド内に配置される
・スクリプト式
 <%= %>
 フィールドの値やメソッドの戻り値を表示したい時に使用
 ※out.print(値)に配置される。

JSP実行の流れ

JSP実行の流れ
JSPファイルのJavaソースコード変換
 今回実習環境ではjavax.servlet.http.HttpServletクラスを継承した
 org.apache.jasper.runtime.HttpJspBaseクラスに変換
 スクリプト宣言<%! %>は、クラスのメンバーとして配置
 スクリプレット<% %>、スクリプト式<%= %>ならびにHTMLタグは、
 __jspServiceメソッド内に配置
Javaソースコードのコンパイル
クラスロード
Servletインスタンス生成
 コンストラクタの実行
_jspInitメソッドの実行
 スクリプト式は、out.print("スクリプト式内の情報");に変換
 HTMLタグは、out.write("タグ")に変換
 print/write各メソッドはブラウザにタグ等の文字列を送信する。
JSP作成の手順で作成したJSPファイルはJavaコードの確認が出来ます。
 C:\pleiades\tomact\8\work\Catalina\localhost\testapp\org\apache\jsp
class Rei03_jsp
{
    /***スクリプト宣言内の記述 <%!  %> ***/
    public void main(String[] args)
    {
        /***スクリプットレット内の記述 <%  %> ***/;
        System.out.print(/***スクリプト式内の記述 <%  %> ***/);
        System.out.print("/***スクリプト以外(文字列出力等***/");
    }
}

実行演習

rei03.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%!
private int x = 0;
private int y = 0;

public void setDate(int x, int y) {
	this.x = x;
	this.y = y;
}

public int tashi(){
	return this.x + this.y;
}

%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>rei03.jsp</title>
</head>
<body>
<% setDate(10,20); %>
<%= "x=" + this.x  %><br>
<%= "y=" + this.y  %><br>
<%= "x+y=" + this.tashi() %>
</body>
</html>
ブラウザで実行時のソースコード
http://localhost:8080/toi01/jsp/toi01.jsp
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>rei03.jsp</title>
</head>
<body>

x=10<br>
y=20<br>
x+y=30
</body>
</html>

toi02.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%!
//ループ回数の指定
private int counter = 100;
public int roop(int num)
{
	int sum = 0;
	for(int i = 0 ; i<=num ; i++){
		sum += i;
	}
	return sum;
}
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>問2.jsp</title>
</head>
<body>
問02のJSPからの出力です<br>
0から<%= counter %>までの合計は・・・<br>
<%= this.roop(counter) %><br>
です。

</body>
</html>
ブラウザで実行時のソースコード
http://localhost:8080/toi01/jsp/toi01.jsp
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>問2.jsp</title>
</head>
<body>
問02のJSPからの出力です<br>
0から100までの合計は・・・<br>
5050<br>
です。

</body>
</html>



前のページへ戻る