Upload
thanachart-numnonda
View
9.621
Download
31
Embed Size (px)
DESCRIPTION
Citation preview
1
Hand-onExercises
การเข�ยนโปรแกรมเว�บJava Servlet / JSP
โดยใช�GlassFish and NetBeans 6.5
Dr.Thanachart Numnondaand
Asst Prof.Thanisa Kruawaisayawan
July 2009
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
2
สารบ�ญExercise 1 การสร�างโปรเจ�ค Web Application และไฟล� HTML........................................................................5
1.1 การสร�าง Web Application Project..................................................................................................51.2 การพ�ฒนาโปรแกรม addCustomer.html................................................................................................91.3 การทดสอบโปรแกรม..........................................................................................................................11
Exercise 2 การเข�ยนโปรแกรม Java Servlet เพ !ออ"านค"าพาราม#เตอร�.........................................................................132.1 การพ�ฒนาโปรแกรม CustomerServlet.java.........................................................................................13
2.1.1 การอ"านค"าพาราม#เตอร�จาก addCustomer.html ...............................................................................132.1.2 การแสดงรายละเอ�ยดของค"าต"างๆ.......................................................................................................14
2.2 ข�&นตอนการพ�ฒนาโปรแกรม CustomerServlet.java ...............................................................................142.3 การทดสอบโปรแกรม..........................................................................................................................192.4 การปร�บปร'งโปรแกรมเพ !อให�แสดงผลภาษาไทยและเร�ยกไฟล� addCustomer.html เม !อเร#!มต�น......................................20
Exercise 3 โปรแกรมเว�บส.าหร�บการท.าโพล........................................................................................................223.1 การพ�ฒนาโปรแกรม vote.html............................................................................................................223.2 การพ�ฒนาโปรแกรม VoteServlet.java................................................................................................23
3.2.1 ก.าหนดต�วแปร counter และ lang ...............................................................................................243.2.2 อ"านค"าพาราม#เตอร�ต"างๆท�!ส"งมาจาก vote.html และท.าการประมวลผล............................................................243.2.3 การแสดงผลการโหวต..................................................................................................................24
3.3 ข�&นตอนการพ�ฒนาโปรเจ�ค Voter ...........................................................................................................253.4 การปร�บปร'งโปรแกรม VoteServlet.java..............................................................................................29
3.4.1 ก.าหนดต�วแปร voters................................................................................................................293.4.2 การอ"านหมายเลขไอพ�ของผ/�ใช�..........................................................................................................29
Exercise 4 การเช !อมต"อก�บ MySQL Database.............................................................................................324.1 การต#ดต�&งโปรแกรมฐานข�อม/ล MySQL....................................................................................................324.2 การสร�าง Database Connection.....................................................................................................324.3 การสร�างตาราง books.......................................................................................................................354.4 การใช�ค.าส�!ง SQL ใน NetBeans........................................................................................................37
Exercise 5 การพ�ฒนาโปรแกมเว�บเพ !อต#ดต"อก�บฐานข�อม/ล..........................................................................................395.1 การสร�าง Web Application Project................................................................................................395.2 การพ�ฒนาโปรแกรม addBook.html....................................................................................................395.3 การพ�ฒนาโปรแกรม Thankyou.html...................................................................................................415.4 การพ�ฒนาโปรแกรม AddBookServlet.java.........................................................................................41
5.4.1 การอ"านค"าพาราม#เตอร�จาก addBook.html ......................................................................................425.4.2 การเช !อมต"อก�บฐานข�อม/ล...............................................................................................................425.4.3 เพ#!มรายช !อหน�งส อใหม"ลงในฐานข�อม/ล ................................................................................................435.4.4 การเร�ยกเว�บเพจ Thankyou.html ...............................................................................................43
5.5 ข�&นตอนการพ�ฒนาโปรแกรม AddBookServlet.java ...............................................................................455.6 ทดสอบโปรแกรม..............................................................................................................................47
Exercise 6 โปรแกรมเว�บเพ !อสาธ#ตขอบเขตของออปเจ�ค............................................................................................496.1 การพ�ฒนาโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Request .....................................................................49
6.1.1 ข�&นตอนการพ�ฒนาโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Request ....................................................526.1.2 ข�&นตอนการทดสอบโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Request....................................................52
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
3
6.2 การพ�ฒนาโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Session .....................................................................526.2.1 ข�&นตอนการพ�ฒนาโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Session .....................................................556.2.2 ข�&นตอนการทดสอบโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Session ...................................................55
6.3 การพ�ฒนาโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Application................................................................556.3.1 ข�&นตอนการพ�ฒนาโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Application...............................................586.3.2 ข�&นตอนการทดสอบโปรแกรมเพ !อสาธ#ตขอบเขตของ Object แบบ Application..............................................58
Exercise 7 การพ�ฒนาโปรแกรม Servlet โดยใช�คลาสประเภท Web Listener..........................................................597.1 การพ�ฒนาโปรแกรม Init.java..............................................................................................................597.2 การปร�บปร'งโปรแกรม AddBookServlet.java .....................................................................................647.3 ทดสอบโปรแกรม..............................................................................................................................65
Exercise 8 การพ�ฒนาโปรแกรม Servlet Filter ..............................................................................................678.1 การพ�ฒนาโปรแกรม Servlet Filter......................................................................................................678.2 การเข�ยนหน�า Login.........................................................................................................................68
8.2.1 ข�&นตอนการพ�ฒนาโปรแกรม ...........................................................................................................698.3 การเข�ยน Servlet Filter..................................................................................................................70
8.3.1 ข�&นตอนการพ�ฒนาโปรแกรม ...........................................................................................................718.4 การเข�ยนโปรแกรม ShowServlet .......................................................................................................73
8.4.1 ข�&นตอนการพ�ฒนาโปรแกรม ...........................................................................................................738.5 ข�&นตอนการทดสอบโปรแกรม .................................................................................................................74
Exercise 9 การเข�ยนโปรแกรม JSP เพ !อแสดงผลล�พธ�............................................................................................759.1 การพ�ฒนาโปรแกรม hello.jsp.............................................................................................................759.2 การพ�ฒนาโปรแกรม viewBook.jsp....................................................................................................76
9.2.1 การก.าหนด Tag Library .........................................................................................................769.2.2 การก.าหนด Datasource ..........................................................................................................769.2.3 การใช�ค.าส�!ง sql:query .............................................................................................................779.2.4 การใช�ค.าส�!ง c:forEach เพ !อแสดงผล ..............................................................................................77
Exercise 10 การพ�ฒนาโปรแกรมเว�บ Online Book Store................................................................................8010.1 การพ�ฒนาโปรแกรม selectBooks.jsp................................................................................................8010.2 การพ�ฒนาโปรแกรม 3Book.java.........................................................................................................8410.3 การพ�ฒนาโปรแกรม 3Cart.java...........................................................................................................8510.4 การพ�ฒนาโปรแกรม ProcessSelection.java......................................................................................8610.5 การพ�ฒนาโปรแกรม Init.java ...........................................................................................................8810.6 การพ�ฒนาโปรแกรม viewCart.jsp.....................................................................................................8810.7 ข�&นตอนการทดสอบโปรแกรม ...............................................................................................................89
Exercise 11 การสร�าง Custom Tags ส.าหร�บโปรแกรม JSP...............................................................................9211.1 การพ�ฒนาโปรแกรม hello.jsp............................................................................................................9211.2 การพ�ฒนาโปรแกรม helloTag.jsp.....................................................................................................94
11.2.1 สร�าง Tag Library Descriptor.............................................................................................9411.2.2 สร�างไฟล� Tag Handler.........................................................................................................9511.2.3 เข�ยนโปรแกรม helloTag.jsp...................................................................................................97
11.3 การพ�ฒนาโปรแกรม helloJSTL.jsp...................................................................................................9811.4 การพ�ฒนาโปรแกรม helloTagFile.jsp...............................................................................................98
11.4.1 สร�าง Tag File....................................................................................................................99
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
4
11.4.2 เข�ยนโปรแกรม helloTagFile.jsp...........................................................................................100Exercise 12 การพ�ฒนาโปรแกรมเว�บโดยใช� Strut Framework .........................................................................101
12.1 การสร�าง Web Application Project............................................................................................10112.2 การพ�ฒนาโปรแกรม BookActionForm.java...................................................................................10112.3 การพ�ฒนาโปรแกรม AddBook.jsp..................................................................................................10612.4 การพ�ฒนาโปรแกรม AddBookAction.java.....................................................................................10712.5 การพ�ฒนาไฟล� ApplicationResource.properties..........................................................................10912.6 การพ�ฒนาโปรแกรม Init.java และ Thankyou.html...........................................................................10912.7 การพ�ฒนาไฟล� Struts-config.xml.................................................................................................10912.8 การทดสอบโปรแกรม......................................................................................................................110
Exercise 13 การพ�ฒนาโปรแกรมเว�บโดยใช� JSF Framework............................................................................11213.1 การสร�าง Web Application Project............................................................................................11213.2 การพ�ฒนาโปรแกรม JSF Managed Bean........................................................................................11313.3 การพ�ฒนาโปรแกรม PriceValidator.java........................................................................................11513.4 การพ�ฒนาโปรแกรม AddBook.jsp..................................................................................................11613.5 การก.าหนด Page Navigation......................................................................................................11713.6 การก.าหนด Error Message.........................................................................................................11813.7 การพ�ฒนาโปรแกรม Thankyou.html, error.html และ Init.java.........................................................11913.8 การพ�ฒนาโปรแกรม AddBookServlet.java.....................................................................................11913.9 การทดสอบโปรแกรม......................................................................................................................121
Exercise 14 การพ�ฒนาโปรแกรมเว�บโดยใช� Visual JSF....................................................................................12214.1 การสร�าง Web Application Project............................................................................................12214.2 การพ�ฒนาโปรแกรม HelloWeb......................................................................................................12214.3 การทดสอบโปรแกรม......................................................................................................................12614.4 การปร�บปร'งโปรแกรม HelloWeb....................................................................................................12714.5 การทดสอบโปรแกรม......................................................................................................................129
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
5
Exercise 1 การสร�างโปรเจ�ค Web Application และไฟล� HTML
แบบฝ�กห�ดน�จะเป�นการสร�างโปรเจ�ค Web Application และพ�ฒนาหน�าเว�บเพจเพ��อให�ผ#�ใช�ป%อนข�อม#ลของล#กค�า โดยเว�บเพจจะพ�ฒนาด�วยภาษา HTML ซ,�งจะท.าหน�าเป�นส/วนอ0นพ1ตของโปรแกรมเพ��อให�ผ#�ใช�ป%อนข�อม#ลผ/าน Web Browser
ข��นตอนในการพ�ฒนาโปรแกรม1. สร�างโปรเจ�ค Web Application
2. พ�ฒนาโปรแกรม addCustomer.html
1.1 การสร�าง Web Application Project
เราจะเร0�มต�นสร�างโปรแกรม Web-Base Application โดยการสร�าง Project ใหม/ข,�นมาใน NetBeans
ซ,�งมข��นตอนด�งน�1. เล�อกเมน# File > New Project
2. ในไดอะล�อก New Project ให�เล�อก Categories เป�น Java Web และเล�อก Projects เป�น Web
Application ด�งร#ปท� 1.1
ร�ปท�� 1.1 การสร�างโปรเจ�ค Web Application
3. กด Next ก.าหนด Project Name: เป�น WebApp แล�วเล�อก Project Location: เป�น Directory ท�เรา
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
6
ต�องการจะเก�บไฟล5ไว� ด�งร#ปท� 1.2
ร�ปท�� 1.2 การก�าหนดช��อโปรเจ�ค
4. จากน��นให�เล�อก Server เป�น Apache Tomcat 6.0.18 ด�งร#ปท� 1.3
ร�ปท�� 1.3 การเล�อก Server ท��จะต�ดต��งโปรเจ�ค
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
7
5. กดป16ม Finish โปรแกรมจะท.าการสร�าง Projects และสร�างไฟล5ต/างๆ ข,�นมาโดยมโครงสร�างของไฟล5ด�งร#ปท�
ร�ปท�� 1.4 โครงสร�างไฟล!ของโปรเจ�ค WebApp
1.2 การพฒนาโปรแกรม addCustomer.html
โปรแกรม addCustomer.html เป�นเว�บเพจท�ใช�แสดงฟอร5มส.าหร�บป%อนข�อม#ลล#กค�า เข�าในฐานข�อม#ล customers ซ,�งจะสร�างข,�นในแบบฝ�กห�ดถ�ดไป โดยมร#ปแบบด�งร#ปท� 1.5 โปรแกรม addBook.html มข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด WebApp จากน��นเล�อกค.าส��ง New > Other
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก HTML แล�วกด Next
3. ก.าหนด HTML File Name: เป�น addCustomer แล�วกด Finish
4. เขยน source code ของไฟล5 addCustomer.html ตาม Listing ท� 1.1 โดยเราสามารถท�จะลาก icon
ประเภท HTML Forms ท�อย#/ในหน�าต/าง Palette เพ��อสามารถให�เขยนโปรแกรมได�ง/ายข,�น
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
8
ร�ปท�� 1.5 หน�าเว�บเพจ addCustomer.html
Listing ท� 1.1 โปรแกรม addCustomer.html
<html> <head> <title> Add Customer </title> </head> <body> <H1> Add a new customer profile </H1> <p> <form action="addCustomer.do" method="POST"> Customer ID : <input name="id" /> <br> Name: <input name="name" /> <br> Address: <textarea name="addr" rows="4" cols="20"></textarea> <br> Mobile: <input name="mobile" size="9" /> <br> Fax: <input name="fax" size="9" /> <br> E-mail: <input name="email" size="25" /> <br><br> <input type="submit" value="Add" /> </form> </body></html>
1.3 การทดสอบโปรแกรม
1. ท.าการ Clean and Build และ Undeploy and Deploy โปรแกรม WebApp
2. Run โปรแกรม WebApp
3. ท� Web Browser เปล�ยน URL เป�น http://localhost:8080/WebApp/addCustomer.html จะได�ผลล�พธ5ด�งร#ปท� 1.6
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
9
หมายเหต1 หมายเลขพอร5ตโดยพ��นฐานจะเป�น 8080 ยกเว�นว/าจะก.าหนดหมายเลขอ��น
ร�ปท�� 1.6 ผลล�พธ!ท��ได�จากการร�นโปรแกรม addCustomer.html
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
10
Exercise 2 การเข�ยนโปรแกรม Java Servlet เพ��ออ!านค!าพาราม"เตอร�
เน��อหาท��ต�องศ�กษาก�อน การสร�างโปรเจ�ค Web Application และสร�างไฟล5 HTML
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม Java Servlet เพ��อแสดงรายละเอยดของค/าพาราม0เตอร5ท�ผ#�ใช�ป%อนเข�ามาออกทางโปรแกรม Web Browser และแสดงผลการออกออกทาง Web Browser
2.1 การพฒนาโปรแกรม CustomerServlet.java
โปรแกรม CustomerServlet.java เป�นโปรแกรมท�ถ#กเรยกใช�โดย addCustomer.html เม��อผ#�ใช�กดป16ม Add โปรแกรมน�จะท.าหน�าท�น.าค/าพาราม0เตอร5ต/างๆ ท�ผ#�ใช�ป%อนมาแสดงผล โดยมข��นตอนการท.างานด�งน�
1. อ/านค/าพาราม0เตอร5ต/างๆ ท�ส/งมาจาก addCustomer.html
2. แสดงรายละเอยดของค/าต/างๆ
2.1.1 การอ/านค/าพาราม0เตอร5จาก addCustomer.html
เว�บเพจ addCustomer.html จะส/งข�อม#ลของรายช��อหน�งส�อใหม/ผ/านมาทางพาราม0เตอร5ต/างๆ ด�งน�● id รห�สของล#กค�า● name ช��อล#กค�า● addr ท�อย#/ล#กค�า● mobile หมายเลขโทรศ�พท5ม�อถ�อ● fax หมายเลข fax
● email ของล#กค�า
พาราม0เตอร5ต/างๆ เหล/าน�จะถ#กส/งผ/านโปรโตคอล Http และในโปรแกรมเราสามารถท�จะอ/านค/าพารา-
ม0เตอร5เหล/าน�ได�จากออปเจ�ค request โดยเรยกใช�เมธอด getParameter() ซ,�งโปรแกรมส/วนน�จะมค.าส��งต/างๆ ด�งน�
String id = request.getParameter("id"); String name = request.getParameter("name"); String addr = request.getParameter("addr"); String mobile = request.getParameter("mobile"); String fax = request.getParameter("fax"); String email = request.getParameter("email");
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
11
2.1.2 การแสดงรายละเอยดของค/าต/างๆ
โปรแกรม Servlet จะสามารถแสดงผลออกทาง Web Browser ได�โดยการเขยนโค�ด HTML ภายใน ค.าส��ง out.println() โดยมค.าส��งในเมธอด processRequest() ด�งน�
response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); out.println("<html>"); out.println("<head>"); out.println("<title>Customer Information</title>"); out.println("</head>"); out.println("<body>");
String id = request.getParameter("id"); String name = request.getParameter("name"); String addr = request.getParameter("addr"); String mobile = request.getParameter("mobile"); String fax = request.getParameter("fax");
String email = request.getParameter("email");
out.println("<h1> Customer Information </h1>"); out.println("<b>ID: </b>" + id + "<BR>"); out.println("<b>Name: </b>" + name + "<BR>"); out.println("<b>Address: </b>" + addr + "<BR>"); out.println("<b>Mobile: </b>" + mobile + "<BR>"); out.println("<b>Fax: </b>" + fax + "<BR>");
out.println("<b>E-mail: </b>" + email + "<BR>"); out.println("</body>"); out.println("</html>"); out.close();
2.2 ข�นตอนการพฒนาโปรแกรม CustomerServlet.java
เราสามารถท�จะพ�ฒนาโปรแกรม CustomerServlet.java ตามข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด WebApp จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ท�ช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก Servlet แล�วกด Next ด�งร#ปท� 2.1
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
12
ร�ปท�� 2.1 การเล�อกไฟล!ประเภท Servlet
3. ก.าหนด Class Name: เป�น CustomerServlet และก.าหนด Package เป�น servlet ด�งร#ปท� 2.2
ร�ปท�� 2.2 การก�าหนดช��อ Servlet
4. กด Next ก.าหนด URL Pattern(s): เป�น /addCustomer.do ด�งร#ปท� 2.3
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
13
ร�ปท�� 2.3 การก�าหนด URL Pattern
5. กด Finish โปรแกรม NetBeans จะสร�างไฟล5 CustomerServlet.java ไว�ภายใต� Source Packages
โดยจะอย#/ใน Directory ช��อ servlet
6. ในหน�าต/าง editor ให�แก�ไข sourcecode ของไฟล5 CustomerServlet.java โดยม source code ของเมธอด processRequest ตามห�วข�อ 2.1.2
2.3 การทดสอบโปรแกรม
1. ท.าการ Build และ Deploy โปรแกรม WebApp
2. Run โปรแกรม WebApp
3. ท� Web Browser เปล�ยน URL เป�น http://localhost:8080/WebApp/addCustomer.html
4. ทดลองป%อนข�อม#ลด�งร#ป5. โปรแกรมจะแสดงผลด�งร/ปท�! 2.4 และ 2.5
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
14
ร�ปท�� 2.4 การป+อนข�อม�ลหน�า addCustomer.html
ร�ปท�� 2.5 ผลล�พธ!จากการเร�ยกโปรแกรม CustomerServlet
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
15
2.4 การปรบปร�งโปรแกรมเพ��อให�แสดงผลภาษาไทยและเร%ยกไฟล' addCustomer.html เม��อเร(�มต�น
เราสามารถท�!จะปร�บปร'งโปรเจ�คน�&เพ !อให�เร�ยกไฟล� addCustomer.html โดยอ�ตโนม�ต#เม !อเร#!มต�นร�นโปรแกรม โดยการก.าหนดพาราม#เตอร� Welcome Files ให�เป6นไฟล�ด�งกล"าว โดยม�ข�&นตอนด�งน�&
1. ในหน�าต/าง Projects ขยายโหนด WebApp > Web Pages > WEB-INF
2. เล�อกไฟล5 web.xml แล�วเล�อกแทป Pages ท.าการแก�ไข Welcome Files เป�น addCustomer.html ด�งร#ปท� 2.6
ร�ปท�� 2.6 การจ�ดการไฟล! web.xml
นอกจากน�ถ�าเราทดลองป%อนข�อม#ลภาษาไทย ลงไปในจะพบว/า โปรแกรม Web Browser บางต�วจะแสดงผลล�พธ5ภาษาไทยไม/ถ#กต�อง เราสามารถแก�ไขได�โดยการก.าหนดให�การเข�ารห�สของพาราม0เตอร5ท�ส/งมาเป�น UTF-
8 โดยเพ0�มค.าส��งด�งน�
request.setCharacterEncoding("UTF-8");
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
16
Exercise 3 โปรแกรมเว�บส%าหร�บการท%าโพล
เน��อหาท��ต�องศ�กษาก�อน การเขยนโปรแกรม Java Servlet เพ��ออ/านค/าพาราม0เตอร5
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม Java Servlet เพ��อท.า Poll โดยให�ผ#�ใช�สามารถท�จะโหวตเล�อกภาษาคอมพ0วเตอร5ท�ชอบได� แล�วโปรแกรมจะแสดงผลการโหวตทาง Web Browser
3.1 การพฒนาโปรแกรม vote.html
โปรแกรม vote.html เป�นหน�าเว�บท�ให�ผ#�ใช�สามารถท�จะท.าการโหวตเล�อกภาษาคอมพ0วเตอร5ได� โดยเม��อผ#�ใช�กดป16ม Vote โปรแกรมเว�บก�จะไปท.าการเรยก url ท�ช��อ processVote โปรแกรมน�มหน�าเว�บด�งร#ปท� 3.1
ร�ปท�� 3.1 การแสดงผลของโปรแกรม vote.html
และม sourcecode ด�ง Listing ท� 3.1
Listing ท� 3.1 โปรแกรม vote.html
<html> <head> <title> Web Voting</title> </head> <body> <form action="processVote" method="POST"> Select a computer language <BR>
<input type="radio" name="lang" value="1" /> Java <br> <input type="radio" name="lang" value="2" /> C# <br> <input type="radio" name="lang" value="3" /> C <br> <input type="radio" name="lang" value="4" /> Pascal <br>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
17
<input type="submit" value="Vote" />
</form> </body></html>
3.2 การพฒนาโปรแกรม VoteServlet.java
โปรแกรม VoteServlet.java เป�นโปรแกรมท�ถ#กเรยกใช�โดย vote.html เม��อผ#�ใช�กดป16ม Vote โปรแกรมน�จะท.าหน�าท�เพ��อน.าค/าท�ผ#�ใช�โหวตมาประมวลผล โดยมข��นตอนการท.างานด�งน�
1. ก.าหนดต�วแปร counter และ lang
2. อ/านค/าพาราม0เตอร5ต/างๆท�ส/งมาจาก vote.html และท.าการประมวลผล3. แสดงผลการโหวต
3.2.1 ก.าหนดต�วแปร counter และ lang
ต�วแปร count เป�นอะเรย5เพ��อท�จะเก�บจ.านวนผลโหวตของภาษาคอมพ0วเตอร5แต/ละภาษา และต�วแปร lang
เป�นอะเรย5ของ String เพ��อท�จะเก�บรายช��อภาษาคอมพ0วเตอร5 ต�วแปรท��งสองเป�นต�วแปรของออปเจ�คท�จะประกาศนอกเมธอด โดยมค.าส��งประกาศด�งน�
String []lang ={"Java", "C#", "C", "Pascal"}; int []count = new int[4];
3.2.2 อ/านค/าพาราม0เตอร5ต/างๆท�ส/งมาจาก vote.html และท.าการประมวลผล
เว�บเพจ vote.html จะส/งข�อม#ลของการโหวตมาในพาราม0เตอร5ท�ช��อ lang โดยจะมค/าเป�นหมายเลข 1-
4 ในท�น�จะมค.าส��ง request.getParameter เพ��อจะอ/านค/าท�โหวตมา จากน��นจะท.าการแปลงค/าซ,�งเป�น String ให�เป�นค/าจ.านวนเต�ม จากน��นจะเป�นการเพ0�มจ.านวนโหวตในต�วแปร count ตามค/า index ท�สอดคล�องก�บภาษาท�โหวตมา โดยมค.าส��งต/างๆ ด�งน�
String vote = request.getParameter("lang"); int voteNum = Integer.parseInt(vote) – 1; count[voteNum]++;
3.2.3 การแสดงผลการโหวต
ค.าส��งแสดงผลการโหวตจะเป�นค.าส��งเพ��อแสดงค/าของต�วแปร count โดยมค.าส��งด�งน�
for (int i = 0; i < count.length; i++) { out.println(lang[i] +" = " + count[i] + "<BR>");
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
18
}
โปรแกรม VoteServlet.java จะม sourcecode ด�ง Listing ท� 3.2
Listing ท 3.2 โปรแกรม VoteServlet.java
import java.io.*;import java.util.HashSet;
import javax.servlet.*;import javax.servlet.http.*;
public class VoteServlet extends HttpServlet {
String []lang ={"Java", "C#", "C", "Pascal"}; int []count = new int[4];
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); String vote = request.getParameter("lang"); int voteNum = Integer.parseInt(vote) - 1; count[voteNum]++;
out.println("<html>"); out.println("<head>"); out.println("<title>Servlet VoteServlet</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1>Servlet VoteServlet at " + request.getContextPath() + "</h1>"); for (int i = 0; i < count.length; i++) { out.println(lang[i] +" = " + count[i] + "<BR>"); } out.println("</body>"); out.println("</html>"); out.close(); }
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
19
public String getServletInfo() { return "Short description"; } // </editor-fold>}
3.3 ข�นตอนการพฒนาโปรเจ*ค Voter
เราสามารถท�จะพ�ฒนาแบบฝ�กห�ดน�ท�ช��อโปรเจ�ค Voter ตามข��นตอนด�งน�
1. เล�อกค.าส��งสร�าง New Project > Web Application จากน��นก.าหนดช��อโปรเจ�คเป�น Voter ด�งร#ปท� 3.2
ร�ปท�� 3.2 การสร�างโปรเจ�ค Web Application
2. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด Voter จากน��นเล�อกค.าส��ง New > Other...
3. ในไดอะล�อก New File ให�เล�อก Categories ท�ช��อ Java Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก HTML แล�วกด Next
4. ก.าหนด HTML File Name: เป�น vote แล�วกด Finish
5. ในหน�าต/าง Editor เขยน Source code ของ vote.html ด�ง Listing ท� 3.1
6. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด Voter จากน��นเล�อกค.าส��ง New > Servlet
7. ก.าหนด Class Name: เป�น VoteServlet.java และ Package เป�น controller แล�วกด Next ก.าหนด URL Pattern(s): เป�น /processVote แล�วกด Finish
8. ในหน�าต/าง Editor เขยน Source code ของ VoteServlet.java ด�ง Listing ท� 3.2
9. กด Save แล�วท.าการ run โปรเจ�คเพ��อทดสอบโปรแกรมโดยเรยก URL ท�
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
20
http://localhost:8080/Voter/vote.html โดยจะได�ผลล�พธ5ด�งต�วอย/างในร#ปท�3.3
ร�ปท�� 3.3 ต�วอย-างผลล�พธ!ของโปรเจ�ค Voter
3.4 การปรบปร�งโปรแกรม VoteServlet.java
ข��นตอนน�จะเป�นการปร�บปร1งโปรแกรม VoteServlet.java เพ��อป%องก�นการโหวตซ�.าท��งน�จะไม/อน1ญาตให� ผ#�ใช�ท�ใช�หมายเลขไอพเดยวก�นโหวตซ�.าได� โดยจะเก�บหมายเลขไอพท�ท.าการโหวตแล�วในออปเจ�คชน0ด HashSet
การพ�ฒนาโปรแกรมน�มค.าส��งเพ0�มเต0มท�ส.าค�ญด�งน�1. ก.าหนดต�วแปร voters
2. อ/านหมายเลขไอพของผ#�โหวตและเพ0�มคะแนนการโหวตหากหมายเลขไอพน�ไม/เคยโหวต
3.4.1 ก.าหนดต�วแปร voters
ต�วแปร voters เป�นต�วแปรชน0ด HashSet ท�จะเก�บหมายเลขไอพของผ#�โหวต โดยจะประกาศเป�นต�วแปร ออปเจ�คท�มค.าส��งประกาศด�งน�
HashSet voters = new HashSet();
3.4.2 การอ/านหมายเลขไอพของผ#�ใช�
การอ/านหมายเลขไอพของผ#�ใช�ท.าได�โดยเรยกใช� ค.าส��ง getRemoteAddr() ในออปเจ�ค request เม��อทราบหมายเลขไอพ เราสามารถท�จะตรวจสอบได�ว/าหมายเลขน�เคยโหวตแล�วหร�อไม/ โดยการตรวจสอบว/าออปเจ�ค voters มค/าหมายเลขไอพน�หร�อไม/โดยใช�ค.าส��ง contain() หากย�งไม/เคยโหวตก�ให�เพ0�มค/าต�วน�บและเพ0�มหมายเลขไอพน�ในออปเจ�ค voters โดยมค.าส��งด�งน�
String ip = request.getRemoteAddr();
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
21
if (!voters.contains(ip)) { count[voteNum]++; voters.add(ip); } else { out.println("This IP address has been voted"); }
ส.าหร�บโปรแกรม VoteServlet.java ท�ปร�บปร1งใหม/จะม sourcecode ด�ง Listing ท� 3.3
Listing ท� 3.3 โปรแกรม VoteServlet.java เพ��อป%องก�นการโหวตซ�.า
import java.io.*;import java.util.HashSet;
import javax.servlet.*;import javax.servlet.http.*;
public class VoteServlet extends HttpServlet { String []lang ={"Java", "C#", "C", "Pascal"}; int []count = new int[4]; HashSet voters = new HashSet(); protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); String vote = request.getParameter("lang"); int voteNum = Integer.parseInt(vote) - 1; String ip = request.getRemoteAddr(); if (!voters.contains(ip)) { count[voteNum]++; voters.add(ip); } else { out.println("This IP address has been voted"); } out.println("<html>"); out.println("<head>"); out.println("<title>Servlet VoteServlet</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1>Servlet VoteServlet at " + request.getContextPath() + "</h1>"); for (int i = 0; i < count.length; i++) { out.println(lang[i] +" = " + count[i] + "<BR>"); } out.println("</body>"); out.println("</html>"); out.close(); }
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
22
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
}
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
23
Exercise 4 การเช��อมต!อก�บ MySQL Database
เน��อหาท��ต�องศ�กษาก�อน -
แบบฝ8กห�ดน�&เป6นข�&นตอนการต#ดต�&ง NetBeans เพ !อเช !อมต"อก�บโปรแกรมฐานข�อม/ล MySQL ท�!เป6นโปรแกรมฐานข�อม/ล OpenSource แบบ FreeWare ซ:!งปกต#จะม�ต�วอย"างฐานข�อม/ลท�!สร�างมาพร�อมแล�วอย/"หลายช'ด หน:!งในน�&นค อฐานข�อม/ลท�!ช !อ test ท�!เราจะใช�ในการทดสอบการเช !อมต"อก�บโปรแกรม NetBeans
4.1 การต(ดต�งโปรแกรมฐานข�อม-ล MySQL
ข��นตอนน�เป�นการต0ดต��งโปรแกรม MySQL Server 5.0 โดยมข��นตอนด�งน�
1. ท.าการดาวน5โหลดโปรแกรม MySQL Server 5.0 จาก URL ท�ช��อ http://www.mysql.com/
2. ท.าการ unzip โปรแกรม mysql-5.0.xx-win32.zip
3. ร�นโปรแกรม setup.exe เพ��อท.าการต0ดต��งโปรแกรม MySQL Server 5.0 โดยโปรแกรมจะแสดงไดอะล�อกด�งร#ปท� 4.1
ร�ปท�� 4.1 การต�ดต��ง MySQL Server
4. กดป16ม Next แล�วท.าการต0ดต��งโปรแกรมตามข��นตอนต/างๆ โดยให�ก.าหนดไดเร�กทอร�ท�ต�องการต0ดต��งตามความเหมาะสม
4.2 การสร�าง Database Connection
เม !อต#ดต�&ง Database แล�ว เราสามารถท�!จะใช� NetBeans เพ !อเช !อมต"อ Database โดยใช� JDBC Driver
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
24
ซ:!งในท�!น�&จะใช� Driver ท�!ช !อ MySQL Connector/J ซ:!งเป6น Driver ท�!พ�ฒนาโดยใช�ภาษาจาวาและต#ดต"อโดยตรงก�บ Database และโปรแกรม NetBeans 6.5 ได�ต#ดต�&งมาไว�ให�แล�ว เราสามารถท�!จะเช !อมต"อก�บ Database โดยใช� Driver ด�งกล"าวได� โดยม�ข�&นตอนด�งน�&
1. ในโปรแกรม NetBeans เล อกแทป Services แล�วขยายโหนด Databases > Drivers
2. เล อกโหนด MySQL(Connector/J Driver) จากน�&นคล#;กขวาเล อก Connect Using.. ด�งร/ปท�! 4.2
ร�ปท�� 4.2 การเล�อกค�าส��งเช��อมต-อ Database
3. ในไดอะล�อก New Database Connection ให�ระบ' ● Host: เป6น localhost● Port: เป6น 3306● Database: เป6น test
● User Name: เป6น root4. ส.าหร�บ Password: ให�ใส"ค"าตามท�!ก.าหนดไว�ในตอนต#ดต�&งโปรแกรม MySQL ซ:!งในท�!น�&จะม�ค"าเป6น
root
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
25
5. ท.าการเล อก Remember password โดยไดอะล�อกจะแสดงผลได�ด�งร/ปท�! 4.3
ร�ปท�� 4.3 การก�าหนดค-าในการเช��อมต-อ Database
6. กดป'<ม OK เม !อไดอะล�อกแสดงข�อความให�เล อก database schema.ให�กดป'<ม OK อ�กคร�&งซ:!งตอนน�&ถ�าขยายแทบ Database ในหน�าต"าง Runtime จะเห�น Connection ใหม"ด�งร/ปท�! 4.4
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
26
ร�ปท�� 4.4 การแสดงการเช��อมต-อ
4.3 การสร�างตาราง books
ในท�!น�&จะก.าหนดให�สร�าง Table ท�!ช !อ books โดยให�อย/"ภายใต� Schema ท�!ช !อ test โดย Table น�&ก.าหนดให�ม� Column ต"างๆ ด�งตารางท�! 4.1
ตารางท�! 4.1 Table books
ช��อ ชน�ด ขนาดisbn varchar 20title varchar 70
author varchar 50price float -
เราจะใช�โปรแกม NetBeans ในการท�!จะสร�าง Table น�&โดยม�ข�&นตอนต"างๆ ด�งน�&
1. ในหน�าต"าง Runtime ขยายแทบ Databases > jdbc:mysql://localhost:3306/test แล�วจะเห�นรายการ Tables
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
27
2. คล#;กขวาท�! Tables แล�วเล อก Create Table... ด�งร/ปท�! 4.5
ร�ปท�� 4.5 การเล�อกค�าส��งสร�างตาราง
3. ภายในไดอะล�อก Create Table ให�ก.าหนด Table Name เป6น books แล�วใส" Column ต"างๆ ด�งตารางท�! 4.1 และก.าหนดให� isbn เป6น Key โดยไดอะล�อกจะแสดงผลได�ด�งร/ปท�! 4.6
ร�ปท�� 4.6 การสร�างตารางช��อ books
4. แล�วกด OK ซ:!งตอนน�&ในหน�าต"าง Runtime ถ�าขยายแทบ Tables > books จะเห�น Column ต"างๆ ด�งร/ปท�! 4.7
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
28
ร�ปท�� 4.7 ผลล�พธ!จากการสร�างตาราง
4.4 การใช�ค/าส�ง SQL ใน NetBeans
ภายหล�งจากท�!ม�การสร�าง Table ท�!ช !อ books เราสามารถท�!จะใช�โปรแกรม NetBeans สร�างค.าส�!ง SQL
เพ !อท�!จะต#ดต"อก�บฐานข�อม/ล ในท�!น�&จะแสดงการเพ#!มข�อม/ลลงใน Table โดยม�ข�&นตอนต"างๆด�งน�&
1. ตรงโหนด Procedures คล#;กขวาท�!โหนดแล�วเล อกค.าส�!ง Execute Command... หน�าต"าง SQL Editor
จะปรากฎข:&นมา2. ให�ป>อนค.าส�!ง SQL เป6น
INSERT INTO books VALUES ('123', 'Intro to Java Programming', 'Thanachart', 500.00)
3. กด Enter หร อ (Ctrl-Shift-E) เพ !อร�นค.าส�!ง SQL
4. เราสามารถท�!จะด/ข�อม/ลท�!ป>อนเข�าไปได� โดยเล อกค.าส�!ง View Data.. จาก Table ท�!ช !อ books ด�งร/ปท�! 4.8
ร�ปท�� 4.8 การเร�ยกค�าส��งด�ข�อม�ลในตาราง
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
29
Exercise 5 การพ�ฒนาโปรแกมเว�บเพ��อต"ดต!อก�บฐานข�อม,ล
เน��อหาท��ต�องศ�กษาก�อน การเช��อมต/อก�บ MySQL Database
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม Web Application โดยใช� Java Servlet เพ��อเช��อมต/อก�บฐานข�อม#ล ในท�น�ก.าหนดให�ใช�ฐานข�อม#ล MySQL ซ,�งม Table ท�ช��อ books โปรแกรมท�จะพ�ฒนาข,�นเป�นการเพ0�มข�อม#ลลงใน Table ด�งกล/าว โดยก.าหนดให�ผ#�ใช�ป%อนรายละเอยดข�อม#ลผ/านเว�บเพจท�ช��อ addBook.html ซ,�งเม��อผ#�ใช�กดป16ม Add โปรแกรมก�จะไปเรยกโปรแกรม Servlet ท�ช��อ AddBookServlet ซ,�งจะมค.าส��งในอ/านค/า parameter ท�ผ#�ใช�ป%อนเข�ามาและท.าการใส/ข�อม#ลลงใน Table ด�งกล/าว โดยใช�ช1ดค.าส��ง JDBC
ข��นตอนในการพ�ฒนาโปรแกรม1. สร�างโปรเจ�ค WebBaseDB
2. พ�ฒนาโปรแกรม addBook.html และ Thankyou.html
3. พ�ฒนาโปรแกรม AddBookServlet.java
5.1 การสร�าง Web Application Project
เราจะเร0�มต�นสร�างโปรแกรม Web-Base Database โดยการสร�าง Project ใหม/ข,�นมาใน NetBeans ซ,�งมข��นตอนด�งน�
1. เล�อกเมน# File > New Project..
2. ในไดอะล�อก New Project ให�เล�อก Categories เป�น Java Web และเล�อก Projects เป�น Web
Application แล�วกด Next
3. ก.าหนด Project Name: เป�น WebBaseDB แล�วเล�อก Project Location: เป�น Director ท�เราต�องการจะเก�บไฟล5ไว� จากน��นเล�อก Server เป�น Apache Tomcat 6.0.18 แล�วกด Finish
5.2 การพฒนาโปรแกรม addBook.html
โปรแกรม addBook.html เป�นเว�บเพจท�ใช�แสดงฟอร5มส.าหร�บป%อนข�อม#ลหน�งส�อใหม/เข�าในฐานข�อม#ล books ซ,�งมล�กษณะด�งร#ปท� 5.1 โปรแกรม addBook.html มข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด WebBaseDB จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก HTML แล�วกด Next
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
30
3. ก.าหนด HTML File Name: เป�น addBook แล�วกด Finish
4. เขยน source code ของไฟล5 addBook.html ตาม Listing ท� 5.1 โดยเราสามารถท�จะลาก icon ประเภท HTML Forms ท�อย#/ในหน�าต/าง Palette ด�งร#ปท� 5.2 เพ��อสามารถให�เขยนโปรแกรมได�ง/ายข,�น
ร�ปท�� 5.1 หน�าเว บเพจ addBook.html
ร�ปท�� 5.2 ต�วอย-างหน�าต-าง Palette ส�าหร�บการเข�ยนค�าส��ง HTML
Listing ท� 5.1 โปรแกรม addBook.html
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Add a new book</title>
</head> <body>
<h1>Add a new book</h1>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
31
<P> <form action="addBook.do" method="POST"> ISBN : <input type="text" name="isbn" value="" size="15"/> <BR> Title : <input type="text" name="title" value="" size="50"/> <BR>
Author : <input type="text" name="author" value="" size="50"/> <BR> Price : <input type="text" name="price" value="" size="10"/> <BR> <input type="submit" value="Add" /> </form> </body></html>
5.3 การพฒนาโปรแกรม Thankyou.html
โปรแกรม Thankyou.html เป�นเว�บเพจท�ใช�แสดงให�เห�นว/าข�อม#ลได�ถ#กเพ0�มเข�าไปในฐานข�อม#ลแล�ว โดยม sourcecode ด�ง Listing ท� 2 ซ,�งข��นตอนการพ�ฒนาโปรแกรมน�จะเป�นเช/นเดยวก�บการพ�ฒนาโปรแกรม addBook.html
Listing ท� 5.2 โปรแกรม Thankyou.html
<html> <head> <title>Thank you</title> </head> <body> <H1>Thank you for inserting data </H1> </body></html>
5.4 การพฒนาโปรแกรม AddBookServlet.java
โปรแกรม AddBookServlet.java เป�นโปรแกรมท�ถ#กเรยกใช�โดย addBook.html เม��อผ#�ใช�กดป16ม Add
โปรแกรมน�จะท.าหน�าท�เพ��อต0ดต/อก�บฐานข�อม#ลโดยมข��นตอนการท.างานด�งน�1. อ/านค/าพาราม0เตอร5ต/างๆท�ส/งมาจาก addBook.html
2. เช��อมต/อก�บฐานข�อม#ล books
3. เพ0�มรายช��อหน�งส�อใหม/ลงในฐานข�อม#ล books
4. เรยกเว�บเพจ Thankyou.html
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
32
5.4.1 การอ/านค/าพาราม0เตอร5จาก addBook.html
เว�บเพจ addBook.html จะส/งข�อม#ลของรายช��อหน�งส�อใหม/ผ/านมาทางพาราม0เตอร5ต/างๆด�งน�● isbn หมายเลข ISBN ของหน�งส�อ● title ช��อหน�งส�อ● author ช��อผ#�แต/ง● price ราคาหน�งส�อ
พาราม0เตอร5ต/างๆเหล/าน�จะถ#กส/งผ/านโปรโตคอล Http และในโปรแกรมเราสามารถท�จะอ/านค/าพาราม0เตอร5เหล/าน�ได�จากออปเจ�ค request โดยเรยกใช�เมธอด getParameter() ซ,�งโปรแกรมส/วนน�จะมค.าส��งต/างๆด�งน�
String isbn = request.getParameter("isbn"); String author = request.getParameter("author"); String title = request.getParameter("title"); String priceStr = request.getParameter("price");
5.4.2 การเช��อมต/อก�บฐานข�อม#ล
การเขยนโปรแกรมเพ��อเช��อมต/อก�บฐานข�อม#ลเพ��อเป�นการเรยกใช�ค.าส��ง SQL ซ,�งจะต�องใช� JDBC
API โดยจะมข��นตอนด�งน�
● ท.าการโหลด Driver ส.าหร�บ Database Server ท�ต�องการเช��อมต/อ ผ/าน DriverManager หร�อ โหลด DataSource จาก JNDI
● ด,งออปเจ�คชน0ด Connection จาก Driver หร�อ Datasource
● ด,งออปเจ�คชน0ด Statement จากออปเจ�คชน0ด Connection
● เรยกใช�ค.าส��ง SQL โดยใช�เมธอด executeQuery() หร�อ executeUpdate() ของออปเจ�คชน0ด Statement
โปรแกรม AddBookServlet จะใช�ว0ธการโหลด DataSource จาก JNDI ซ,�งเราไม/จ.าเป�นท�จะต�องโหลด ท1กคร��งท�มการเรยกใช�โปรแกรม Servlet น�แต/จะท.าการโหลดคร��งแรกท�มการเรยกใช� Servlet น� ด�งน��นเราจะเขยน sourcecode ส/วนน�ท�เมธอด init() ด�งน�
private Connection conn; public void init() { try { conn = jdbcTest.getConnection(); } catch (Exception ex) { System.out.println(ex);
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
33
} }
5.4.3 เพ0�มรายช��อหน�งส�อใหม/ลงในฐานข�อม#ล
เม��อเช��อมต/อฐานข�อม#ลและได�ออปเจ�คชน0ด Connection มาแล�ว เราสามารถท�จะเรยกใช�ค.าส��ง SQL ได� ซ,�งในท�น�ค�อค.าส��ง INSERT ซ,�งจะมร#ปแบบของค.าส��งด�งน�
INSERT INTO books VALUES(....)
โดยเราจะใช�ค/าจากพาราม0เตอร5ต/างๆท�ร�บมา ด�งน��นถ�าข�อม#ลท�ป%อนเข�ามาถ#กต�องเราสามารถท�จะเพ0�มรายช��อหน�งส�อใหม/ลงในฐานข�อม#ลโดยใช�ค.าส��งด�งน�
Statement stmt = conn.createStatement(); String sql = "INSERT INTO books VALUES('"+isbn+"','" + title +"','" +author +"',"+price +")"; int numRow = stmt.executeUpdate(sql); 5.4.4 การเรยกเว�บเพจ Thankyou.html
เม��อข�อม#ลได�ถ#กเพ0�มลงไปในฐานข�อม#ลแล�ว โปรแกรม AddBookServlet จะท.าการเรยกเว�บเพจ Thankyou.html โดยการเรยกใช� RequestDispatcher ด�งน�
RequestDispatcher obj = request.getRequestDispatcher("Thankyou.html"); if (numRow == 1 && obj != null) { obj.forward(request,response); }
โปรแกรม AddBookServlet.java จะม sourcecode ท��งหมดด�ง Listing ท� 5.3
Listing ท� 5.3 โปรแกรม AddBookServlet.java
package controller;
import java.io.IOException;import java.io.PrintWriter;import java.sql.Connection;import java.sql.SQLException;import java.sql.Statement;import javax.naming.Context;import javax.naming.InitialContext;import javax.servlet.*;import javax.servlet.http.*;import javax.sql.DataSource;
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
34
public class AddBookServlet extends HttpServlet { @Resource(name = "jdbc/test") private DataSource jdbcTest; private Connection conn;
public void init() { try { conn = jdbcTest.getConnection(); } catch (Exception ex) { System.out.println(ex); } }
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); out.println("<html>"); out.println("<head>"); out.println("<title>Add a new book</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1> Add a new book </h1>"); try { String isbn = request.getParameter("isbn"); String author = request.getParameter("author"); String title = request.getParameter("title"); String priceStr = request.getParameter("price"); float price = Float.parseFloat(priceStr); Statement stmt = conn.createStatement(); String sql = "INSERT INTO books VALUES('"+isbn+"','" + title +"','" +author +"',"+price+")"; int numRow = stmt.executeUpdate(sql); RequestDispatcher obj = request.getRequestDispatcher("Thankyou.html"); if (numRow == 1 && obj != null) { obj.forward(request,response); } } catch (SQLException ex) { out.println("Error " + ex); return; } out.println("</body>"); out.println("</html>"); out.close(); } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response);
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
35
} protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
}
5.5 ข�นตอนการพฒนาโปรแกรม AddBookServlet.java
เราสามารถท�จะพ�ฒนาโปรแกรม AddBookServlet.java ตามข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด WebBaseDB จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก Servlet แล�วกด Next
3. ก.าหนด Class Name: เป�น AddBookServlet และก.าหนด Package เป�น controller แล�วกด Next
4. ก.าหนด URL Pattern(s): เป�น /addBook.do แล�วกด Finish
5. โปรแกรม NetBeans จะสร�างไฟล5 AddBookServlet.java ไว�ภายใต� Source Packages โดยจะอย#/ใน Directory ช��อ controller
6. ในหน�า Editor ให�คล0;กขวาเล�อก Insert Code... > Use Database ด�งร#ปท� 5.3
ร�ปท�� 5.3 การเล�อกค�าส��ง Use Database
7. ในไดอะล�อก Choose Database กดป16ม Add...
8. ในไดอะล�อก Add Data Source Reference กดป16ม Add...
9. ในไดอะล�อก Create Data Source ก.าหนด JNDI Name เป�น jdbc/test และเล�อก Database
Connection เป�น jdbc:mysql//localhost:3306/test ด�งร#ปท� 5.4
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
36
ร�ปท�� 5.4 การก�าหนดค-า JNDI
10. กดป16ม OK โปรแกรมจะกล�บไปแสดงไดอะล�อก Add Data Source Reference ให�ก.าหนด Reference
Name: เป�น jdbc/test ด�งร#ปท� 5.5
ร�ปท�� 5.5 การก�าหนดค-า Reference Name
11. กดป16ม OK จะได�ไดอะล�อก Choose Database ด�งร#ปท� 5.6
ร�ปท�� 5.6 หน�าไดอะล�อก Choose Database
12. กดป16ม OK โปรแกรม NetBeans จะเพ0�ม context.xml ให�อ�ตโนม�ต0 โดยสามารถด#ได�จากการ ขยายโหนด WebBaseDB > Web Pages > META-INF [หมายเหต1 ในกรณท�ใช� GlassFish Server ค.าส��งน�จะเขยนในไฟล5 sun-web.xml]
13. โปรแกรมจะเพ0�ม sourcecode ให�ด�งน�
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
37
@Resource(name = "jdbc/test") private DataSource jdbcTest;
14. ในหน�าต/าง editor ให�แก�ไข sourcecode ของไฟล5 AddBookServlet.java ให�เป�นไปตาม Listing ท� 5.3
15. โปรแกรมจะมข�อผ0ดพลาดอย#/เน��องจากย�งไม/ได�ท.าการ import คลาสต/างๆ เราสามารถแก�ไขได�โดยคล0;กขวาในหน�าต/าง editor แล�วเล�อก Fix Imports หร�อกด Ctrl+Shift+I โปรแกรมจะแสดงช��อคลาสต/างๆ ท�ต�อง Import มาให�เล�อก ในท�น�จะต�องเล�อกคลาสให�ถ#กต�องด�งร#ปท� 5.7
ร�ปท�� 5.7 การก�าหนดคลาสท��ต�อง import
16. ท.าการ Save โปรแกรมโดยการกด Ctrl+S
17. ตรวจสอบไฟล5 context.xml จะเป�นด�ง Listing ท� 5.4
Listing ท� 5.4 ไฟล5 context.xml
<?xml version="1.0" encoding="UTF-8"?><Context path="/WebBaseDB"> <Resource auth="Container" driverClassName="com.mysql.jdbc.Driver" maxActive="20" maxIdle="10" maxWait="-1" name="jdbc/test" password="root" type="javax.sql.DataSource" url="jdbc:mysql://localhost:3306/test" username="root"/></Context>
5.6 ทดสอบโปรแกรม
1. ท.าการ Build และ Deploy โปรแกรม WebBaseDB
2. Run โปรแกรม WebBaseDB ท��งน�ต�องท.าการร�น MySQL Database Server ก/อน 3. โปรแกรมจะแสดงหน�า addBook.html ให�เราใส/ข�อม#ล ลองทดลองใส/ข�อม#ลด�งร#ปท� 5.8
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
38
ร�ปท�� 5.8 ต�วอย-างการป+อนข�อม�ล Books
4. เม��อกดป16ม Add โปรแกรมก�จะใส/ข�อม#ลลงใน Database และแสดงผลล�พธ5ด�งร#ปท� 5.9
ร�ปท�� 5.9 ผลล�พธ!ท��แสดงทาง Web Browser
5. เราสามารถท�จะด#ข�อม#ลท�ป%อนเข�าไปได� โดยไปท�หน�าต/าง Services ของโปรแกรม NetBeans แล�วเล�อกค.าส��ง View Data.. จาก Table ท�ช��อ books ด�งร#ปท� 5.10
ร�ปท�� 5.10 ข�อม�ลท��ถ�กป+อนเข�า Table ท��ช��อ books
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
39
Exercise 6 โปรแกรมเว�บเพ��อสาธ"ตขอบเขตของออปเจ�ค
เน��อหาท��ต�องศ�กษาก�อน การเขยนโปรแกรม Servlet เพ��ออ/านค/าพาราม0เตอร5
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม Java Servlet เพ��ออธ0บายขอบเขตการท.างานของออปเจ�คในโปรแกรมแบบเว�บ (Object Scope) ท�มอย#/ส�แบบค�อ Page, Request, Session และ Web (Application) โดยจะทดลองส/งค/าของออปเจ�คผ/านก�นระหว/างโปรแกรม Servlet สองช1ด
6.1 การพฒนาโปรแกรมเพ��อสาธ(ตขอบเขตของ Object แบบ Request
ออปเจ�คท�สร�างข,�นในโปรแกรม Java Servlet ในแต/โปรแกรมจะมขอบเขตการใช�งาน (scope) อย#/เพยงแค/โปรแกรมน��นๆ (url น��นๆ) ไม/สามารถท�จะใช�โปรแกรม Java Servlet หร�อ JSP ต�วอ��นเรยกใช�ออปเจ�คต�วน��นได� การจะให�โปรแกรม Servlet หร�อ JSP อ��นๆ เรยกออปเจ�คใดๆ ได�น��น จะต�องมการเขยน source code เพ��อส/งผ/านค/าของออปเจ�คน��นไปย�งออปเจ�คอ��นๆ ท��งน�เราสามารถก.าหนดขอบเขตการใช�งานเพ0�มเต0มได�อก 3 แบบค�อ
● Request ออปเจ�คสามารถถ#กเรยกใช�เม��อมการเรยกมาจากโปรแกรม Servlet/JSP อ��น● Session ออปเจ�คจะเก�บอย#/ใน Session ของ Web Browser ตราบเท/าท�ย�งมการใช�งานอย#/● Application ออปเจ�คจะสามารถใช�งานได�ในโปรแกรม Servlet/JSP ใดๆ ท�อย#/ใน Web
Application เดยวก�น
การส/งค/าของออปเจ�คจาก url หน,�งมาย�ง url อ��นท.าได�หลายว0ธ แบบฝ�กห�ดท�ผ/านมาเป�นการแสดงให�เห�นถ,งการส/งค/าพาราม0เตอร5ท�อย#/ในฟอร5มของไฟล5 HTML ไปย�งโปรแกรม Java Servlet ท�สามารถเรยกใช�ได�โดย ค.าส��ง request.getParameter()
นอกจากน�เราย�งสามารถท�จะส/งออปเจ�คไปย�ง โปรแกรม Java Servlet หร�อ JSP อ��นโดยการใช�ค.าส��ง setAttribute() อาท0เช/นส/งค/าของต�วแปร String ช��อว/า name โดยจะเก�บไว�ใน attribute ท�ช��อ RequestName
และมร#ปแบบค.าส��งด�งน�
String name = “Thanisa”; request.setAttribute(“RequestName”, name);
ซ,�งจะท.าให� url ท�ท.าการเรยกถ�ดไปสามารถเรยกใช� attribute ท�ช��อ RequestName และด,งค/าของต�วแปร name ออกมาได� โดยใช�ค.าส��ง getAttribute() โดยมร#ปแบบด�งน�
String name = (String) request.getAttribute(“RequestName”);
ส/วนค.าส��งท�ใช�ในการท�จะ forward จากโปรแกรม Servlet ต�วหน,�งไปย�ง url อ��นจะเป�นค.าส��งท�มร#ปแบบ
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
40
ด�งน�
RequestDispatcher obj = request.getRequestDispatcher("SecondServlet"); obj.forward(request,response);
โดยท� SecondServlet ค�อช��อ url ท�ต�องการ forward
ในข��นตอนน�จะเป�นการพ�ฒนาโปรแกรมเพ��อสาธ0ตการท.างานของขอบเขตการท.างานของ Object แบบ request โดยการพ�ฒนาโปรแกรม Servlet ข,�นมาสองโปรแกรมค�อ FirstServlet ท�จะใช�ในการส/งออปเจ�คซ,�งม source code ตาม Listing ท� 6.1 และ โปรแกรม SecondServlet ท�จะใช/ในการอ/านค/าของออปเจ�คท�ส/งออกมาแล�วน.ามาแสดงผล ซ,�งม source code ตาม Listing ท� 6.2 Listing ท� 6.1 โปรแกรม FirstServlet.java
package servlet;
import java.io.*;import java.net.*;
import javax.servlet.*;import javax.servlet.http.*;
public class FirstServlet extends HttpServlet { protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { String name = "Thanisa"; request.setAttribute("RequestName", name); RequestDispatcher obj = request.getRequestDispatcher("SecondServlet"); obj.forward(request, response); } finally { out.close(); } }
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response);
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
41
}
public String getServletInfo() { return "Short description"; } // </editor-fold>}
Listing ท� 6.2 โปรแกรม SecondServlet.java
package servlet;
import java.io.*;import java.net.*;
import javax.servlet.*;import javax.servlet.http.*;
public class SecondServlet extends HttpServlet {
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { String name = (String) request.getAttribute("RequestName"); out.println(name); } finally { out.close(); } }
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
public String getServletInfo() { return "Short description"; } // </editor-fold>}
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
42
6.1.1 ข��นตอนการพ�ฒนาโปรแกรมเพ��อสาธ0ตขอบเขตของ Object แบบ Request
เราสามารถท�จะพ�ฒนาโปรแกรม ตามข��นตอนด�งน�
1. เล�อกค.าส��งสร�าง New Project จากเมน# เล�อก Java Web แล�วเล�อก Web Application ก.าหนดช��อโปรเจ�คเป�น ScopeDemo เล�อก Server เป�น Apache Tomcat 6.0.18 และ Java EE Version เป�น Java
EE5 แล�วกด Finish
2. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด ScopeDemo จากน��นเล�อกค.าส��ง New > Servlet
3. ก.าหนด Class Name: เป�น FirstServlet.java และ Package เป�น servlet แล�วกด Finish
4. ในหน�าต/าง Editor เขยน Source code ของ FirstServlet.java ด�ง Listing ท� 6.1 แล�วเล�อกค.าส��ง Save
5. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด ScopeDemo จากน��นเล�อกค.าส��ง New > Servlet
6. ก.าหนด Class Name: เป�น SecondServlet.java และ Package เป�น servlet แล�วกด Finish
7. ในหน�าต/าง Editor เขยน Source code ของ SecondServlet.java ด�ง Listing ท� 6.2 แล�วเล�อกค.าส��ง Save
6.1.2 ข��นตอนการทดสอบโปรแกรมเพ��อสาธ0ตขอบเขตของ Object แบบ Request
เราสามารถท�จะทดสอบโปรแกรม ตามข��นตอนด�งน�
1. ท.าการ Build และ Deploy โปรเจ�ค ScopeDemo
2. ท.าการ Run โปรเจ�ค ScopeDemo
3. ในโปรแกรม Web Browser เล�อก url ท�ช��อ http://localhost:8080/ScopeDemo/FirstServlet
แล�วส�งเกต1ผลล�พธ54. ทดลองร�น url ท�ช��อ http://localhost:8080/ScopeDemo/SecondServlet โดยตรง แล�วส�งเกตผลล�พธ5
อกคร��งจะเห�นว/า ค/าท�แสดงเป�น null ท��งน�เน��องจากโปรแกรมไม/ได�มการส/ง request มาจาก FirstServlet
6.2 การพฒนาโปรแกรมเพ��อสาธ(ตขอบเขตของ Object แบบ Session
ขอบเขตการใช�งานของออปเจ�คแบบ Request จะส/งผ/านค/าของออปเจ�คตาม request ของ url ท��งน�ไม/สามารถท�จะใช�งานได�โดยการเรยก url น��นโดยไม/มการส/ง request มาด�งแสดงในข��นตอนท�ผ/านมา เราสามารถท�จะก.าหนดขอบเขตของการใช�งานของออปเจ�ค ให�ใช�งานผ/านใน session ของ Web Browser ได� (ตราบเท/าท� Browser ย�งใช� session น��นอย#/) โดยการก.าหนด Attribute ลงในออปเจ�คชน0ด HttpSession ซ,�งจะเป�นออปเจ�คท�เก�บข�อม#ล session ของ Web Browser อาท0เช/นเก�บค/าของต�วแปร String ช��อว/า name ไว�ใน attribute
ของ session ท�ช��อ SessionName โดยมร#ปแบบค.าส��งด�งน�
String name = “Thanisa”;
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
43
HttpSession session = request.getSession();session.setAttribute(“SessionName”, name);
โปรแกรม Java Servlet อ��นๆสามารถท�จะเรยกใช� attribute ของ Session ท�ช��อ SessionName และด,ง
ค/าของต�วแปร name ออกมาได� โดยใช�ค.าส��ง getAttribute() เพ��อเรยกค/าจาก Session โดยมร#ปแบบด�งน�
HttpSession session = request.getSession();String name = (String) session.getAttribute(“SessionName”);
ในข��นตอนน�จะเป�นการพ�ฒนาโปรแกรมเพ��อสาธ0ตการท.างานของขอบเขตการท.างานของ Object แบบ session โดยการพ�ฒนาโปรแกรม Servlet ข,�นมาสองโปรแกรมค�อ FirstSessionServlet ท�จะใช�ในการส/งออปเจ�คซ,�งม source code ตาม Listing ท� 6.3 และ โปรแกรม SecondSessionServlet ท�จะใช/ในการอ/านค/าของออปเจ�คท�ส/งออกมาแล�วน.ามาแสดงผล ซ,�งม source code ตาม Listing ท� 6.4
Listing ท� 6.3 โปรแกรม FirstSessionServlet.java
package servlet;
import java.io.*;import java.net.*;
import javax.servlet.*;import javax.servlet.http.*;
public class FirstSessionServlet extends HttpServlet {
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { String name = "Thanisa"; HttpSession session = request.getSession(); session.setAttribute("SessionName", name); } finally { out.close(); } }
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response);
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
44
}
public String getServletInfo() { return "Short description"; } // </editor-fold>}
Listing ท� 6.4 โปรแกรม SecondSessionServlet.java
package servlet;
import java.io.*;import java.net.*;
import javax.servlet.*;import javax.servlet.http.*;
public class SecondSessionServlet extends HttpServlet {
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { HttpSession session = request.getSession(); String name = (String) session.getAttribute("SessionName"); out.println(name); } finally { out.close(); } }
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
public String getServletInfo() { return "Short description"; } // </editor-fold>}
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
45
6.2.1 ข��นตอนการพ�ฒนาโปรแกรมเพ��อสาธ0ตขอบเขตของ Object แบบ Session
เราสามารถท�จะพ�ฒนาโปรแกรม ตามข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด ScopeDemo จากน��นเล�อกค.าส��ง New > Servlet
2. ก.าหนด Class Name: เป�น FirstSessionServlet.java และ Package เป�น servlet แล�วกด Finish
3. ในหน�าต/าง Editor เขยน Source code ของ FirstSessionServlet.java ด�ง Listing ท� 6.3 แล�วเล�อกค.าส��ง Save
4. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด ScopeDemo จากน��นเล�อกค.าส��ง New > Servlet
5. ก.าหนด Class Name: เป�น SecondSessionServlet.java และ Package เป�น servlet แล�วกด Finish
6. ในหน�าต/าง Editor เขยน Source code ของ SecondSessionServlet.java ด�ง Listing ท� 6.4 แล�วเล�อกค.าส��ง Save
6.2.2 ข��นตอนการทดสอบโปรแกรมเพ��อสาธ0ตขอบเขตของ Object แบบ Session
เราสามารถท�จะทดสอบโปรแกรม ตามข��นตอนด�งน�
1. ท.าการ Build และ Deploy โปรเจ�ค ScopeDemo
2. ท.าการ Run โปรเจ�ค ScopeDemo
3. ในโปรแกรม Web Browser เล�อก url ท�ช��อ http://localhost:8080/ScopeDemo/FirstSessionServlet
4. ทดลองร�น url ท�ช��อ http://localhost:8080/ScopeDemo/SecondSessionServlet แล�วส�งเกตผลล�พธ55. ทดลองป@ด Web Browser แล�วเป@ดข,�นมาใหม/แล�วทดลองร�น url ท�ช��อ
http://localhost:8080/ScopeDemo/SecondSessionServlet ใหม/แล�วส�งเกตผลล�พธ5
6.3 การพฒนาโปรแกรมเพ��อสาธ(ตขอบเขตของ Object แบบ Application
เราสามารถท�จะก.าหนดขอบเขตการใช�งานของออปเจ�คให�เป�นแบบ Application กล/าวค�อสามารถใช�ก�บโปรแกรม Java Servlet หร�อ JSP ท1กโปรแกรมท�อย#/ภายใน Web Application เดยวก�นตราบใดท� Web Server
ย�ง deploy โปรแกรม Web Application ด�งกล/าวอย#/ ถ,งแม�ว/า Web Browser ของฝABง client จะป@ดไปแล�วก�ตาม การก.าหนดขอบเขตแบบ Application สามารถท.าได�โดยใช�ค.าส��ง setAttribute() ก�บออปเจ�คชน0ด ServletContext ซ,�งเป�นออปเจ�คท�เก�บข�อม#ลของ Web Application ซ,�งในแต/ละ Web Application จะมออปเจ�คชน0ด ServletContext อย#/หน,�งต�ว และสามารถเรยกมาได�โดยใช�ค.าส��ง getServletContext()
ต�วอย/างค.าส��งในการเก�บออปเจ�คชน0ด String ท�ช��อ name ไว�ใน attribute ท�ช��อ AppName ของออปเจ�ค
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
46
ชน0ด ServletContext จะมร#ปแบบค.าส��งด�งน�
String name = "Thanisa"; ServletContext context = getServletContext(); context.setAttribute("AppName", name);
โปรแกรม Java Servlet อ��นๆสามารถท�จะเรยกใช� attribute ของออปเจ�คชน0ด ServletContext ท�ช��อ AppName และด,งค/าของต�วแปร name ออกมาได� โดยใช�ค.าส��ง getAttribute() เพ��อเรยกค/าจากออปเจ�คชน0ด ServletContext โดยมร#ปแบบด�งน�
ServletContext context = getServletContext(); String name = (String) context.getAttribute("AppName"); out.println(name);
ในข��นตอนน�จะเป�นการพ�ฒนาโปรแกรมเพ��อสาธ0ตการท.างานของขอบเขตการท.างานของ Object แบบ application โดยการพ�ฒนาโปรแกรม Servlet ข,�นมาสองโปรแกรมค�อ FirstAppServlet ท�จะใช�ในการส/งออปเจ�คซ,�งม source code ตาม Listing ท� 6.5 และ โปรแกรม SecondAppServlet ท�จะใช�ในการอ/านค/าของออปเจ�คท�ส/งออกมาแล�วน.ามาแสดงผล ซ,�งม source code ตาม Listing ท� 6.6
Listing ท� 6.5 โปรแกรม FirstAppServlet.java
package servlet;
import java.io.*;import java.net.*;
import javax.servlet.*;import javax.servlet.http.*;
package servlet;
import java.io.*;import java.net.*;
import javax.servlet.*;import javax.servlet.http.*;
public class FirstAppServlet extends HttpServlet {
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { String name = "Thanisa"; ServletContext context = getServletContext();
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
47
context.setAttribute("AppName", name); } finally { out.close(); } }
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
public String getServletInfo() { return "Short description"; } // </editor-fold>}
Listing ท� 6.6 โปรแกรม SecondAppServlet.java
package servlet;
import java.io.*;import java.net.*;
import javax.servlet.*;import javax.servlet.http.*;
public class SecondAppServlet extends HttpServlet {
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { ServletContext context = getServletContext(); String name = (String) context.getAttribute("AppName"); out.println(name); } finally { out.close(); } }
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
48
processRequest(request, response); }
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
public String getServletInfo() { return "Short description"; } // </editor-fold>}
6.3.1 ข��นตอนการพ�ฒนาโปรแกรม เพ��อสาธ0ตขอบเขตของ Object แบบ Application
เราสามารถท�จะพ�ฒนาโปรแกรม ตามข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด ScopeDemo จากน��นเล�อกค.าส��ง New > Servlet
2. ก.าหนด Class Name: เป�น FirstAppServlet.java และ Package เป�น servlet แล�วกด Finish
3. ในหน�าต/าง Editor เขยน Source code ของ FirstAppServlet.java ด�ง Listing ท� 6.5 แล�วเล�อกค.าส��ง Save
4. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด ScopeDemo จากน��นเล�อกค.าส��ง New > Servlet
5. ก.าหนด Class Name: เป�น SecondAppServlet.java และ Package เป�น servlet แล�วกด Finish
6. ในหน�าต/าง Editor เขยน Source code ของ SecondAppServlet.java ด�ง Listing ท� 6.6 แล�วเล�อกค.าส��ง Save
6.3.2 ข��นตอนการทดสอบโปรแกรม เพ��อสาธ0ตขอบเขตของ Object แบบ Application
เราสามารถท�จะทดสอบโปรแกรม ตามข��นตอนด�งน�
1. ท.าการ Build และ Deploy โปรเจ�ค ScopeDemo
2. ท.าการ Run โปรเจ�ค ScopeDemo
3. ในโปรแกรม Web Browser เล�อก url ท�ช��อ http://localhost:8080/ScopeDemo/FirstAppServlet
4. ทดลองร�น url ท�ช��อ http://localhost:8080/ScopeDemo/SecondAppServlet แล�วส�งเกตผลล�พธ55. ทดลองป@ด Web Browser แล�วเป@ดข,�นมาใหม/แล�วทดลองร�น url ท�ช��อ
http://localhost:8080/ScopeDemo/SecondAppServlet ใหม/แล�วส�งเกตผลล�พธ5
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
49
Exercise 7 การพ�ฒนาโปรแกรม Servlet โดยใช�คลาสประเภท Web Listener
เน��อหาท��ต�องศ�กษาก�อน การพ�ฒนาโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล
แบบฝ�กห�ดน�จะเป�นการปร�บปร1งโปรเจ�ค Web Application ท�ช��อ WebBaseDB ท�ใช�ในการเช��อมโยงฐานข�อม#ลและใส/ข�อม#ลลง Table โดยเพ0�มคลาสประเภท Web Listener เพ��อท.าการเช��อมต/อก�บฐานข�อม#ลแทนว0ธการเด0มท�เช��อมต/อในเมธอด init()
ข��นตอนในการพ�ฒนาโปรแกรม
1. พ�ฒนาโปรแกรม Init.java
2. แก�ไขโปรแกรม AddBookServlet.java
7.1 การพฒนาโปรแกรม Init.java
โปรแกรม AddBookServlet ก.าหนดค.าส��งในการเช��อมต/อก�บข�อม#ลท�อย#/ในเมธอด init() ซ,�งเป�นว0ธการท�ไม/เหมาะสมมากน�ก เน��องจากโปรแกรม Servlet ท1กโปรแกรมท�จะเช��อมต/อก�บฐานข�อม#ลต�องเขยนโปรแกรมในส/วนของเมธอด init() ท�ซ�.าก�น แบบฝ�กห�ดน�จะปร�บปร1งโปรแกรมในส/วนน�โดยการใช� ContextListener
โปรแกรม Servlet จะม Listener อย#/สองชน0ดค�อ ContextListener และ SessionListener โดยท� ContextListener จะถ#กเรยกเม��อ Web Application เร0�มต�นการท.างานหร�อส0�นส1ดการท.างาน เราสามารถท�จะเขยนโปรแกรมประเภท Servlet Listener ได�โดยมข��นตอนด�งน�
1. พ�ฒนาคลาสท� implements Listener ท�ต�องการอาท0เช/น ServletContextListener
2. เขยนเมธอดท�ต�อง implements ใน Listener น��นๆ3. config ไฟล5 web.xml เพ��อเพ0�มคลาสประเภท Listener
โปรแกรม Init.java จะเป�นโปรแกรมท�เป�น ServletContextListener เพ��อเช��อมต/อก�บฐานข�อม#ลเม��อเร0�มต�น แล�วเก�บออปเจ�ค Connection ไว�ภายใน ServletContext โปรแกรมจะเขยนค.าส��งเหล/าน�ภายในเมธอด contextInitialized() ซ,�งจะถ#กเรยกเม��อ Web Application เร0�มต�นการท.างาน
ข��นตอนการพ�ฒนาโปรแกรม Init.java เป�นด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด WebBaseDB จากน��นเล�อกค.าส��ง New > Other...
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
50
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก Web Application Listener แล�วกด Next
3. ก.าหนด Class Name เป�น Init และ Package เป�น listener แล�วกด Finish ด�งร#ปท� 7.1
ร�ปท�� 7.1 การสร�างคลาสประเภท Web Listener
4. ในหน�า Editor ให�คล0;กขวาเล�อก Insert Code... > Use Database
5. ในไดอะล�อก Choose Database กดป'<ม Add...
6. ในไดอะล�อก Add Data Source Reference ให�ก.าหนด Reference Name: เป�น jdbc/test ด�งร#ปท� 7.2
ร�ปท�� 7.2 การก�าหนด Reference Name
7. โปรแกมจะปรากฏ sourcecode ด�งน�ในไฟล5 Init.java
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
51
private DataSource getJdbcTest() throws NamingException { Context c = new InitialContext();
return (DataSource) c.lookup("java:comp/env/jdbc/test"); }
8. ให�ท.าการเพ0�ม sourcecode ด�งต/อไปน�ในเมธอด contextInitialized
conn = getJdbcTest().getConnection(); arg0.getServletContext().setAttribute("connection", conn);
9. จากน��นให�ท.าการ Fix Imports และ จะท.าให� sourcecode ของไฟล5 Init.java ด�งน�
private Connection conn;public void contextInitialized(ServletContextEvent arg0) {
try {conn = getJdbcTest().getConnection();
arg0.getServletContext().setAttribute("connection", conn); } catch (SQLException ex) { Logger.getLogger(Init.class.getName()).log(Level.SEVERE, null, ex); } catch (NamingException ex) { Logger.getLogger(Init.class.getName()).log(Level.SEVERE, null, ex); } }
10. จากน��นควรเพ0�มเต0มค.าส��งต/อไปน�ในเมธอด contextDestroyed
public void contextDestroyed(ServletContextEvent arg0) {try {
conn.close(); } catch (SQLException ex) {
Logger.getLogger(Init.class.getName()).log(Level.SEVERE, null, ex);}
}
เราจะได� sourcecode ของไฟล5 Init.java ด�ง Listing ท� 7.1
Listing ท� 7.1 โปรแกรม Init.java
public class Init implements ServletContextListener {
private Connection conn;
public void contextInitialized(ServletContextEvent arg0) { try { conn = getJdbcTest().getConnection(); arg0.getServletContext().setAttribute("connection", conn); } catch (SQLException ex) { Logger.getLogger(Init.class.getName()).log(Level.SEVERE, null, ex); } catch (NamingException ex) { Logger.getLogger(Init.class.getName()).log(Level.SEVERE, null, ex);
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
52
} }
public void contextDestroyed(ServletContextEvent sce) { try { conn.close(); } catch (SQLException ex) { Logger.getLogger(Init.class.getName()).log(Level.SEVERE, null, ex); } }
private DataSource getJdbcTest() throws NamingException { Context c = new InitialContext(); return (DataSource) c.lookup("java:comp/env/jdbc/test"); }}
7.2 การปรบปร�งโปรแกรม AddBookServlet.java
โปรแกรม Init.java จะม.าหน�าท�ในการเช��อมต/อก�บฐานข�อม#ล ด�งน��นเราจ,งต�องแก�ไขค.าส��งการเช��อมโยงฐานข�อม#ลท�อย#/ในไฟล5 AddBookServlet.java โดยมข��นตอนด�งน�
1. ให�ลบค.าส��ง@Resource(name = "jdbc/test")private DataSource jdbcTest;
2. แก�ไขเมธอด init() ให�เป�นด�งน�
public void init() { conn = (Connection) getServletContext().getAttribute("connection");
}
เราจะได�โปรแกรม AddBookServlet.java ใหม/ด�ง Listing ท� 7.2
Lisitng ท� 7.2 โปรแกรม AddBookServlet.java
....
public class AddBookServlet extends HttpServlet {
private Connection conn;
public void init() { conn = (Connection) getServletContext().getAttribute("connection"); }
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter();
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
53
out.println("<html>"); out.println("<head>"); out.println("<title>Add a new book</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1> Add a new book </h1>");
try { String isbn = request.getParameter("isbn"); String author = request.getParameter("author"); String title = request.getParameter("title"); String priceStr = request.getParameter("price"); float price = Float.parseFloat(priceStr);
Statement stmt = conn.createStatement();
String sql = "INSERT INTO books VALUES('" + isbn + "','" + title + "','" + author + "'," + price + ")"; int numRow = stmt.executeUpdate(sql);
RequestDispatcher obj = request.getRequestDispatcher("Thankyou.html"); if (numRow == 1 && obj != null) { obj.forward(request, response); }
} catch (SQLException ex) { out.println("Error " + ex); return; }
out.println("</body>"); out.println("</html>");
out.close(); }
....}
7.3 ทดสอบโปรแกรม
1. ท.าการ Build และ Deploy โปรแกรม WebBaseDB
2. Run โปรแกรม WebBaseDB ท��งน�ต�องท.าการร�น MySQL Database Server ก/อน 6. โปรแกรมจะแสดงหน�า addBook.html ให�เราใส/ข�อม#ล :ซ�งเม��อใส/ข�อม#ลจะได�ผลล�พ5เช/นเดยวก�บแบบ
ฝ�กห�ดก/อน
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
54
Exercise 8 การพ�ฒนาโปรแกรม Servlet Filter
เน��อหาท��ต�องศ�กษาก�อน การเขยนโปรแกรม Servlet เพ��ออ/านค/าพาราม0เตอร5
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม Web Application เพ��ออธ0บายการใช� Servlet Filter ในการตรวจสอบการ login เข�าส#/ระบบ โดยโปรแกรม Java Servlet บางโปรแกรมท�อย#/ใน Web Application จะถ#ก Filter เรยกเพ��อต�วสอบสถานะการ login ก/อนท�จะสามารถใช�โปรแกรมน��นได�
8.1 การพฒนาโปรแกรม Servlet Filter
โปรแกรม Servlet Filter เป�นโปรแกรม Java ท�ก.าหนดข,�นมาใน Web Application ซ,�งจะด�กการท.างานของโปรแกรม Java Servlet ใดๆ แล�วสามารถท�จะแก�ไขค/าของออปเจ�คชน0ด request และ response ก/อนท�โปรแกรม Java Servlet น��นจะถ#กเรยกใช�ต/อไป ต�วอย/างของการพ�ฒนาโปรแกรม Servlet Filter ค�อ
● การควบค1มการใช�งาน Servlet หร�อการท.า Authentication
● การบล�อกการใช�งาน Servlet หร�อตรวจสอบการใช�งาน Servlet
● การเปล�ยนแปลงข�อม#ลของออปเจ�ค request
โปรแกรม Servlet Filter จะเป�น โปรแกรม Java ท� implements อ0นเตอร5เฟสท�ช��อ Filter และมเมธอดหล�กค�อ init(), destroy() และ doFilter()
เราสามารถท�จะก.าหนดให� url ใดๆ ในโปรแกรม Web Application ถ#ก Filter จากโปรแกรม Servlet
Filter ใดๆ โดยการก.าหนดค/าใน web.xml อาท0เช/นค.าส��ง
<filter> <filter-name>LoginFilter</filter-name> <filter-class>LoginFilter</filter-class> </filter> <filter-mapping> <filter-name>LoginFilter</filter-name> <url-pattern>/*</url-pattern> </filter-mapping>
เป�นการก.าหนดให�โปรแกรม url ท1กต�วท�อย#/ใน Web Application น� ต�องถ#กด�กโดย Servlet Filter ท�ช��อ LoginFilter
แบบฝ�กห�ดน�จะก.าหนดให�ม web form ท�ช��อ login.html ซ,�งจะท.าการเรยกโปรแกรม LoginServlet ซ,�งจะตรวจสอบค/า username และ password ท�ป%อนเข�ามา หากถ#กต�องก�จะก.าหนดให�ค/าของออปเจ�คท�ช��อ loginFlag เป�น true แล�วก.าหนดให�ขอบเขตของออปเจ�ค loginFlag เป�นแบบ Session โดยการ setAttribute
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
55
ให�ก�บออปเจ�คชน0ด HttpSession
โปรแกรม Web Application น�ย�งม Servlet Filter ท�ช��อ LoginFilter ซ,�งจะท.าหน�าท�อ/านค/าของออปเจ�ค LoginFlag ท�อย#/ในออปเจ�คชน0ด HttpSession ถ�าหากไม/พบหร�อมค/าเป�น false โปรแกรมจะระบ1 HTTP Error 401 (This request requires HTTP authentication . )
ส1ดท�ายจะมการเขยนโปรแกรม Java Servlet ท�ช��อ ShowServlet เพ��อแสดงข�อความว/า HelloWorld
เพ��อแสดงให�เห�นว/าโปรแกรมจะถ#กด�กโดย LoginFilter
8.2 การเข%ยนหน�า Login
หน�า Login จะมโปรแกรมสองโปรแกรมค�อ login.html ซ,�งจะเป�น web page ท�มล�กษณะด�งร#ป และม source code ตาม Listing ท� 8.1 นอกจากจะมโปรแกรม LoginServlet ซ,�งจะท.าหน�าท�ในการอ/านพาราม0เตอร5ท�ช��อ username และ password พร�อมท��งตรวจสอบว/ามค/าเป�น thana และ secret หร�อไม/ หากใช/ก�จะก.าหนดค/า ต�วแปร loginFlag เป�น true แล�วเก�บลงในออปเจ�คชน0ด HttpSession โปรแกรมน�จะม source code ด�ง Listing
ท� 8.2
ร�ปท�� 8.1 เว�บหน�า Login
Listing ท� 8.1 โปรแกรม login.html
<html> <head> <title>Login Page</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> </head> <body> <form action="LoginServlet" method="POST"> UserName: <input name="username" /> <br> Password: <input type="password" name="password" /> <br> <input type="submit" value="Login" /> </form> </body></html>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
56
Listing ท� 8.2 โปรแกรม LoginServlet.java
package controller;
import java.io.*;import java.net.*;
import javax.servlet.*;import javax.servlet.http.*;
public class LoginServlet extends HttpServlet { protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { boolean loginFlag = false; String username = request.getParameter("username"); String password = request.getParameter("password"); if (username.equals("thana") && password.equals("secret")) { loginFlag = true; } HttpSession session = request.getSession(); session.setAttribute("loginFlag", loginFlag);
response.sendRedirect("show.do"); } finally { out.close(); } }
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); }
public String getServletInfo() { return "Short description"; }}
8.2.1 ข��นตอนการพ�ฒนาโปรแกรม
เราสามารถท�จะพ�ฒนาโปรแกรมน�ตามข��นตอนด�งน�
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
57
1. เล�อกค.าส��งสร�าง New Project จากเมน# เล�อก Java Web แล�วเล�อก Web Application ก.าหนดช��อ โปรเจ�คเป�น FilterDemo เล�อก Server เป�น Apache Tomcat 6.0.18 และ Java EE Version เป�น Java
EE5 แล�วกด Finish
2. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด FilterDemo จากน��นเล�อกค.าส��ง New > HTML..
3. ก.าหนด HTML File Name: เป�น login แล�วกด Finish
4. ในหน�าต/าง Editor เขยน Source code ของ login.html ด�ง Listing ท� 8.1 แล�วเล�อกค.าส��ง Save
5. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด FilterDemo จากน��นเล�อกค.าส��ง New > Servlet...
6. ก.าหนด Class Name: เป�น LoginServlet.java และ Package เป�น controller แล�วกด Finish
7. ในหน�าต/าง Editor เขยน Source code ของ LoginServlet.java ด�ง Listing ท� 8.2 แล�วเล�อกค.าส��ง Save
8.3 การเข%ยน Servlet Filter
โปรแกรม LoginFilter จะท.าหน�าท�ในการเรยก attribute ท�ช��อ loginFlag และหากไม/พบหร�อมค/าเป�น false โปรแกรมจะระบ1 HTTP Error 401 โปรแกรม LoginFilter จะม source code หล�กอย#/ท� เมธอด doFilter() ด�ง Listing ท� 8.3
นอกจากน�กรณน�จะก.าหนดให� url เฉพาะช��อ *.do เท/าน��นท�จะเรยกใช� Filter ท�ช��อ LoginFilter ซ,�งจะต�องมการแก�ไข web.xml ด�งน�
<filter> <filter-name>LoginFilter</filter-name> <filter-class>filter.LoginFilter</filter-class> </filter> <filter-mapping> <filter-name>LoginFilter</filter-name> <url-pattern>*.do</url-pattern> </filter-mapping>
Listing ท� 8.3 เมธอด doFilter() ของ โปรแกรม LoginFilter.java
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
if (debug) { log("LoginFilter:doFilter()"); }
doBeforeProcessing(request, response);
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
58
HttpServletRequest req = (HttpServletRequest) request; HttpSession session = req.getSession(); Boolean flag = (Boolean) session.getAttribute("loginFlag"); boolean loginFlag; if (flag == null) { loginFlag = false; } else { loginFlag = flag; } if (!loginFlag) { HttpServletResponse res = (HttpServletResponse) response; res.sendError(HttpServletResponse.SC_UNAUTHORIZED); return; }
Throwable problem = null;
try { chain.doFilter(request, response); } catch (Throwable t) {
problem = t; t.printStackTrace(); }
doAfterProcessing(request, response);
if (problem != null) { if (problem instanceof ServletException) { throw (ServletException) problem; } if (problem instanceof IOException) { throw (IOException) problem; } sendProcessingError(problem, response); } }
8.3.1 ข��นตอนการพ�ฒนาโปรแกรม
เราสามารถท�จะพ�ฒนาโปรแกรม ตามข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด FilterDemo จากน��นเล�อกค.าส��ง New > Other..
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก Filter แล�วกด Next
3. ก.าหนด Class Name: เป�น LoginFilter และ Package เป�น filter แล�วกด Next
4. ในหน�าถ�ดไป ให�ใช�ค/าท�ก.าหนดไว� ด�งร#ปท� 8.2 แล�วกด Finish
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
59
ร�ปท�� 8.2 การก�าหนดค-าของ Filter
5. โปรแกรมจะท.าการแก�ไขไฟล5 web.xml เพ��อระบ1 Filter ใหม/ท�สร�างข,�น ซ,�งเราสามารถท�จะด#การแก�ไขน�ได�โดยการขยายโหนด FilterDemo > Web Pages >WEB-INF แล�วเล�อกไฟล5 web.xml จะเห�นหน�าต/างด�งร#ปท� 8.3
ร�ปท�� 8.3 หน�าต-างไฟล! web.xml
6. ในส/วนของ Filter Mappings ให�เล�อก LoginFilter แล�วกด Edit เพ��อแก�ไข Applies To เป�น *.do ด�งร#ปท� 8.4
ร�ปท�� 8.4 การก�าหนดค-า Filter Mapping
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
60
7. ในหน�าต/าง Editor เขยน Source code ของเมธอด doFilter() ของไฟล5 LoginFilter.java ด�ง Listing
ท� 8.3 แล�วเล�อกค.าส��ง Save
8.4 การเข%ยนโปรแกรม ShowServlet
โปรแกรม ShowServlet จะท.าหน�าท�เพ��อแสดงข�อความว/า Hello World และม source code ของเมธอด processRequest() ด�ง Listing ท� 8.4
Listing ท� 8.4 เมธอด processRequest() ของโปรแกรม ShowServlet.java
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { out.println("<html>"); out.println("<head>"); out.println("<title>Servlet ShowServlet</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1> Hello World </h1>"); out.println("</body>"); out.println("</html>"); } finally { out.close(); } }
8.4.1 ข��นตอนการพ�ฒนาโปรแกรม
เราสามารถท�จะพ�ฒนาโปรแกรม ตามข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด FilterDemo จากน��นเล�อกค.าส��ง New > Servlet..
2. ก.าหนด Class Name: เป�น ShowServlet.java และ Package เป�น view แล�วกด Next
3. ก.าหนด URL Pattern(s) เป�น /show.do ด�งร#ปท� 8.5 แล�วกด Finish
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
61
ร�ปท�� 8.5 การก�าหนดค-า URL pattern
4. ในหน�าต/าง Editor เขยน Source code ของ ShowServlet.java ด�ง Listing ท� 8.4 แล�วเล�อกค.าส��ง Save
8.5 ข�นตอนการทดสอบโปรแกรม
เราสามารถท�จะทดสอบโปรแกรม ตามข��นตอนด�งน�
1. ท.าการ Build และ Deploy โปรเจ�ค FilterDemo
2. ท.าการ Run โปรเจ�ค FilterDemo
3. ทดลองร�น url ท�ช��อ http://localhost:8080/FilterDemo/show.do แล�วส�งเกตผลล�พธ5จะเห�นว/าแสดงข�อผ0ดพลาด HTTP 401
4. ทดลองร�น url ท�ช��อ http://localhost:8080/FilterDemo/login.html แล�วป%อน username เป�น thana
และ password เป�น secret
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
62
Exercise 9 การเข�ยนโปรแกรม JSP เพ��อแสดงผลล�พธ�
เน��อหาท��ต�องศ�กษาก�อน การพ�ฒนาโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม JSP เพ��อแสดงข�อม#ลจากฐานข�อม#ล ออกทางโปรแกรม Web
Browser โดยจะเป�นการพ�ฒนาโปรเจ�ค WebbaseDB เพ��อเต0ม
9.1 การพฒนาโปรแกรม hello.jsp
โปรแกรม hello.jsp เป�นโปรแกรม JSP เพ��อแสดงข�อความและว�นเวลาของ Web Server โปรแกรมน�จะเป�นการแสดงผลแบบ dynamic content จ,งต�องพ�ฒนาโดยใช�ภาษา JSP โดยมข��นตอนการพ�ฒนาโปรแกรมด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด WebBaseDB จากน��นเล�อกค.าส��ง New > Other..
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆภายใต� Category น� ให�เราเล�อก JSP แล�วกด Next
3. ก.าหนด JSP File Name: เป�น hello แล�วกด Finish
4. ในหน�าต/าง editor ให�แก�ไข sourcecode ของไฟล5 hello.jsp ให�เป�นไปตาม Listing ท� 9.1
5. ท.าการ Build และ Deploy โปรแกรม Web EBaseDB
6. ในหน�าต/าง Projects เล�อกไฟล5 hello.jsp แล�วเล�อก Run โปรแกรม 7. โปรแกรมจะแสดงผลด�งร#ปท� 1
Listing ท� 9.1 โปรแกรม hello.jsp
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Hello JSP</title> </head> <body>
<h1>My First JSP</h1> Hello : Current time is : <%= new java.util.Date() %> </body></html>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
63
ร�ปท�� 9.1 ผลล�พธ!ของ hello.jsp
9.2 การพฒนาโปรแกรม viewBook.jsp
โปรแกรม viewBook.jsp เป�นโปรแกรม JSP เพ��อแสดงข�อม#ลของ Table ท�ช��อ books โปรแกรมน�จะเรยกใช� standard tags ท�ก.าหนดไว�ใน JSTL 1.1 ซ,�งท.าให�ผ#�เขยนโปรแกรม JSP ไม/ต�องเขยน source code ภาษา Java โดยมค.าส��งต/างๆ ท�ส.าค�ญด�งน�
9.2.1 การก.าหนด Tag Library
โปรแกรม viewBook.jsp จะเรยกใช� JSTL 1.0 เราจ,งจ.าเป�นต�องมค.าส��ง Taglib เพ��อท�จะประกาศ Library ด�งน�
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql"%>
9.2.2 การก.าหนด Datasource
โปรแกรม JSP น�จะท.าการเช��อมต/อก�บฐานข�อม#ล โดยจะต�องใช� datasource ของโปรเจ�ค โดยสามารถก.าหนดได�สองว0ธ
● กรณท�ม datasource ซ,�งเช��อมต/อฐานข�อม#ลท�ต�องการอย#/แล�ว ก�สามารถใช�อ�นเด0มได�เลย ต�วอย/างเช/น jdbc/test โดยไม/จ.าเป�นต�องสร�าง dataSource ข,�นใหม/อก
● กรณท�ย�งไม/ม datasource ให�ใช�ค.าส��ง setDataSource เป�น Tag เพ��อให�เราสามารถก.าหนดการเช��อมต/อก�บฐานข�อม#ล และก.าหนดค/าไว�ในต�วแปรตามช��อท�ก.าหนด
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
64
ถ,งแม�ว/าโปรเจ�ค WebBaseDB จะม datasource อย#/แล�ว แต/แบบฝ�กห�ดน�จะก.าหนด datasource ข,�นมาใหม/อกหน,�งช1ด ก.าหนดเป�นต�วแปรท�ช��อ newdatasource โดยจะก.าหนดค.าส��งเป�น
<sql:setDataSource var="newdatasource" driver="com.mysql.jdbc.Driver" url="jdbc:mysql:///test" user="root" password="root" />
เพ��อเป�นการเช��อมต/อฐานข�อม#ลท�อย#/ท� url ท�ช��อ jdbc:mysql:///test
9.2.3 การใช�ค.าส��ง sql:query
ค.าส��ง sql:query เป�นค.าส��งท�จะเรยกด#ข�อม#ลของฐานข�อม#ลท�เช��อมต/อใน datasource ท�เป�น jdbc/test
หร�อต�วแปร newdatasource ในโปรแกรม viewBook.jsp เราจะท.าการเรยกใช�ค.าส��ง SQL ค�อ select *
from books โดยใช�ค.าส��ง sql:query ด�งน�
<sql:query var="db" dataSource=" /jdbc/test"> SELECT * FROM books </sql:query>
หร�อ
<sql:query var="db" dataSource="${newdatasource}"> SELECT * FROM books </sql:query>
9.2.4 การใช�ค.าส��ง c:forEach เพ��อแสดงผล
การแสดงค/าของผลล�พธ5ท�ได�จากการ Query ฐานข�อม#ล สามารถท.าได� การแจงข�อม#ลทละแถวโดยใช�ค.าส��ง c:forEach โดยโปรแกรมน�จะแสดงข�อม#ลช��อหน�งส�อ และช��อผ#�แต/ง โดยมค.าส��งด�งน�
<c:forEach var="row" items="${db.rows}"> ${row.title} : ${row.author} <br> </c:forEach>
ส.าหร�บข��นตอนการพ�ฒนาโปรแกรมน� มด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด WebBaseDB จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก JSP แล�วกด Next
3. ก.าหนด JSP File Name: เป�น viewBook แล�วกด Finish
4. ขยายโหนด WebBaseDB คล0;กขวาท�โหนด Libraries เล�อกค.าส��ง Add Libraries..
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
65
5. ในไดอะล�อก Add Library เล�อก JSTL1.1 แล�วกดป16ม Add Library ด�งร#ปท� 9.2
ร�ปท�� 9.2 การเพ��ม Library ในโปรเจ�ค
6. ในหน�าต/าง editor ให�แก�ไข sourcecode ของไฟล5 viewBook.jsp ให�เป�นไปตาม Listing ท� 9.2
7. ท.าการ Build และ Deploy โปรแกรม WebBaseDB
8. ในหน�าต/าง Projects เล�อกไฟล5 viewBook.jsp แล�วเล�อก Run โปรแกรม 9. ท� Web Browser เปล�ยน URL เป�น http://localhost:8080/WebBaseDB/viewBook.jsp จะได�
ผลล�พธ5ด�งต�วอย/างในร#ปท� 9.3
ร�ปท�� 9.3 ผลล�พธ!ของ viewBook.jsp
Listing ท� 9.2 โปรแกรม viewBook.jsp
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
66
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql"%>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Page</title> </head> <body>
<h1>JSP Page</h1> <sql:setDataSource var="newdatasource" driver="com.mysql.jdbc.Driver" url="jdbc:mysql:///test" user="root" password="root" />
<sql:query var="db" dataSource="${newdatasource}"> SELECT * FROM books </sql:query> <c:forEach var="row" items="${db.rows}"> ${row.title} : ${row.author} <br> </c:forEach> </body></html>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
67
Exercise 10 การพ�ฒนาโปรแกรมเว�บ Online Book Store
เน��อหาท��ต�องศ�กษาก�อน การพ�ฒนาโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล และ การพ�ฒนาโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม JSP เพ��อสร�าง Web Form ให�ผ#�ใช�เล�อกรายการหน�งส�อต/างๆ ท�มอย#/ใน table ท�ช��อ books จากน��นจะแสดงรายการท�ผ#�ใช�เล�อกออกมาทางเว�บเพจ
10.1 การพฒนาโปรแกรม selectBooks.jsp
โปรแกรม selectBooks.jsp เป�นโปรแกรม JSP ท�เขยนเพ��อแสดงรายการหน�งส�อท�มอย#/ใน table ท�ช��อ books ออกมาแสดงในร#ปแบบของ Web Form เพ��อให�ผ#�ใช�เล�อกรายการหน�งส�อและจ.านวนด�งร#ปท� 10.1 ท��งน� Web Form น�จะเรยก url ท�ช��อ processSelection เม��อมการกดป16ม Select โปรแกรมน�จะเรยกใช� SQL tags ของ JSTL เพ��อแสดงรายการข�อม#ลรายช��อหน�งส�อ โดยม source code ด�งแสดงใน Listing ท� 10.1 และมข��นตอนการพ�ฒนาโปรแกรมด�งน�
1) เล�อกเมน# File > New Project..
2) ในไดอะล�อก New Project ให�เล�อก Categories เป�น Java Web และเล�อก Projects เป�น Web
Application แล�วกด Next
3) ก.าหนด Project Name: เป�น BookOnline แล�วเล�อก Project Location: เป�น Director ท�เราต�องการจะเก�บไฟล5ไว� จากน��นเล�อก Server เป�น Apache Tomcat 6.0.18 แล�วกด Finish
4) เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด BookOnline จากน��นเล�อกค.าส��ง New > Other...
5) ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก JSP แล�วกด Next
6) ก.าหนด JSP File Name: เป�น selectBooks แล�วกด Finish
7) ในหน�าต/าง editor ให�แก�ไข source code ของไฟล5 selectBooks.jsp ให�เป�นไปตาม Listing ท� 10.1
8) กดป16ม Save
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
68
ร�ปท�� 10.1 ต�วอย-างผลล�พธ!ของโปรแกรม selectBooks.jsp
Listing ท� 10.1 โปรแกรม selectBooks.jsp
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%><%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql"%>
<!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>JSP Page</title> </head> <body> <sql:setDataSource var="ds" driver="com.mysql.jdbc.Driver" url="jdbc:mysql:///test" user="root" password="root" /> <sql:query var="rs" dataSource="${ds}"> select * from books </sql:query> <h1>Select Books</h1> <form action="ProcessSelection" method="POST"> <table border="1"> <thead> <tr> <th></th> <th> Title </th>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
69
<th> Author </th> <th> Price</th> </tr> </thead> <tbody> <c:forEach var="book" items="${rs.rows}"> <tr> <td><input type="checkbox" name="isbn" value="${book.isbn}" /> </td> <td>${book.title}</td> <td>${book.author}</td> <td>${book.price}</td> </tr> </c:forEach> </tbody> </table> <input type="submit" value="Select" /> </form> </body></html>
10.2 การพฒนาโปรแกรม 1 Book.java
โปรแกรม Book.java เป�นคลาสท�ม attribute ท�สอดคล�องก�บ table ท�ช��อ books โดยม source code ด�ง Listing ท� 10.2 และมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด BookOnline จากน��นเล�อกค.าส��ง New > Java Class..
2. ก.าหนด Class Name: เป�น Book.java และ Package เป�น model แล�วกด Next
3. เขยน Source code ของไฟล5ด�งน� เพ0�ม attribute ภายในคลาส BookActionForm ด�งน�String isbn;String title;String author;double price;
4. ท.าการ encapsulate attribute (ก.าหนด attribute ให�เป�น private และ สร�างเมธอด getter และ setter)
โดยการคล0;กขวาภายในหน�าต/าง editor ของ source code แล�วเล�อก Refactor > Encapsulate Field..
5. กดป16ม Refactor แล�วกดป16ม Save
Listing ท� 10.2 โปรแกรม Book.java
package model;
public class Book { private String isbn; private String author; private String title; private double price;
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
70
public String getIsbn() { return isbn; }
public void setIsbn(String isbn) { this.isbn = isbn; }
public String getAuthor() { return author; }
public void setAuthor(String author) { this.author = author; }
public String getTitle() { return title; }
public void setTitle(String title) { this.title = title; }
public double getPrice() { return price; }
public void setPrice(double price) { this.price = price; } }
10.3 การพฒนาโปรแกรม 1 Cart.java
โปรแกรม Cart.java เป�นคลาสท�ท.าหน�าท�คล�ายก�บ shopping cart เพ��อเก�บออปเจ�คชน0ด Book ตามรายการหน�งส�อท�ผ#�ใช�เล�อก โดยอ�างอ0งจากหมายเลข isbn ซ,�งโปรแกรมจะท.าการค�นรายช��อหน�งส�อจาก table ท�ช��อ books หมายเลข isbn ท�อ�างอ0ง แล�วจะแปลงเป�นออปเจ�คชน0ด books ก/อนจะใส/ลงใน cart โปรแกรมน�จะม source code ด�ง Listing ท� 10.3 และมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด BookOnline จากน��นเล�อกค.าส��ง New > Java Class..
2. ก.าหนด Class Name: เป�น Cart.java และ Package เป�น model แล�วกด Next
3. ในหน�าต/าง editor ให�แก�ไข source code ของไฟล5 Cart.java ให�เป�นไปตาม Listing ท� 10.3
4. กดป16ม Save
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
71
Listing ท� 10.3 โปรแกรม Cart.java
package model;
import java.sql.Connection;import java.sql.ResultSet;import java.sql.SQLException;import java.sql.Statement;import java.util.LinkedList;import java.util.List;
public class Cart { List <Book> books; Connection conn;
public void addItem(String isbn) { try { Statement stmt = conn.createStatement(); String sql = "SELECT * from books where isbn='" + isbn + "'"; ResultSet rs = stmt.executeQuery(sql); while (rs.next()) { Book bk = new Book(); bk.setIsbn(isbn); bk.setAuthor(rs.getString("author")); bk.setTitle(rs.getString("title")); bk.setPrice(rs.getFloat("price")); books.add(bk); } }catch (SQLException ex) {
ex.printStackTrace(); } }
public List<Book> getBooks() { return books; } public Cart(Connection conn) { this.conn = conn; books = new LinkedList<Book>(); } public void removeItem(String isbn) { books.remove(isbn); } }
10.4 การพฒนาโปรแกรม ProcessSelection.java
โปรแกรม ProcessSelection.java เป�นโปรแกรม Java Servlet ท�ท.าหน�าท�อ/านค/าพาราม0เตอร5ท�ช��อ isbn
ซ,�งส/งมาจากหน�า Web Form ของโปรแกรม selectBooks.java โดยใช�ค.าส��ง getParameterValues ด�งน�
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
72
String[] isbn = request.getParameterValues("isbn");
จากน��นจะท.าการเรยก session เพ��อเรยก attribute ท�ช��อ cart ออกมาโดยใช�ค.าส��งด�งน�
HttpSession session = request.getSession(true); Cart cart = (Cart) session.getAttribute("cart");
กรณท�ไม/พบ attribute ท�ช��อ cart โปรแกรมจะท.าการเก�บ attribute น�ข,�นใหม/โดยใช�ค.าส��งด�งน�
if (cart == null) { ServletContext ctx = getServletContext(); Connection conn = (Connection) ctx.getAttribute("connection"); cart = new Cart(conn); session.setAttribute("cart", cart); }
เม��อได�ค/า attribute ท�ช��อ cart มาแล�ว โปรแกรมก�จะเก�บรายการช��อ isbn ของหน�งส�อท�ผ#�ใช�เล�อกลงในออปเจ�คของ cart โดยใช�ค.าส��งด�งน�
for (int i = 0; i < isbn.length; i++) { cart.addItem(isbn[i]); }
เม��อส0�นส1ดการท.างานโปรแกรมก�จะไปเรยก url ท�ช��อ view.cart ต/อไป โดยใช�ค.าส��งด�งน�
RequestDispatcher pg = request.getRequestDispatcher("viewCart.jsp"); pg.forward(request, response)
ส.าหร�บโปรแกรมน�จะม source code ของเมธอด processRequest ด�ง Listing ท� 10.4 และจะมข��นตอนด�งการพ�ฒนาโปรแกรมด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด BookOnline จากน��นเล�อกค.าส��ง New > Servlet..
2. ก.าหนด Class Name: เป�น ProcessSelection.java และ Package เป�น controller แล�วกด Next
3. ก.าหนด URL Pattern(s) เป�น /ProcessSelection ด�งร#ป แล�วกด Finish
4. ในหน�าต/าง Editor เขยน Source code ของ ProcessSelection.java ด�ง Listing ท� 10.4 แล�วเล�อกค.าส��ง Save
Listing ท� 10.4 เมธอด processRequest() ของโปรแกรม ProcessSelection.java
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter();
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
73
String[] isbn = request.getParameterValues("isbn"); HttpSession session = request.getSession(true); Cart cart = (Cart) session.getAttribute("cart"); if (cart == null) { ServletContext ctx = getServletContext(); Connection conn = (Connection) ctx.getAttribute("connection"); cart = new Cart(conn); session.setAttribute("cart", cart); } for (int i = 0; i < isbn.length; i++) { cart.addItem(isbn[i]); } cart = (Cart) session.getAttribute("cart"); RequestDispatcher pg = request.getRequestDispatcher("viewCart.jsp"); pg.forward(request, response);
out.close(); }
10.5 การพฒนาโปรแกรม Init.java
โปรแกรม Init.java เป�นโปรแกรมประเภท ServletContextListener เพ��อเช��อมต/อก�บฐานข�อม#ลเม��อเร0�มต�น แล�วเก�บออปเจ�ค connection ไว�ภายใน ServletContext โดยมข��นตอนการพ�ฒนาเช/นเดยวก�บการพ�ฒนาโปรแกรม Init.java ในแบบฝ�กห�ดการพ�ฒนาโปรแกรม Servlet โดยใช�คลาสประเภท Listener และจะต�องมการแก�ไขไฟล5 context.xml และ web.xml ด�งแบบฝ�กห�ดด�งกล/าว
10.6 การพฒนาโปรแกรม viewCart.jsp
โปรแกรม viewCart.jsp เป�นโปรแกรม JSP ท�เขยนเพ��อแสดงรายการหน�งส�อท�ผ#�ใช�เล�อก และเก�บใน shopping cart ออกมาแสดง โปรแกรมน�จะใช� Expression Language เพ��อแสดงข�อม#ลใน session ด�ง Listing
ท� 10.5 และมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด BookOnline จากน��นเล�อกค.าส��ง New > JSP
2. ก.าหนด JSP File Name: เป�น viewCart แล�วกด Finish
3. ในหน�าต/าง editor ให�แก�ไข source code ของไฟล5 viewCart.jsp ให�เป�นไปตาม Listing ท� 10.5
4. กดป16ม Save
Listing ท� 10.5 โปรแกรม viewCart.jsp
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%><%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
74
<!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>Cart</title> </head> <body> <h1>Selected Books in Cart</h1> <c:forEach var="book" items="${sessionScope.cart.books}"> ${book.title} <br> </c:forEach> </body></html>
10.7 ข�นตอนการทดสอบโปรแกรม
เราสามารถท�จะทดสอบโปรแกรม ตามข��นตอนด�งน�
1. ท.าการ Build และ Deploy โปรเจ�ค BookOnline
2. ท.าการ Run โปรเจ�ค BookOnline
3. ทดลองร�น url ท�ช��อ http://localhost:8080/BookOnline/selectBooks.jsp แล�วทดลองเล�อกรายการหน�งส�อ แล�วกดป16ม Select
4. โปรแกรมจะเรยก url ท�ช��อ http://localhost:8080/BookOnline/processSelection เพ��อแสดงรายการใน Cart ด�งร#ปท� 10.2
5. ทดลองกล�บไปเล�อกรายการหน�งส�อเพ0�มเต0ม หร�อเรยก url ท�ช��อ http://localhost:8080/BookOnline/viewCart.jsp โดยตรงแล�วส�งเกตผลล�พธ5
ร�ปท�� 10.2 การแสดงข�อม�ลใน Cart
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
75
Exercise 11 การสร�าง Custom Tags ส%าหร�บโปรแกรม JSP
เน��อหาท��ต�องศ�กษาก�อน
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม JSP เพ��อสร�าง custom tag โดยจะเร0�มแสดงการพ�ฒนาโปรแกรมต��งแต/การเขยน JSP โดยไม/ใช� custom tags แล�วสร�าง tag โดยใช� Tag Handler และข��นตอนส1ดท�ายจะเป�นการสร�าง tag โดยใช� Tag File โดยโปรแกรม JSP ท�เขยนจะเป�นการพ0มพ5ข�อความว/า Hello xxxx จ.านวนส0บคร��ง โดยท� xxxx ค�อช��อท�ส/งมาทางพาราม0เตอร5ท�ช��อ name
11.1 การพฒนาโปรแกรม hello.jsp
โปรแกรม hello.jsp เป�นโปรแกรม JSP ท�เขยนโดยใช� scriptlet เรยกค.าส��งภาษาจาวา โดยจะมค.าส��งในการอ/านพาราม0เตอร5ของออปเจ�ค request ท�ช��อ name แล�วจะพ0มพ5ข�อความ Hello xxxx จ.านวนส0บคร��ง โดยโปรแกรมน�จะม sourcecode ด�ง Listing ท� 11.1 และมข��นตอนการพ�ฒนาโปรแกรมด�งน�
1. เล�อกเมน# File > New Project..
2. ในไดอะล�อก New Project ให�เล�อก Categories เป�น Java Web และเล�อก Projects เป�น Web
Application แล�วกด Next
3. ก.าหนด Project Name: เป�น JSPDemo แล�วเล�อก Project Location: เป�น Director ท�เราต�องการจะเก�บไฟล5ไว� จากน��นเล�อก Server เป�น Apache Tomcat 6.0.18 แล�วกด Finish
4. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSPDemo จากน��นเล�อกค.าส��ง New > Other...
5. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก JSP แล�วกด Next
6. ก.าหนด JSP File Name: เป�น hello แล�วกด Finish
7. ในหน�าต/าง editor ให�แก�ไข source code ของไฟล5 hello.jsp ให�เป�นไปตาม Listing ท� 11.1
8. ท.าการ Build และ Deploy โปรแกรม JSPDemo
9. ในหน�าต/าง Projects เล�อกไฟล5 hello.jsp แล�วเล�อก Run โปรแกรมโดยให�ส/งผ/านพาราม0เตอร5ทาง URL
เช/น http://localhost:8080/JSPDemo/hello.jsp?name=Thanisa เราจะได�ผลการร�นด�งร#ปท� 11.1
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
76
ร�ปท�� 11.1 ผลล�พธ!ของโปรแกรม hello.jsp
Listing ท� 11.1 โปรแกรม hello.jsp
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Demo</title> </head> <body> <h1>JSP Demo</h1> <% String name = request.getParameter("name"); %> <% for (int i = 0; i < 10; i++) { %> Hello <%= name %> <br> <% } %> </body></html>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
77
11.2 การพฒนาโปรแกรม helloTag.jsp
โปรแกรม helloTag.jsp เป�นโปรแกรม JSP ท�ท.างานแบบเดยวก�บโปรแกรม hello.jsp แต/การพ�ฒนาโปรแกรมน�จะเขยนโดยการสร�าง custom tag ท�ช��อ nameTag การสร�าง custom Tag จะต�องมการพ�ฒนาโปรแกรมหลายๆ ส/วนด�งน�
11.2.1 สร�าง Tag Library Descriptor
ไฟล5น�จะใช�เก�บ รายช��อ Tag ต/างๆ ท�มอย#/เพ��อสามารถน.า tag ต/างๆ มาใช�ในโปรแกรม JSP โดยใช�ค.าส��ง <%@taglib ...%> การสร�าง Tag Library Descriptor จะมข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSPDemo จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก Tag Library Descriptor แล�วกด Next
3. ก.าหนด TLD Name: เป�น MyTags และค/า Folder เป�น WEB-INF\tlds ส/วนค/าอ��นๆ ให�เป�นตามท�ต��งไว�ด�งร#ปท� 11.2 แล�วกด Finish
ร�ปท�� 11.2 การก#าหนด Tag Library Descriptor
4. หน�าต/าง Editor จะแสดงไฟล5ท�ช��อ MyTags.tld ท�อย#/ในโฟลเดอร5 Web Pages\WEB-INF\tlds
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
78
11.2.2 สร�างไฟล5 Tag Handler
ไฟล5 Tag Handler จะเป�นโปรแกรมจาวาท�พ�ฒนาข,�นเพ��อระบ1ว/า เม��อเรยกใช� tag แล�วจะต�องท.าค.าส��งอย/างไร ในท�น�จะก.าหนดช��อ Tag เป�น NameTag และโปรแกรมจาวาเป�น NameTagHandler โดยโปรแกรมจะท.าการอ/านค/าพาราม0เตอร5 name และพ0มพ5ข�อความ Hello xxxx จ.านวนส0บคร��ง การสร�างไฟล5 Tag Handler จะมข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSPDemo จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก Tag Handler แล�วกด Next
3. ก.าหนด Class Name: เป�น NameTagHandler ค/า Package เป�น tags ส/วนค/าอ��นๆ ให�เป�นตามท�ต��งไว� ด�งร#ปท� 11.3 แล�วกด Next
ร�ปท�� 11.3 การก#าหนดค�า Tag Handler
4. กดป16ม Browse เล�อก TLD File: เป�น MyTags.tld
5. กดป16ม New เพ��อเพ0�ม Attribute
6. ในไดอะล�อก Add New Attribute ก.าหนด Attribute Name: เป�น name ค/า Attribute Type เป�น java.lang.String และเล�อก required Attribute แล�วกด Next
7. เราจะได�ไดอะล�อก New File ด�งร#ปท� 11.4 แล�วกด Finish
8. หน�าต/าง Editor จะแสดงไฟล5 NameTagHandler.java ให�เขยน source code ด�ง Listing ท� 11.2
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
79
ร�ปท�� 11.4 การก�าหนดข�อม�ล TLD ของไฟล! NameTagHandler
Listing ท� 11.2 โปรแกรม NameTagHandler.java
package tags;
import javax.servlet.jsp.tagext.*;import javax.servlet.jsp.JspWriter;import javax.servlet.jsp.JspException;
public class NameTagHandler extends SimpleTagSupport {
/** * Initialization of name property. */ private java.lang.String name; /**Called by the container to invoke this tag. * The implementation of this method is provided by the tag library developer, * and handles all tag processing, body iteration, etc. */ public void doTag() throws JspException { JspWriter out=getJspContext().getOut(); try { JspFragment f=getJspBody(); if (f != null) f.invoke(out); for (int i = 0; i < 10; i++) { out.println("Hello " + name + "<br>");
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
80
} } catch (java.io.IOException ex) { throw new JspException(ex.getMessage()); } }
public void setName(java.lang.String name) { this.name = name; }}
11.2.3 เขยนโปรแกรม helloTag.jsp
โปรแกรม helloTag.jsp จะเรยกใช� Tag ท�ช��อ NameTag โดยจะม source code ด�ง Listing ท� 3 การสร�างโปรแกรม helloTag.jsp จะมข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSPDemo จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก JSP แล�วกด Next
3. ก.าหนด JSP File Name: เป�น helloTag แล�วกด Finish
4. ในหน�าต/าง editor ให�แก�ไข source code ของไฟล5 helloTag.jsp ให�เป�นไปตาม Listing ท� 11.3
5. ท.าการ run โปรแกรม จะได�ผลล�พธ5เช/นเดยวก�บโปรแกรม hello.jsp
Listing ท� 11.3 โปรแกรม helloTag.jsp
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%><%@taglib uri="/WEB-INF/tlds/MyTags" prefix="myTags" %>
<!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>JSP Demo</title> </head> <body> <h1>JSP Demo</h1> <myTags:NameTagHandler name="Thanisa" /> </body></html>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
81
11.3 การพฒนาโปรแกรม helloJSTL.jsp
โปรแกรม helloJSTL.jsp เป�นโปรแกรม JSP ท�ท.างานเช/นเดยวก�บโปรแกรมท�ผ/านมาแต/จะท.าการเรยกใช� JSP Standard Tag Library ในการพ0มพ5ข�อความ Hello xxx ส0บคร��ง แทนการเขยนค.าส��ง scriptlet โดยโปรแกรมน�จะม source code ด�ง Listing ท� 11.4 และจะมข��นตอนการพ�ฒนาโปรแกรมด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSPDemo จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก JSP แล�วกด Next
3. ก.าหนด JSP File Name: เป�น helloJSTL แล�วกด Finish
4. ขยายโหนด JSP Demo แล�วเล�อกโหนด Libraries คล0;กขวาเล�อก Add Library
5. ในไดอะล�อก Add Library เล�อกไฟล5 JSTL 1.1 แล�วกดป16ม Add Library
6. ในหน�าต/าง editor ให�แก�ไข source code ของไฟล5 helloJSTL.jsp ให�เป�นไปตาม Listing ท� 11.4
7. ท.าการ run โปรแกรม ดยก.าหนด URL เป�น http://localhost:8080/JSPDemo/helloJSTL.jsp?
name=Thanisa จะได�ผลล�พธ5เช/นเดยวก�บโปรแกรม hello.jsp
Listing ท� 11.4 โปรแกรม helloJSTL.jsp
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%><%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Demo</title> </head> <body> <h1>JSP Demo</h1> <c:forEach var="i" begin="1" end="10"> Hello ${param.name} <br> </c:forEach>
</body></html>
11.4 การพฒนาโปรแกรม helloTagFile.jsp
JSP 2.0 อน1ญาตให�เราสร�าง custom tag โดยการเขยนไฟล5 html หร�อ JSP แทนท�จะเขยนโปรแกรมภาษาจาวา ซ,�งท.าให�ง/ายต/อการพ�ฒนา ในท�น�เราจะพ�ฒนาโปรแกรม helloTagFile.jsp ซ,�งจะท.าการเรยกใช� custom tag ท�ช��อ nameTagFile ท�เป�น tag file ซ,�งเป�นโปรแกรม JSP โดยมข��นตอนการพ�ฒนาด�งน�
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
82
11.4.1 สร�าง Tag File
ไฟล5น�จะท.าหน�าน�เป�นต�วจ�ดการ Tag โดยเขยนเป�นโปรแกรม JSP และมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSPDemo จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก Tag File แล�วกด Next
3. ก.าหนด Tag File Name: เป�น NameTagFile
4. เล�อก Add Tag File to Tag Library Descriptor แล�วเล�อกไฟล5 MyTags.tld ด�งร#ปท� 11.5 แล�วกด Finish
ร�ปท�� 11.5 การก#าหนดค�า Tag File
5. หน�าต/าง Editor จะแสดงไฟล5ท�ช��อ NameTagFile.tag ท�อย#/ในโฟลเดอร5 Web Pages.WEB-INF.tags
6. เขยน source code ด�ง Listing ท� 11.5
Listing ท� 11.5 โปรแกรม NameTagFile.tag
<%@tag description="Tag Name" pageEncoding="UTF-8"%><%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:forEach var="i" begin="1" end="10"> Hello ${param.name} <br> </c:forEach>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
83
11.4.2 เขยนโปรแกรม helloTagFile.jsp
โปรแกรม helloTagFile.jsp จะเรยกใช� Tag ท�ช��อ NameTagFile โดยจะม source code ด�ง Listing
ท� การสร�างโปรแกรม helloTagFile.jsp จะมข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSPDemo จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก JSP แล�วกด Next
3. ก.าหนด JSP File Name: เป�น helloTagFile แล�วกด Finish
4. ในหน�าต/าง editor ให�แก�ไข source code ของไฟล5 helloTagFile.jsp ให�เป�นไปตาม Listing ท� 11.6
5. ท.าการ run โปรแกรมโดยก.าหนด URL เป�น http://localhost:8080/JSPDemo/helloTagFile.jsp?
name=Thanisa จะได�ผลล�พธ5เช/นเดยวก�บโปรแกรม hello.jsp
Listing ท� 11.6 โปรแกรม helloTagFile.jsp
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%><%@taglib uri="/WEB-INF/tlds/MyTags" prefix="myTags" %>
<!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>JSP Demo</title> </head> <body> <h1>JSP Demo</h1> <myTags:NameTagFile /> </body></html>
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
84
Exercise 12 การพ�ฒนาโปรแกรมเว�บโดยใช� Strut Framework
เน��อหาท��ต�องศ�กษาก�อน การพ�ฒนาโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม Web Application โดยใช� Struts Framework โดยการปร�บปร1งโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล เพ��อให�ส/วนของ Web User Interface สามารถท�จะตรวจสอบข�อม#ล (Validate Data) ท�ป%อนข�อม#ลได� และเปล�ยนแปลงว0ธการอ/านพาราม0เตอร5โดยใช� Struts Framework
ข��นตอนในการพ�ฒนาโปรแกรม1. สร�างโปรเจ�ค StrutDBApp
2. พ�ฒนาโปรแกรม BookActionForm
3. พ�ฒนาโปรแกรม addBook.jsp
4. พ�ฒนาโปรแกรม AddBookAction.java
5. แก�ไขไฟล5 ApplicationResource.properties
6. พ�ฒนาโปรแกรม Init.java และ Thankyou.html
7. แก�ไขไฟล5 Struts-Config.xml
12.1 การสร�าง Web Application Project
เราจะเร0�มต�นสร�างโปรแกรม WebBase Database โดยการสร�าง Project ใหม/ข,�นมาใน NetBeans ซ,�งมข��นตอนด�งน�
1. เล�อกเมน# File > New Project..
2. ในไดอะล�อก New Project ให�เล�อก Categories เป�น Java Web และเล�อก Projects เป�น Web
Application แล�วกด Next
3. ก.าหนด Project Name เป�น StrutDBApp แล�วเล�อก Project Location เป�น Director ท�เราต�องการจะเก�บไฟล5ไว� จากน��นเล�อก Server เป�น Apache Tomcat 6.0.18 จากน��นกด Next
4. ในช/อง Frameworks ให�เล�อก Struts และเล�อก Add Strut TLDs จากน��นกด Finish
12.2 การพฒนาโปรแกรม BookActionForm.java
Struts Framework จะมโปรแกรม Java ท�จะต�องพ�ฒนาอย#/สองโปรแกรมค�อ FormBean และ Action
Class โดยส/วน FormBean จะท.าหน�าท�ในการตรวจสอบพาราม0เตอร5ท�ผ#�ใช�จะป%อนข�อม#ลในหน�าเว�บเพจ ส/วน Action Class จะเป�นโปรแกรมท�อ/านค/าพาราม0เตอร5ท�ป%อนมาเพ��อประมวลผลต/อไป
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
85
โปรแกรม FormBean จะเป�นโปรแกรม Java ทมค/า attribute สอดคล�องก�บช��อพาราม0เตอร5ท�จะป%อน และจะมเมธอด getter และ setter ท�สอดคล�องก�บ attribute ด�งกล/าว นอกจากน�อาจมเมธอดในการ validate
ข�อม#ล เพ��อให�สอดคล�องก�บเง��อนไขของข�อม#ลท�ต�องการจะก.าหนดไว�
ในท�น�จะก.าหนดให�ไฟล5ช��อ addBook.jsp เป�นเว�บเพจท�ใช�แสดงฟอร5มส.าหร�บป%อนข�อม#ลหน�งส�อใหม/เข�าในฐานข�อม#ล books ซ,�งมล�กษณะด�งร#ปท� 12.1
ร�ปท�� 12.1 เว�บเพจท��ใช�แสดงฟอร!มส�าหร�บป+อนข�อม�ล
และก.าหนดให�ผ#�ใช�ต�องป%อนพาราม0เตอร5ท�มช��อและเง��อนไขต/างๆด�งน�
● isbn เป�นชน0ด String ท�มต�วอ�กษรระหว/าง 3-10 ต�ว● title เป�นชน0ด String ท�มต�วอ�กษรอย/างน�อย 3 ต�ว● author เป�นชน0ด String ท�มต�วอ�กษรอย/างน�อย 5 ต�ว● price เป�นชน0ด float ท�มค/าเป�นมากกว/า 0.0
แบบฝ�กห�ดน�ก.าหนดให�โปรแกรม FormBean มช��อว/า BookActionForm.java โดยมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด StrutDBApp จากน��นเล�อกค.าส��ง New > Other..
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Struts ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆภายใต� Category น� ให�เราเล�อก Struts ActionForm Bean แล�วกด Next
3. ก.าหนด Class Name เป�น BookActionForm และ Package เป�น com.myapp.struts ด�งแสดงในร#ปท� 12.2
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
86
ร�ปท�� 12.2 การก�าหนดค-า Struts ActionForm Bean
4. กด Finish แล�วเขยน Source code ของไฟล5ด�งน�5. เพ0�ม attribute ภายในคลาส BookActionForm ด�งน�
String isbn;String title;String author;float price;
6. ท.าการ encapsulate attribute (ก.าหนด attribute ให�เป�น private และ สร�างเมธอด getter และ setter)
โดยการคล0;กขวาภายในหน�าต/าง editor ของ source code แล�วเล�อก Refactor > Encapsulate Field..
7. โปรแกรมจะแสดง Fields ต/างๆให�เล�อกด�งร#ปท� 12.3
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
87
ร�ปท�� 12.3 หน�าไดอะล�อก Encapsulate Fields
8. ในไดอะล�อก Encapsulate Fields ให�คงค/าท�เล�อกไว�ท1ก Field ตามท�โปรแกรมก.าหนดไว�แล�วกดป16ม Refactor
9. โปรแกรมจะเพ0�ม source code โดยก.าหนดให� field ต/างๆม access modifier เป�น private แล�วเพ0�มเมธอด setter และ getter
10. แก�ไขโค�ดในเมธอด validate ด�งน�
public ActionErrors validate(ActionMapping mapping, HttpServletRequest request) { ActionErrors errors = new ActionErrors(); if (getIsbn() == null || getIsbn().length() < 3 || getIsbn().length() > 10) { errors.add("isbn", new ActionMessage("error.isbn.required")); } if (getTitle() == null || getTitle().length() < 3) { errors.add("title", new ActionMessage("error.title.required")); } if (getAuthor() == null || getAuthor().length() < 5) { errors.add("author", new ActionMessage("error.author.required")); } if (getPrice() < 0) { errors.add("price", new ActionMessage("error.price.required")); } return errors; }
11. กดป16ม Save จะได�โปรแกรมด�ง Listing ท� 12.1
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
88
Listing ท� 12.1 โปรแกรม BookActionForm.java
package com.myapp.struts;
import javax.servlet.http.HttpServletRequest;import org.apache.struts.action.ActionErrors;import org.apache.struts.action.ActionMapping;import org.apache.struts.action.ActionMessage;
public class BookActionForm extends org.apache.struts.action.ActionForm { private String isbn; private String title; private String author; private float price; private String name; public String getName() { return name; }
public void setName(String string) { name = string; } public BookActionForm() { super(); // TODO Auto-generated constructor stub } public ActionErrors validate(ActionMapping mapping, HttpServletRequest request) { ActionErrors errors = new ActionErrors(); if (getIsbn() == null || getIsbn().length() < 3 || getIsbn().length() > 10) { errors.add("isbn", new ActionMessage("error.isbn.required")); } if (getTitle() == null || getTitle().length() < 3) { errors.add("title", new ActionMessage("error.title.required")); } if (getAuthor() == null || getAuthor().length() < 5) { errors.add("author", new ActionMessage("error.author.required")); } if (getPrice() < 0) { errors.add("price", new ActionMessage("error.price.required")); } return errors; }
public String getIsbn() { return isbn; }
public void setIsbn(String isbn) { this.isbn = isbn;
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
89
}
public String getTitle() { return title; }
public void setTitle(String title) { this.title = title; }
public String getAuthor() { return author; }
public void setAuthor(String author) { this.author = author; }
public float getPrice() { return price; }
public void setPrice(float price) { this.price = price; }}
12.3 การพฒนาโปรแกรม AddBook.jsp
โปรแกรม AddBook.jsp เป�นโปรแกรม JSP ท�ใช� Tags ของ Strut Framework เพ��อแสดงหน�าเว�บเพจส.าหร�บการกรอกข�อม#ล โดยมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด StrutDBApp จากน��นเล�อกค.าส��ง New > Other...
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Web ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆ ภายใต� Category น� ให�เราเล�อก JSP แล�วกด Next
3. ก.าหนด JSP File Name: เป�น AddBook แล�วกด Finish
4. เขยน Source code ในหน�าต/าง Editor ตาม Listing ท� 12.2 แล�วป16ม Save
Listing ท� 12.2 โปรแกรม AddBook.jsp
<%@taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %><%@taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
90
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title><bean:message key="title.message"/> </title> </head> <body> <h1><bean:message key="title.message"/></h1> <html:errors/> <html:form action="AddBook"> ISBN : <html:text property="isbn" size="15"/> <BR> Title : <html:text property="title" size="50"/> <BR> Author : <html:text property="author" size="50"/> <BR> Price : <html:text property="price" size="10"/> <BR> <html:submit value="Add" /> </html:form> </body></html>
12.4 การพฒนาโปรแกรม AddBookAction.java
โปรแกรม AddBookAction.java เป�นโปรแกรม ActionForm ของ Struts Framework เพ��ออ/านข�อม#ลท�ผ#�ใช�ป%อนเข�ามาจากหน�า AddBook.jsp แล�วเขยนข�อม#ลลงใน table ท�ช��อ Books โดยมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด StrutDBApp จากน��นเล�อกค.าส��ง New => Other..
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Struts ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆภายใต� Category น� ให�เราเล�อก Struts Action แล�วกด Next
3. ก.าหนด Class Name: เป�น AddBookAction เล�อก Package: เป�น com.myapp.struts และก.าหนด Action Path : เป�น /AddBook จะได�ไดอะล�อก New Struts Action ด�งร#ปท� 12.4
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
91
ร�ปท�� 12.4 การก�าหนดค-า Struts Action
4. แล�วกด Next ในหน�าถ�ดไปของไดอะล�อก ให�เล�อก Input Resource : เป�น /AddBook.jsp แล�วกด Finish
5. ให�แก�ไข source code ในเมธอด execute() ด�งน�
public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception { BookActionForm bkForm = (BookActionForm) form; String isbn = bkForm.getIsbn(); String title = bkForm.getTitle(); String author = bkForm.getAuthor(); float price = bkForm.getPrice(); try { ServletContext context = getServlet().getServletContext(); Connection conn = (Connection) context.getAttribute("connection"); Statement stmt = conn.createStatement(); String sql = "INSERT INTO books VALUES('"+isbn+"','" + title +"','" + author +"',"+price +")"; stmt.executeUpdate(sql); return mapping.findForward(SUCCESS); }catch (SQLException ex) { System.out.println("Error " + ex); } return null; }
6. กดป16ม Save
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
92
12.5 การพฒนาไฟล' ApplicationResource.properties
ไฟล5 ApplicationResource.properties เป�นไฟล5ท�โปรแกรม Struts จะอ/านค/าคงท�ต/างๆท�เราก.าหนดข,�น ซ,�งในท�น�ได�ก.าหนดข�อความท�เก�ยวก�บ error message และ title ไว� โดยมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วขยายแทป StrutDBWeb > Source Packages > com.myapp.struts
2. ด�บเบ0�ลคล0;กเล�อกไฟล5 ApplicationResource.properties
3. ในหน�าต/าง Editor ให�เพ0�มข�อความด�งน�error.isbn.required=Please enter correct ISBNerror.title.required=Please enter correct Titleerror.author.required=Please enter correct author error.price.required=Price must greater than zerotitle.message=Add a new Book
4. กดป16ม Save
12.6 การพฒนาโปรแกรม Init.java และ Thankyou.html
โปรแกรม Init.java เป�นโปรแกรมประเภท ServletContextListener เพ��อเช��อมต/อก�บฐานข�อม#ลเม��อเร0�มต�น แล�วเก�บออปเจ�ค connection ไว�ภายใน ServletContext โดยมข��นตอนการพ�ฒนาเช/นเดยวก�บการพ�ฒนาโปรแกรม Init.java ในแบบฝ�กห�ดการพ�ฒนาโปรแกรม Servlet โดยใช�คลาสประเภท Listener และจะต�องมการแก�ไขไฟล5 context.xml และ web.xml ด�งแบบฝ�กห�ดด�งกล/าว
โปรแกรม Thankyou.html เป�นหน�าเว�บเพจท�จะแสดงเม��อ โปรแกรมได�ใส/ข�อม#ลลงฐานข�อม#ลเรยบร�อยแล�ว โดยโปรแกรมน�จะม source code เช/นเดยวก�บโปรแกรม Thankyou.html ในแบบฝ�กห�ดการพ�ฒนาโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล
12.7 การพฒนาไฟล' Struts-config.xml
ไฟล5 Struts-config.xml เป�นไฟล5ในการควบค1มการท.างานของโปรแกรม Struts ซ,�งในท�น�จะใช�ในการก.าหนดล.าด�บการท.างานของเว�บ (Navigation Rule) โดยมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วขยายแทป StrutDBApp > Configuration Files
2. ด�บเบ0�ลคล0;กเล�อกไฟล5 Struts-config.xml
3. ในหน�าต/าง Editor คล0;กขวาแล�วเล�อก Struts > Add Forward
4. ในไดอะล�อก Add Forward ก.าหนด Forward Name: เป�น success ส/วน Forward To: เป�น Resource File: /Thankyou.html และ Location เป�น Action : /AddBook โดยจะได�ไดอะล�อกด�งร#ปท� 12.5
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
93
ร�ปท�� 12.5 การก�าหนดค-า Add Forward
5. กดป16ม Add และกดป16ม Save จะมค.าส��งใน struts-config.xml เพ0�มข,�นมาด�งน�
<action-mappings> <action input="/AddBook.jsp" name="BookActionForm" path="/AddBook" scope="session" type="com.myapp.struts.AddBookAction"> <forward name="success" path="/Thankyou.html"/> </action>
</action-mappings>
12.8 การทดสอบโปรแกรม
1. ท.าการ Build และ Deploy โปรแกรม StrutDBApp
2. Run โปรแกรม StrutDBApp ท��งน�ต�องท.าการร�น MySQL Database Server ก/อน 3. เล�อก URL ของ Web Browser เป�น http://localhost:8080/StrutDBApp/AddBook.jsp ให�เรา
ทดลองใส/ข�อม#ลด�งร#ปท� 12.6
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
94
ร�ปท�� 12.6 ต�วอย-างการป+อนข�อม�ลเข�า Table ช��อ Books
4. เม��อกดป16ม Add โปรแกรมก�จะใส/ข�อม#ลลงใน Database
5. เราสามารถท�จะด#ข�อม#ลท�ป%อนเข�าไปได� โดยไปท�หน�าต/าง Runtime ของโปรแกรม NetBeans แล�วเล�อกค.าส��ง View Data.. จาก Table ท�ช��อ Books
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
95
Exercise 13 การพ�ฒนาโปรแกรมเว�บโดยใช� JSF Framework
เน��อหาท��ต�องศ�กษาก�อน การพ�ฒนาโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล
โปรแกรมในบทน�จะเป�นการพ�ฒนาโปรแกรม Web Application โดยใช� JSF Framework ท��งน�จะเป�นการปร�บปร1งโปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล เพ��อปร�บปร1งส/วน Web User Interface โดยจะท.าให�ผ#�ใช�สามารถท�จะ Validate Data ท�ป%อนข�อม#ลได� และเปล�ยนแปลงว0ธการอ/านพาราม0เตอร5โดยใช� Java Server Faces (JSF) Framework
ข��นตอนในการพ�ฒนาโปรแกรม1. สร�างโปรเจ�ค JSFDBApp
2. พ�ฒนาโปรแกรม JSF Managed Bean
3. พ�ฒนาโปรแกรม Validator
4. พ�ฒนาโปรแกรม AddBook.jsp
5. ก.าหนด Page Navigation
6. ก.าหนด Error Messages
7. ก.าหนด JNDI Name
8. พ�ฒนาโปรแกรม Init.java และ Thankyou.html
9. พ�ฒนาโปรแกรม AddBookServlet.java
13.1 การสร�าง Web Application Project
เราจะเร0�มต�นสร�างโปรแกรม Web Base Application โดยใช� JSF Framework โดยการสร�าง Project
ใหม/ข,�นมาใน NetBeans ซ,�งมข��นตอนด�งน�
1. เล�อกเมน# File > New Project..
2. ในไดอะล�อก New Project ให�เล�อก Categories เป�น Java Web และเล�อก Projects เป�น Web
Application แล�วกด Next
3. ก.าหนด Project Name เป�น JSFDBApp แล�วเล�อก Project Location เป�น Director ท�เราต�องการจะเก�บไฟล5ไว� จากน��นเล�อก Server เป�น Apache Tomcat 6.0.18 จากน��นกด Next
4. ในช/อง Frameworks ให�เล�อก Java Server Faces จากน��นกด Finish
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
96
13.2 การพฒนาโปรแกรม JSF Managed Bean
JSF Framework จะใช�โปรแกรม Java Bean ในการเช��อมโยงค/าพาราม0เตอร5ส.าหร�บโปรแกรม JSP หร�อ Servlet ภายใน Framework โปรแกรม JSF Managed Bean จะเป�นโปรแกรม Java ทมค/า attribute สอดคล�องก�บช��อพาราม0เตอร5ท�จะป%อน และจะมเมธอด getter และ setter ท�สอดคล�องก�บ attribute ด�งกล/าว ซ,�งในแบบฝ�กห�ดน�จะก.าหนดให�ผ#�ใช�ต�องป%อนพาราม0เตอร5ท�มช��อต/างๆ ด�งน�
● isbn เป�นชน0ด String
● title เป�นชน0ด String
● author เป�นชน0ด String
● price เป�นชน0ด float ท�มค/าเป�นมากกว/า 0.0
และจะต�องพ�ฒนาโปรแกรม JSF Managed Bean โดยมข��นตอนด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSFDBApp จากน��นเล�อกค.าส��ง New > Other..
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ JavaServer Faces ซ,�งโปรแกรมก�จะแสดง File
Types ต/างๆภายใต� Category น� ให�เราเล�อก JSF Managed Bean แล�วกด Next
3. ก.าหนด Class Name เป�น BookBean และ Package เป�น bean ส/วนค/าอ��นๆให�คลตามท�ก.าหนดไว� ด�งร#ปท� 13.1 แล�วกด Finish
ร�ปท�� 13.1 การก�าหนดค-า JSF Managed Bean
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
97
4. เขยน source code โดยเพ0�ม attribute ภายในคลาส BookBean ด�งน�String isbn;String title;String author;float price;
5. ท.าการ encapsulate attribute โดยคล0;กขวาภายในหน�าต/าง editor ของ source code แล�วเล�อก Refactor > Encapsulate Field..
6. ในไดอะล�อก Encapsulate Fields ให�คงค/าท�เล�อกไว�ท1ก Field ตามท�โปรแกรมก.าหนดไว�แล�วแล�วกดป16ม Refactor
7. กดป16ม Save โปรแกรมจะม Source code ด�ง Listing ท� 13.1
8. เล�อกไฟล5 faces-config.xml จะเห�นค.าส��งด�งน�
<managed-bean> <managed-bean-name>BookBean</managed-bean-name> <managed-bean-class>bean.BookBean</managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean>
Listing ท� 13.1 โปรแกรม BookBean.java
package bean;
public class BookBean { private String isbn; private String title; private String author; private float price;
public String getIsbn() { return isbn; }
public void setIsbn(String isbn) { this.isbn = isbn; }
public String getTitle() { return title; }
public void setTitle(String title) { this.title = title; }
public String getAuthor() { return author; }
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
98
public void setAuthor(String author) { this.author = author; }
public float getPrice() { return price; }
public void setPrice(float price) { this.price = price; } }
13.3 การพฒนาโปรแกรม PriceValidator.java
โปรแกรม PriceValidator.java เป�นโปรแกรม JSF Validator ท�พ�ฒนาข,�นมาเพ��อตรวจสอบความถ#กต�องของข�อม#ลราคาหน�งส�อท�ผ#�ใช�ป%อนเข�ามาว/าจะต�องมค/ามากกว/า 0.0 โปรแกรมน�จะต�อง implements
อ0นเตอร5เฟสช��อ javax.faces.validator.Validator และจะต�องม�การปร�บปร'งไฟล� faces-
config.xml เพ��อระบ1ช !อคลาส PriceValidator ว"าเป6น Validator แบบหน:!ง ข��นตอนการพ�ฒนาโปรแกรมน�มด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSFDBApp จากน��นเล�อกค.าส��ง New > Java Class...
2. ก.าหนด Class Name เป�น PriceValidator และ Package เป�น validator แล�วกด Finish
3. ให�เพ0�มค.าส��ง implements Validator ในการประกาศคลาส ด�งน� public class PriceValidator implements Validator
4. กด Alt+Shift+F เพ��อการ Fix Imports โดยให�เล�อกคลาส javax.faces.validator.Validator
5. ใช� Hint เพ��อท�จะ implements เมธอดต/างๆของอ0นเตอร5เฟส Validator ด�งร#ป
6. ให�แก�ไข source code ในเมธอด validate() ด�งน�
public void validate(FacesContext context, UIComponent component, Object value) throws ValidatorException {
Float priceObj = (Float) value; boolean flag = true; try { float price = priceObj; if (price < 0) {
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
99
flag = false; } } catch(ArithmeticException ex) { flag = false; } if (!flag) { FacesMessage message = new FacesMessage(); message.setDetail("Price is not valid - The price must greater than 0.0"); message.setSummary("Email not valid - The price must greater than 0.0"); message.setSeverity(FacesMessage.SEVERITY_ERROR); throw new ValidatorException(message); } }
7. กดป16ม Save
8. เล�อกไฟล5 faces-config.xml ซ,�งอย#/ภายใต�แทป Configuration Files แล�วเพ0�มข�อความภายในแท�ก </faces-config> ด�งน�
<validator> <validator-id>validator.PriceValidator</validator-id> <validator-class>validator.PriceValidator</validator-class> </validator>
9. กดป16ม Save
13.4 การพฒนาโปรแกรม AddBook.jsp
โปรแกรม AddBook.jsp เป�นโปรแกรม JSP ท�ใช� Tags ของ JSF Framework เพ��อแสดงหน�าเว�บเพจให�ผ#�ใช�กรอกข�อม#ล โดยจะแสดงผลเช/นเดยวก�บหน�าเว�บเพจ addBook.html ในโปรแกรม Web Base Database
Application ในแบบฝ�กห�ดท�ผ/าน โดยจะมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSFDBApp จากน��นเล�อกค.าส��ง New > Other..
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ JavaServer Faces ซ,�งโปรแกรมก�จะแสดง File
Types ต/างๆภายใต� Category น� ให�เราเล�อก JSF JSP Page แล�วกด Next
3. ก.าหนด JSP File Name: เป�น AddBook แล�วกด Finish
4. ภายใน Source code ของโปรแกรม AddBook.jsp จะมการประกาศ tag libraries ด�งน�โดยอ�ตโนม�ต0
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %><%@ taglib prefix="h" uri="http://java.sun.com/jsf/html" %>
5. แก�ไขข�อความใน tag ท�ช��อ <title> และ <h1> เป�น Add a new Book
6. ในส/วนของฟอร5ม เราจะใช� JSF tag โดยให�ลาก ป16ม JSF Form ในหน�าต/าง Palette มาไว�ใน source
code โปรแกรม NetBeans จะแสดงไดอะล�อก Insert JSF Form ให�เล�อกช/อง Empty Form แล�วกด
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
100
OK7. หล�งจากน��นให�เขยน code โดยใช� คอมโพเนนท5 inputText และ commandButton โดยจะได� source
code ด�งน�
<f:view> ... <h:form> ISBN : <h:inputText value="#{BookBean.isbn}" required="true" id="isbn" size="15"/> <h:message for="isbn" /> <BR> Title : <h:inputText value="#{BookBean.title}" required="true" id="title" size="50"/> <h:message for="title" /><BR> Author : <h:inputText value="#{BookBean.author}" required="true" id="author" size="50"/> <h:message for="author" /> <BR> Price : <h:inputText value="#{BookBean.price}" required="true" id="price" size="10" > <f:validator validatorId="validator.PriceValidator" /></h:inputText> <h:message for="price" /> <BR> <h:commandButton value="Submit" action="submit" /> </h:form>
.... </f:view>
8. กดป16ม Save
13.5 การก/าหนด Page Navigation
JSF Framework จะก.าหนดล.าด�บการท.างานของเว�บเพจต/างๆ (Page Navigation) โดยการก.าหนด configuration ในไฟล5 faces-config.xml ในท�น�จะก.าหนดให�โปรแกรม AddBook.jsp เรยก url ช��อ /addBook.do เม��อกดป16ม Submit ซ,�งการแก�ไขไฟล5 faces-config.xml จะมข��นตอนการพ�ฒนาด�งน�
1. เล�อกไฟล5 faces-config.xml ซ,�งอย#/ภายใต�แทป Configuration Files
2. คล0;กขวาในหน�าต/าง Editor เล�อกแทป XML แล�วเล�อก Java ServerFaces > Add Navigation Rule
3. ในไดอะล�อก Add Navigation Rule ให�ก.าหนดค/า Rule From View: เป�น /AddBook.jsp แล�วกดป16ม Add
4. คล0;กขวาในหน�าต/าง Editor แล�วเล�อก Java ServerFaces > Add Navigation Case
5. ในไดอะล�อก Add Navigation Case ให�ก.าหนดค/า From View: เป�น /AddBook.jsp ค/า From
Outcome: เป�น submit และ To View: เป�น /addBook.do แล�วกดป16ม Add
6. ไฟล5 faces-config.xml จะมค.าส��งเพ0�มด�งน�
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
101
<navigation-rule> <description> </description> <from-view-id>/AddBook.jsp</from-view-id> <navigation-case> <from-outcome>submit</from-outcome> <to-view-id>/addBook.do</to-view-id> </navigation-case>
</navigation-rule>7. และถ�าเล�อกแทป PageFlow จะเห�นความส�มพ�นธ5ของไฟล5ด�งร#ปท� 13.2
ร�ปท�� 13.2 การแสดง PageFlow
13.6 การก/าหนด Error Message
JSF Framework ก.าหนดให�ไฟล5 Message.properties ท.าหน�าท�ในการแสดงข�อความเม��อข�อม#ลท�ผ#�ใช�ป%อนไม/สอดคล�องก�บเง��อนไขท�ก.าหนดไว� ไฟล5 Message.properties จะอย#/ในแพคเก�จ javax.faces ซ,�งเราสามารถท�จะเรยกด#ได�โดยการขยายแทป Libraries > jsf-impl.jar > javax.faces ในกรณท�เราต�องการจะก.าหนด Error Message เองเราจะต�องสร�างไฟล5 property ข,�นมาใหม/ โดยจะมข��นตอนการพ�ฒนาด�งน�
1. เล�อกหน�าต/าง Projects แล�วคล0;กขวาท�โหนด JSFDBApp จากน��นเล�อกค.าส��ง New => File/Folder..
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
102
2. ในไดอะล�อก New File ให�เล�อก Categories ทช��อ Other ซ,�งโปรแกรมก�จะแสดง File Types ต/างๆภายใต� Category น� ให�เราเล�อก Properties File แล�วกด Next
3. ในไดอะล�อก New Properties File ก.าหนด File Name: เป�น MyMessage และ Folder: เป�น src/java/properties
4. ในหน�าต/าง editor ให�แก�ไขไฟล5 MyMessages.properties โดยเพ0�มข�อความด�งน� javax.faces.component.UIInput.REQUIRED=Please enter a value for this field.
5. กดป16ม Save
6. เล�อกไฟล5 faces-config.xml ซ,�งอย#/ภายใต�แทป Configuration Files แล�วเพ0�มข�อความด�งน�
<application> <message-bundle>properties.MyMessages</message-bundle> </application>
7. กดป16ม Save
13.7 การพฒนาโปรแกรม Thankyou.html, error.html และ Init.java
โปรแกรม Thankyou.html เป�นหน�าเว�บเพจท�จะแสดงเม��อ โปรแกรมได�ใส/ข�อม#ลลงฐานข�อม#ลเรยบร�อยแล�ว โดยโปรแกรมน�จะม sourcecode เช/นเดยวก�บโปรแกรม Thankyou.html ในแบบฝ�กห�ดการพ�ฒนา โปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล ส/วน error.html เป�นหน�าเว�บเพจท�จะแสดงเม��อ โปรแกรมไม/สามารถใส/ข�อม#ลลงฐานข�อม#ลได� โดยม sourcecode ด�ง Listing ท� 13.2
Listing ท� 13.2 โปรแกรม error.html
<html> <head> <title>Error!</title> </head> <body> <H1>Cannot Add!!</H1> </body></html>
โปรแกรม Init.java เป�นโปรแกรมประเภท ServletContextListener เพ��อเช��อมต/อก�บฐานข�อม#ลเม��อเร0�มต�น แล�วเก�บออปเจ�ค connection ไว�ภายใน ServletContext โดยมข��นตอนการพ�ฒนาเช/นเดยวก�บการพ�ฒนาโปรแกรม Init.java ในแบบฝ�กห�ดการพ�ฒนาโปรแกรม Servlet โดยใช�คลาสประเภท Listener
13.8 การพฒนาโปรแกรม AddBookServlet.java
โปรแกรม AddBookServlet จะเป�นโปรแกรมท� JSF Frameworks เรยกใช�หล�งจากท�ผ#�ใช�กดป16ม Submit ในหน�า AddBook.jsp โปรแกรมน�จะม url เป�น /addBook.do และจะม sourcecode คล�ายก�บ
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
103
โปรแกรม AddBookServlet.java ในแบบฝ�กห�ดการพ�ฒนา โปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล แต/จะมค.าส��งอ/านค/าพาราม0เตอร5ท�ผ#�ใช�ป%อนเข�ามาแตกต/างจากเด0ม เพราะกรณน�จะใช�จาก attribute ของโปรแกรม JSF
Managed Bean ท�ช��อ BookBean ซ,�งเป�น attribute ท�เก�บไว�ใน request session โดยมค.าส��งด�งน�
BookBean obj = (BookBean) request.getAttribute("BookBean"); String isbn = obj.getIsbn(); String author = obj.getAuthor(); String title = obj.getTitle(); float price = obj.getPrice();
โปรแกรม AddBookServlet จะมข��นตอนในการพ�ฒนาเช/นเดยวก�บแบบฝ�กห�ดการพ�ฒนา โปรแกรมเว�บเพ��อต0ดต/อก�บฐานข�อม#ล และจะม source code ด�ง Listing ท� 13.3 โดยจะต�องก.าหนดให�ม URL pattern เป�น /addBook.do
Listing ท� 13.3 โปรแกรม AddBookServlet.java
package controller;
import bean.BookBean;import java.io.IOException;import java.io.PrintWriter;import java.sql.Connection;import java.sql.SQLException;import java.sql.Statement;import javax.servlet.*;import javax.servlet.http.*;
public class AddBookServlet extends HttpServlet { private Connection conn; public void init() { conn = (Connection) getServletContext().getAttribute("connection"); }
protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); out.println("<html>"); out.println("<head>"); out.println("<title>Add a new book</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1> Add a new book </h1>"); try { BookBean obj = (BookBean) request.getAttribute("BookBean"); String isbn = obj.getIsbn(); String author = obj.getAuthor();
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
104
String title = obj.getTitle(); float price = obj.getPrice(); Statement stmt = conn.createStatement(); String sql = "INSERT INTO books VALUES('"+isbn+"','" + title +"','" + author +"',"+price +")"; int row = stmt.executeUpdate(sql); if (row == 1) {
response.sendRedirect(“Thankyou.html”); } else {
response.sendRedirect(“error.html”); } }catch (SQLException ex) { out.println("Error " + ex); return; } out.println("</body>"); out.println("</html>");
out.close(); } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); } public String getServletInfo() { return "Short description"; }}
13.9 การทดสอบโปรแกรม
1. ท.าการ Build และ Deploy โปรแกรม JSFDBApp
2. Run โปรแกรม JSFDBApp
3. เล�อก URL ของ Web Browser เป�น http://localhost:8080/JSFDBApp/AddBook.jsp ให�เรา ทดลองใส/ข�อม#ล
4. เม��อกดป16ม Add โปรแกรมก�จะใส/ข�อม#ลลงใน Database
5. เราสามารถท�จะด#ข�อม#ลท�ป%อนเข�าไปได� โดยไปท�หน�าต/าง Services ของโปรแกรม NetBeans แล�วเล�อกค.าส��ง View Data.. จาก Table ท�ช��อ books
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
105
Exercise 14 การพ�ฒนาโปรแกรมเว�บโดยใช� Visual JSF
เน��อหาท��ต�องศ�กษาก�อน -
แบบฝ�กห�ดน�จะเป�นการพ�ฒนาโปรแกรม JSF Frameworks โดยใช�โมด#ลของ NetBeans ท�ช��อ Visual
Web JavaServer Faces ซ,�งช/วยท.าให�เราสามารถพ�ฒนาโปรแกรม Web Application ได�โดยง/ายในร#ปแบบ Drag and Drop และท.าให�เราเขยน source code น�อยลง
14.1 การสร�าง Web Application Project
เราจะเร0�มต�นสร�างโปรแกรม Web Base Application โดยใช� JSF Framework โดยการสร�าง Project
ใหม/ข,�นมาใน NetBeans ซ,�งมข��นตอนด�งน�
1. เล�อกเมน# File > New Project..
2. ในไดอะล�อก New Project ให�เล�อก Categories เป�น Java Web และเล�อก Projects เป�น Web
Application แล�วกด Next
3. ก.าหนด Project Name เป�น HelloVisualWebApp แล�วเล�อก Project Location เป�น Director ท�เราต�องการจะเก�บไฟล5ไว� จากน��นเล�อก Server เป�น GlassFish V2 จากน��นกด Next
4. ในช/อง Frameworks ให�เล�อก Visual Web JavaServer Faces จากน��นกด Finish [ในกรณท�ไม/ม Visual JSF Framework ให�เล�อก เราจะต�องท.าการต0ดต��ง Visual JSF Plugin ของ NetBeans ก/อน]
14.2 การพฒนาโปรแกรม HelloWeb
โปรแกรม HelloWeb เป�นโปรแกรมท�จะพ�ฒนาข,�นในโปรเจ�ค HelloVisualWebApp โดยต�องการจะให�มหน�าจอส/วนต0ดต/อผ#�ใช�ด�งร#ปท� 14.1 โดยผ#�ใช�สามารถป%อนข�อความใน TextField และเม��อกดป16ม Say
Sawaddee โปรแกรมจะแสดงข�อความบนต.าแหน/ง Static Text โดยมข��นตอนการพ�ฒนาโปรแกรมด�งน�
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
106
ร�ปท�� 14.1 การสร�างหน�าเว�บเพจ JSF โดยใช� Visual Editor
1. ในโปรเจ�ค HelloVisualWebApp ให�เล�อกไฟล5 Page1.jsp หน�าต/าง Editor จะแสดงไฟล5น�ในโหมด Design
2. ในหน�าต/าง Properties ให�ก.าหนดค/าของ Title เป�น Hello Web ด�งร#ปท� 14.2
ร�ปท�� 14.2 การก�าหนดค-า Properties ของ Page1
3. ในหน�าต"าง Palette ลากไอคอน Label ท�!อย/"ภายในโหนด Basic มาไว�ในหน�าต"างการออกแบบของ Page1.jsp แล�วแก�ไขข�อความเป6น Name: แล�วกด Enter (จะส�งเกตเห�นว"าค"าของ text ในหน�าต"าง Properties ส.าหร�บ label1:text จะถ/กเปล�!ยนเป6น Name: ด�วย)
4. ลากไอคอน TextField ท�!อย/"ภายในโหนด Basic มาไว�ในหน�าต"างการออกแบบของ Page1.jsp ในต.าแหน"งด�งร/ปท�!แสดงข�างต�น แล�วแก�ไขข�อความเป6น Enter your name แล�วกด Enter
5. ในหน�าต"าง Properties ส.าหร�บ TextField1 ให�เปล�!ยนค"า id จาก textField1 เป6น nameTf
6. ให�ท.าการคล#;กขวาท�! nameTf แล�วเล อก Add Binding Attribute ด�งแสดงในร/ปท�! 14.3
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
107
ร�ปท�� 14.3 การใช�ค�าส��ง Add Binding Attribute
7. ลากไอคอน Button ท�!อย/"ภายในโหนด Basic มาไว�ในหน�าต"างการออกแบบของ Page1.jsp ในต.าแหน"งด�งร/ปท�!แสดงข�างต�น แล�วแก�ไขข�อความเป6น Say Sawaddee
8. ในหน�าต"าง Properties ส.าหร�บ Button ให�เปล�!ยนค"า id จาก button1 เป6น hiButton
9. ลากไอคอน Static Text ท�!อย/"ภายในโหนด Basic มาไว�ในหน�าต"างการออกแบบของ Page1.jsp ในต.าแหน"งด�งร/ปท�! 14.1
10. ในหน�าต"าง Properties ส.าหร�บ Static Text ให�เปล�!ยนค"า id จาก staticText1 เป6น hiText
11. ให�ท.าการคล#;กขวาท�! hiText แล�วเล อก Add Binding Attribute
12. ลากไอคอน Message Group ท�!อย/"ภายในโหนด Basic มาไว�ในหน�าต"างการออกแบบของ Page1.jsp
ในต.าแหน"งด�งร/ปท�! 14.1 (Message Group สามารถเอาไว�ใช�ในการแสดง Error Message)
13. ในหน�าต/าง editor ให�เล�อกแทป JSP เราจะเห�น sourcecode ของไฟล5 Page1.jsp ซ,�งจะม Tags ของ JSF อย#/ ให�ส�งเกตการเขยนโปรแกรมด�งกล/าว
ข��นตอนถ�ดมาจะเป�นการเขยน Source code เพ��อก.าหนดการท.างานของการกดป16ม Say Sawaddee โดยมข��นตอนการท.างานด�งน�
14. ในหน�าต/าง editor ให�กล�บมาเล�อกแทป Design แล�วกดด�บเบ0�ลคล0;กท�ป16ม Say Sawaddee
15. หน�าต/าง editor จะแสดงแทป Java และแสดง source code ในค.าส��ง action ของป16ม Say Sawaddee
ให�แก�ไข source code ด�งน�
public String hiButton_action() { String name = (String) nameTf.getText(); hiText.setText("Sawaddee " +name); return null; }
14.3 การทดสอบโปรแกรม
1. ท.าการ Build และ Deploy โปรแกรม HelloVisualWebApp
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
108
2. Run โปรแกรม HelloVisualWebApp
3. ทดลองป>อนข�อความลงใน Text Field จะได�ต�วอย"างผลล�พธ�ด�งร/ปท�! 14.4
ร�ปท�� 14.4 ผลล�พธ!การร�นโปรแกรม HelloVisualWebApp
14.4 การปรบปร�งโปรแกรม HelloWeb
ข��นตอนน�จะเป�นการปร�บปร1งโปรเจ�ค HelloVisualWebApp ให�ม Drop-Down List ท�น.าช��อมาจาก table ในฐานข�อม#ล โดยจะมหน�าจอส/วนต0ดต/อผ#�ใช�ด�งร#ปท� 14.5 และมข��นตอนการพ�ฒนาโปรแกรมด�งน�
ร�ปท�� 14.5 ส-วนต�ดต-อก�บผ��ใช�ของโปรแกรม VisualWebApp ท��จะปร�บปร1งใหม-
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
109
1. ในโปรเจ�ค HelloVisualWebApp ให�เล อกไฟล� Page1.jsp หน�าต"าง Editor จะแสดงไฟล�น�&ในโหมด Design
2. ลบ TextField ออก แล�วลากไอคอน Drop Down List ท�!อย/"ภายในโหนด Basic มาแทนท�!3. ในหน�าต"าง Properties ส.าหร�บ Drop Down List ให�เปล�!ยนค"า id จาก dropDown1 เป6น
nameDropDown4. ให�ท.าการคล#;กขวาท�! nameDropDown แล�วเล อก Add Binding Attribute
5. ในหน�าต"าง Services ขยายโหนด Databases แล�วคล#;กขวาท�!โหนด jdbc:mysql://localhost:3306/test
แล�วเล อก Connect เพ !อเช !อมต"อฐานข�อม/ล6. ขยายโหนด Tables จะเห�น table ท�!ช !อ books ซ:!งสร�างมาในแบบฝ8กห�ดการเช !อมต"อก�บ MySQL
Database ด�งร/ปท�! 14.6
ร�ปท�� 14.6 การแสดง Table ท��ช��อ books
7. ลากไอคอนของ table ท�!ช !อ books ไปลงใน Drop Down List
8. คล#;กขวาท�! Drop Down List แล�วเล อก3 Bind to Data
9. ในไดอะล�อก Bind to Data เล อก Value field: เป6น books.author และ Display field: เป6น books.author ด�งร/ปท�! 14.7 แล�วกดป'<ม OK
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
110
ร�ปท�� 14.7 การก�าหนดค-า Bind to Data
10. กดด�บเบ0�ลคล0;กท�ป16ม Say Sawaddee หน�าต/าง editor จะแสดงแทป Java ให�แก�ไข source code ด�งน�
public String hiButton_action() { String name =(String)nameDropDown.getSelected(); hiText.setText("Sawaddee " + name); return null; }
11. ในแทป Java ให�แก�ไข source code ของเมธอด prerender() เพ��อก.าหนดค/าเร0�มต�นของการเล�อก Drop
Down List ด�งน�
public void prerender() { if (nameDropDown.getSelected() == null) { booksDataProvider.cursorFirst(); nameDropDown.setSelected ((String)booksDataProvider.getValue("books.author")); } }
14.5 การทดสอบโปรแกรม
1. ท.าการ Build และ Deploy โปรแกรม HelloVisualWebApp
2. Run โปรแกรม HelloVisualWebApp
3. ทดลองเล�อกช��อใน Drop Down List จะได�ต�วอย/างผลล�พธ5ด�งร#ป 14.8
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan
111
ร�ปท�� 14.8 ต�วอย-างการร�นโปรแกรม HelloVisualWebApp
การเข�ยนโปรแกรม Java Servet / JSP Thanachart Numnonda / Thanisa Kruawaisayawan