PowerPoint Presentation

Size: px

Start display at page:

Download "PowerPoint Presentation"

まなしまむね
5 years ago
Views:

1 プログラミング Java III 第 4 回 : サーブレットの HTTP Request の処理 Ivan Tanev

2 講義の構造 1. サーブレットの HTTP Request の処理 2. 演習 2

3 第 3 回のまとめ Internet Explorer のアドレスバー : XXXXXXXX は学籍番号です例 : サーブレット Lecture3_Servlet_XXXXXXXX 呼び出前サーブレット Lecture3_Servlet_XXXXXXXX 呼び出後 3

Lecture3_Form.htm 第 3 回のまとめ Web サーバサーブレット Web フォーム static サーブレットコンテナ 4 HTML テキスト dynamic 2 5 Internet 1 3 Web クライアント HTML テキスト HTML テキスト Lecture3_Servlet_XXXXXXXX.

4 Lecture3_Form.htm 第 3 回のまとめ Web サーバサーブレット Web フォーム static サーブレットコンテナ 4 HTML テキスト dynamic 2 5 Internet 1 3 Web クライアント HTML テキスト HTML テキスト Lecture3_Servlet_XXXXXXXX.class <<HTML><HEAD> <TITLE>To All Students of Programming 3 at Doshisha University</TITLE> <META HTTP- EQUIV='Content-Type' Content='text/html; charset=shift_jis'></meta></head><bod Y BGCOLOR="#FFFFFF"> <CENTER> <H2>Congratulations, your first servlet is working!</h2> <H3>[ local time is <font color=blue>wed Apr 18 17:49:38 KST 2018</font> ]</H3> </CENTER></BODY></HTML> ユーザ 4

5 サーブレットの HTTP Request の処理 :Web Form: INPUT Objects Web form Lecture4_Form_XXXX.html のソース <HTML> <HEAD> <TITLE>Handling an HTTP Get Request</TITLE> <META HTTP-EQUIV="content-type" CONTENT="text/html"> </HEAD> <BODY> <FORM ACTION = "/servlet/lecture4_servlet_xxxx" METHOD = "get"> First name<br> <INPUT TYPE = "text" NAME = "Form_FirstName" /><BR><BR> Native language:<br> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="Japanese" CHECKED="CHECKED">Japanese<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="English">English<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="French">French<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="-Other-">-Other-<BR><BR> Spoken Languages: <BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakJapanese" CHECKED="CHECKED">Japanese<BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakEnglish">English<BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakFrench">French<BR> <BR> <BR> Favourite car:<br> <SELECT NAME="Form_Cars"> <OPTION VALUE="Toyota">Toyota <OPTION VALUE="Honda">Honda <OPTION VALUE="Nissan">Nissan <OPTION VALUE="-Other-">-Other- </SELECT><BR> <INPUT TYPE = "submit" VALUE = "Start Servlet"/> </FORM> </BODY> </HTML> 5

6 サーブレットの HTTP Request の処理 :Request の構造 Web サーバサーブレット Lecture4_Form_XXXX.htm サーブレットコンテナ Web フォーム static 2 Internet 1 3 Web クライアント HTML テキストユーザー 6

7 サーブレットの HTTP Request の処理 :Request の構造 Web form Lecture4_Form_XXXX.html のソース <HTML> <HEAD> <TITLE>Handling an HTTP Get Request</TITLE> <META HTTP-EQUIV="content-type" CONTENT="text/html"> </HEAD> <BODY> <FORM ACTION = "/servlet/lecture4_servlet_xxxx" METHOD = "get"> First name<br> <INPUT TYPE = "text" NAME = "Form_FirstName" /><BR><BR> Native language:<br> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="Japanese" CHECKED="CHECKED">Japanese<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="English">English<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="French">French<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="-Other-">-Other-<BR><BR> Spoken Languages: <BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakJapanese" CHECKED="CHECKED">Japanese<BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakEnglish">English<BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakFrench">French<BR> <BR> <BR> Favourite car:<br> <SELECT NAME="Form_Cars"> <OPTION VALUE="Toyota">Toyota <OPTION VALUE="Honda">Honda <OPTION VALUE="Nissan">Nissan <OPTION VALUE="-Other-">-Other- </SELECT><BR> <INPUT TYPE = "submit" VALUE = "Start Servlet"/> </FORM> </BODY> </HTML> Request の内容 Parameter 名 = Parameter の値 Parameter の値ユーザのインプット : John 7

8 サーブレットの HTTP Request の処理 Lecture4_Form_XXXX.htm Web サーバ 1 Web クライアントユーザサーブレットコンテナ Web フォーム static 2 HTML テキストサーブレット 4 HTML テキスト dynamic Internet 3 5 HTML テキスト 8

9 サーブレットの HTTP Request の処理 Request の内容 Servlet Lecture4_Servlet_XXXX.java のソース import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class Lecture4_Servlet_XXXX extends HttpServlet { public void service (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setcontenttype("text/html"); //--- New : --- // Getting the form parameters: String FirstName = request.getparameter("form_firstname"); String Language = request.getparameter("form_language"); String Car = request.getparameter("form_cars"); String Lang = ""; if (request.getparameter("form_speakenglish")!=null) Lang="English"; if (request.getparameter("form_speakjapanese")!=null) Lang=Lang + " Japanese"; if (request.getparameter("form_speakfrench")!=null) Lang=Lang + " French"; // Getting the communication channel with the requesting client PrintWriter out = response.getwriter(); 9

10 サーブレットの HTTP Request の処理 Request の内容 Servlet Lecture4_Servlet_XXXX.java のソース // write the data out.println("<html>" + "<HEAD>" + " <TITLE>Servlet Request: </TITLE>" + " <META HTTP-EQUIV='Content-Type' Content='text/html';" + " charset='shift_jis'></meta>" + "</HEAD>"); out.println(" <CENTER>" + "<H2>Hello "+FirstName+"-san!</H2>" + "<H3>Welcome to Servlets!</H3></CENTER>" + " Your native language is <B>"+Language +"</B><BR>" + " Your favorite car is <B>"+Car +"</B><BR>" + " You speak <B>"+ Lang +"</B><BR><BR>" ); out.println("local time is " + new java.util.date()); out.println("</body></html>"); } } 10

サーブレットの HTTP Request の処理 Reference: http://docs.oracle.

11 サーブレットの HTTP Request の処理 Reference: 11

12 サーブレットの HTTP Request の処理 :Request の処理 Reference: 12

13 2. 演習目的 1) Web フォーム Lecture4_Form_XXXXXXXX.html を作成 (Notepad) と Upload (FFFTP) ロケーション : 2) Servlet Lecture4_Servlet_XXXXXXXX.java を作成 (Notepad) と Upload (FFFTP) ロケーション : 3) Servlet Lecture4_Servlet_XXXXXXXX.java をコンパイルして, Lecture4_Servlet_XXXXXXXX.class を作成ロケーション : ( 4) Web フォーム Lecture4_Form_XXXXXXXX.html から Servlet Lecture4_Servlet_XXXXXXXX を実行する. 13

14 A.Web フォームを作成 2. 演習 Step by Step B.Web フォームを Web サーバに Upload C.Servlet を開発 D.Servlet を Web サーバに Upload E.Servlet をコンパイル F.Web フォームへ Access してから, Servlet を実行する 14

15 2. 演習 A.Web フォームを作成テキストドキュメントの作成

16 A. Web フォームを作成テキストドキュメントの内容を入力 <HTML> Lecture4_Servlet_XXXX: <HEAD> <TITLE>Handling an HTTP Get Request</TITLE> XXXX = 学籍番号 <META HTTP-EQUIV="content-type" CONTENT="text/html"> </HEAD> 例 : Lecture4_Servlet_ <BODY> <FORM ACTION = "/servlet/lecture4_servlet_xxxx" METHOD = "get"> First name<br> <INPUT TYPE = "text" NAME = "Form_FirstName" /><BR><BR> Native language:<br> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="Japanese" CHECKED="CHECKED">Japanese<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="English">English<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="French">French<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="-Other-">-Other-<BR><BR> Spoken Languages:<BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakJapanese" CHECKED="CHECKED">Japanese<BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakEnglish">English<BR> <INPUT TYPE="CHECKBOX" NAME="Form_SpeakFrench">French<BR> <BR> <BR> Favourite car:<br> <SELECT NAME="Form_Cars"> <OPTION VALUE="Toyota">Toyota <OPTION VALUE="Honda">Honda <OPTION VALUE="Nissan">Nissan <OPTION VALUE="-Other-">-Other- </SELECT><BR> <INPUT TYPE = "submit" VALUE = "Start Servlet"/> </FORM> </BODY> </HTML> 16

17 A. Web フォームを作成テキストドキュメントを保存する :E:\Temp\Lecture4_Form_XXXX.html <HTML> <HEAD> <TITLE>Handling an HTTP Get Request</TITLE> <META HTTP-EQUIV="content-type" CONTENT="text/html"> </HEAD> <BODY> <FORM ACTION = "/servlet/lecture4_servlet_xxxx" METHOD = "get"> First name<br> <INPUT TYPE = "text" NAME = "Form_FirstName" /><BR><BR> Native language:<br> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="Japanese" CHECKED="CHECKED">Japanese<BR> <INPUT TYPE="RADIO" NAME = "Form_Language" VALUE="English">English<BR> Lecture4_Form_XXXX.html

18 B. Web フォーム Lecture4_Form_XXXX.html を Upload する 1) FTP Client (FFFTP) を実行する 18

19 B. Web フォーム Lecture4_Form_XXXX.html を Upload する 2) ホストに接続する FTP クライアント設定 : ホスト名 : isd-si.doshisha.ac.jp ユーザ名 : guest パスワード : guest 19

20 B. Web フォーム Lecture4_Form_XXXX.html を Upload する 3) 自分のフォルダーを選択する 20

21 C. Servlet Lecture4_Servlet_XXXX.java を開発する 1) Notepad で下記の Servlet を入力する import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class Lecture4_Servlet_XXXX extends HttpServlet { public void service (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setcontenttype("text/html"); //--- New : --- // Getting the form parameters: String FirstName = request.getparameter("form_firstname"); String Language = request.getparameter("form_language"); String Car = request.getparameter("form_cars"); 注意 :class 名 =ファイル名 (.java) 例 : class 名 : Lecture4_Servlet_ ファイル名 : Lecture4_Servlet_ java } } String Lang = ""; if (request.getparameter("form_speakenglish")!=null) Lang="English"; if (request.getparameter("form_speakjapanese")!=null) Lang=Lang + " Japanese"; if (request.getparameter("form_speakfrench")!=null) Lang=Lang + " French"; // Getting the communication channel with the requesting client PrintWriter out = response.getwriter(); // write the data out.println("<html><head><title>servlet Request: </TITLE>" + " <META HTTP-EQUIV='Content-Type' Content='text/html';" + " charset='shift_jis'></meta></head>"); out.println(" <CENTER>" + "<H2>Hello "+FirstName+"-san!</H2>" + "<H3>Welcome to Servlets!</H3></CENTER>" + " Your native language is <B>"+Language +"</B><BR>" + " Your favorite car is <B>"+Car +"</B><BR>" + " You speak <B>"+ Lang +"</B><BR><BR>" ); out.println("local time is " + new java.util.date()); out.println("</body></html>"); 21

$C. Servlet Lecture4_Servlet_XXXX.java を開発する 2) Servlet は E:\Temp\Lecture4_Servlet_XXXX.java に保存する import java.io.*; import javax.servlet.*; import javax.servlet.http.$

22 C. Servlet Lecture4_Servlet_XXXX.java を開発する 2) Servlet は E:\Temp\Lecture4_Servlet_XXXX.java に保存する import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class Lecture4_Servlet_XXXX extends HttpServlet { public void service (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setcontenttype("text/html"); //--- New : --- // Getting the form parameters: 注意 :class 名 =ファイル名 (.java) 例 : class 名 : Lecture4_Servlet_ ファイル名 : Lecture4_Servlet_ java 2 Lecture4_Servlet_XXXX.java 1 22

23 D.Servlet Lecture4_Servlet_XXXX.java を Web Server に Upload する 1) FFFTPを実行する. 2) ホストに接続 : ホスト名 : isd-si.doshisha.ac.jp ユーザ名 : servlets パスワード : servlets 23

24 D.Servlet Lecture4_Servlet_XXXX.java を Web Server に Upload する 3) Upload Lecture4_Servlet_XXXX.java 24

E.Servlet Lecture4_Servlet_XXXX.java をコンパイルする 1) Web Browser: http://isd-si.

25 E.Servlet Lecture4_Servlet_XXXX.java をコンパイルする 1) Web Browser: 2) Compile_Servlet.jsp に Access する :

26 E.Servlet Lecture4_Servlet_XXXX.java をコンパイルする XXXX= 学籍番号です 26

27 E.Servlet をコンパイルする 3) FFFTP Client で Lecture4_Servlet_XXXX.class ファイルを確認する 1 Lecture4_Servlet_XXXX.class? 2 27

28 E. Lecture4_Form_XXXX.html の Access してから, Servlet を実行する (Web Browser, 例 :Internet Explorer など ) 締め切り : 5 月 17 日 ( 木曜日 ) 28

Microsoft PowerPoint - Lecture_3

Microsoft PowerPoint - Lecture_3 プログラミング III 第 3 回 : サーブレットリクエスト & サーブレットレスポンス処理入門 Ivan Tanev 講義の構造 1. サーブレットの構造 2. サーブレットリクエストサーブレットレスポンスとは 3. 演習 2 Lecture2_Form.htm 第 2 回のまとめ Web サーバ Web 1 フォーム static 2 Internet サーブレ4 HTML 5 ットテキスト