คลังเก็บหมวดหมู่: Java

Java Bookstore(Series 5.1) Struts 2

จาก Java Programming Bookstore Appication (Series 5): Building a Web Application Using Struts 2 เราจะแก้ไข HelloWorld project ให้สามารถรับค่าและแสดงผลได้อย่างง่ายๆ กันก่อนครับ สิ่งที่เราต้องทำคือต้องสร้างคลาสสำหรับ action และมีหน้าจอในการกรอกชื่อ และส่วนของการแสดงผล เริ่มต้นที่หน้าจอกรอกข้อมูลกันตามตัวอย่างที่ 1 เป็นการแก้ไขไฟล์ index.jsp 

ตัวอย่างที่ 1 index.jsp
<html >
<body>
        <form action= “hello”>
               <label for= “name”>Enter your name </label> < br /> < input type =“text”
                      name= “name” /> < input type =“submit” value= “Submit” />
        </form>
</body>
</html>
จากตัวอย่างที่ 1
  • เมื่อเรากดปุ่ม Submit หน้าจอจะมีการเรียก action hello และจะถูกส่งไปยัง container
เมื่อมีการเพิ่ม action เราจำเป็นต้อง map URL Pattern เพิ่มที่ไฟล์ struts.xml ซึ่งจากโปรเจ็คเดิมเราจะ config ไว้แค่ action index ที่จะไปเรียก index.jsp เพื่อแสดงผล ให้แก้ไขไฟล์ struts.xml ตามตัวอย่างที่ 2
ตัวอย่างที่ 2 struts.xml
<?xml version= “1.0” encoding =“UTF-8”?>
<!DOCTYPE struts PUBLIC
 “-//Apache Software Foundation//DTD Struts Configuration 2.0//EN”
 
<struts>
        <constant name= “struts.devMode” value =“true” />
        <package name= “basicstruts2” extends =“struts-default”
               namespace=“/” >
               <action name= “index”>
                      <result> /index.jsp</result >
               </action>
 
               <action name= “hello” class=“com.apress.helloworld.action.HelloWorldAction”
                      method= “execute”>
                      <result name= “success”>/hello.jsp </result>
               </action>
        </package>
</struts>
จากตัวอย่างที่ 2
  • action name ชื่อ hello จะถูก map ไปยังคลาส HelloWorldAction (ยังไม่สร้าง) และจะเรียกใช้เมธอด execute
  • เมื่อรันสำเร็จจะถูกส่งไปยังหน้าจอที่ชื่อ hello.jsp
ต่อไปเราจำเป็นต้องสร้าง action คลาสขึ้นมาชื่อว่า HelloWorldAction ตามรูปที่ 1 เมื่อกดปุ่ม Finish จะได้ผลตามรูปที่ 2
รูปที่ 1

 

ให้เราแก้ไขไฟล์ HelloWorldAction ตามตัวอย่างที่ 3
รูปที่ 2

 

ตัวอย่างที่ 3 HelloWorldAction.java
package com.apress.helloworld.action;
 
public class HelloWorldAction {
 
        private String name ;
 
        public String execute() throws Exception {
               return “success” ;
       }
 
        public String getName() {
               return name ;
       }
 
        public void setName(String name) {
               this.name = name;
       }
}
จากตัวอย่างที่ 3
  • เมธอด execute() จะถูกเรียกโดย user action ที่ได้ config ไปตามตัวอย่างที่ 2 และ return “success” จะถูกส่งต่อไปยัง hello.jsp (ตัวอย่างที่ 4) ตาม config ไฟล์ที่ชื่อ struts.xml
ให้เราสร้างไฟล์ hello.jsp ที่ path helloWorldStruts2/src/main/webapp และแก้ไขตามตัวอย่างที่ 4
ตัวอย่างที่ 4 hello.jsp
<%@ page language= “java” contentType =“text/html; charset=ISO-8859-1”
        pageEncoding=“ISO-8859-1” %>
 
<%@ taglib prefix=“s” uri= “/struts-tags”%>
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” http://www.w3.org/TR/html4/loose.dtd&#8221; >
<html>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=ISO-8859-1”>
<title> Hello World</title >
</head>
<body>
       Hello your name is
        <s:property value= “name” />
</body>
</html>
จากตัวอย่างที่ 4
  • taglib คือ directive ที่บอกให้ servlet container รู้ว่า jsp นี้จะเรียกใช้งาน tags ของ Struts 2
  • s:property tag จะเป็นตัวแสดงค่าที่ได้จากเมธอด getName จากคลาส HelloWorldAction
ทดสอบโดยการ start Tomcat server และเรียก http://localhost:8080/helloWorldStruts2/ จะปรากฏหน้าจอดังรูปที่ 3
รูปที่ 3
พิมพ์ชื่อ แล้วกดปุ่ม Submit จะได้ผลตามรูปที่ 4
รูปที่ 4

เราจะเริ่มสร้าง Bookstore Application ในตอนต่อไป

Java Programming Bookstore Application (Series 5.2): Building a Web Application Using Struts 2
ตอนต่อไปติดตามได้ที่
Java Programming Bookstore Application (Series 6): Building Java Web Applications with Spring Web MVC
Java Programming Bookstore Application (Series 7): Component-Based Web Development Using JSF 2
Java Programming Bookstore Application (Series 8): Rapid Web Development with Grails
Java Programming Bookstore Application (Series 9): Play with Java and Scala
อ้างอิง
 
ผู้เขียน: procodeblog

Java Bookstore(Series 5) Struts 2

ใน series ต่อไปนี้เราจะลองใช้ struts 2 กันเบื้องต้นโดยเขียน HelloWorld กันจะมีการใช้ tool ที่เรียกว่า Maven ด้วยครับ Maven เป็น command-line tool ใช้ในการ build และ package project รวมถึงช่วยเรื่อง manage dependencies ช่วยให้เราพัฒนา project ต่างๆ ได้ง่ายขึ้น ซึ่งเราจะใช้ไฟล์ชื่อ pom.xml ในการ config ค่าต่างๆ ในบทความนี้เราจะใช้ Maven 4 ซึ่งบรรจุอยู่ใน Eclipse-kepler อยู่แล้ว (การพัฒนาโปรแกรม Java ด้วย Eclipse IDE for Windows 64-bit)
เริ่มต้นสร้าง Maven Project ตามรูปที่ 1 ให้เปิด eclipse เลือกเมนู File > New > Other…
จะปรากฏหน้าจอตามรูปที่ 2
รูปที่ 1

 

จการูปที่ 2 ให้เลือกโฟลเดอร์ Maven > Maven Project แล้วกดปุ่ม Next >
รูปที่ 2
จะได้ผลตามรูปที่ 3 จากนั้นกดปุ่ม Next >
รูปที่ 3

 

ให้เลือกตามรูปที่ 4 เป็นการเลือก template ของการสร้างเว็บแบบง่ายๆ แล้วกดปุ่ม Next >
รูปที่ 4

 

ให้กรอกข้อมูลตามรูปที่ 5 แล้วกดปุ่ม Finish
รูปที่ 5

 

เราจะได้โครงสร้าง project ตามรูปที่ 6
รูปที่ 6

 

จากนั้นเราจำเป็นต้องเพิ่ม struts 2-core dependency ในไฟล์ config ที่ชื่อว่า pom.xml ตามตัวอย่างที่ 1 (ส่วนที่เป็นสีส้มคือ code ที่เพิ่ม)
ตัวอย่างที่ 1 pom.xml
        <modelVersion> 4.0.0</ modelVersion>
        <groupId> com.apress</groupId >
        <artifactId> helloWorldStruts2</artifactId >
        <packaging> war</ packaging>
        <version> 0.0.1-SNAPSHOT</version >
        <name> helloWorldStruts2 Maven Webapp</name >
        <url> http://maven.apache.org</url >
        <dependencies>
               <dependency>
                      <groupId> junit</groupId >
                      <artifactId> junit</artifactId >
                      <version> 3.8.1</ version>
                      <scope> test</ scope>
               </dependency>
               <dependency>
                      <groupId> org.apache.struts</groupId >
                      <artifactId> struts2-core</artifactId >
                      <version> 2.3.16.3</ version>
                      <type> jar</ type>
                      <scope> compile</ scope>
               </dependency>
        </dependencies>
        <build>
               <finalName> helloWorldStruts2</finalName >
        </build>
</project>
จากนั้นให้เราทำการแก้ไข web.xml ซึ่งก็คือ deployment descriptor โดยเราจำเป็นต้อง config servlet filter ขึ้นตามตัวอย่างที่ 2
ตัวอย่างที่ 2 web.xml
<!DOCTYPE web-app PUBLIC
 “-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN”
 
<web-app>
        <display-name> Hello World Struts 2 Web Application</display-name >
        <filter>
               <filter-name> struts2</ filter-name>
               <filter-class> org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter </filter-class>
        </filter>
 
        <filter-mapping>
               <filter-name> struts2</ filter-name>
               <url-pattern> /*</ url-pattern>
        </filter-mapping>
</web-app>
จากตัวอย่างที่ 2
  • StrutsPrepareAndExecuteFilter จะทำหน้าที่เป็น servlet filter ตาม URL pattern ที่เราได้ map ไว้
ต่อไปให้สร้างไฟล์ struts.xml (สร้างโฟลเดอร์ classes ใต้โฟลเดอร์ WEB-INF แล้วสร้างไฟล์ struts.xml ใต้ classes อีกที)  ตามรูปที่ 7
รูปที่ 7

 

รูปที่ 8 
จากรูปที่ 8 ให้เลือกโฟลเดอร์ XML > XML File แล้วกดปุ่ม Next >
ต่อไปให้ตั้งชื่อไฟล์ว่า struts.xml แล้วกดปุ่ม Finish
รูปที่ 9

 

ให้แก้ไขไฟล์ struts.xml ตามตัวอย่างที่ 2
ตัวอย่างที่ 2 struts.xml
<?xml version= “1.0” encoding =“UTF-8”?>
<!DOCTYPE struts PUBLIC
 “-//Apache Software Foundation//DTD Struts Configuration 2.0//EN”
 
<struts>
        <constant name= “struts.devMode” value =“true” />
        <package name= “basicstruts2” extends =“struts-default”>
               <action name= “index”>
                      <result> /index.jsp</result >
               </action>
        </package>
</struts>
จากตัวอย่างที่ 2
  • action name index จะทำการ render หน้า index.jsp (ตามรูปที่ 6 ถูกสร้างตั้งแต่ตอนสร้างโปรเจ็ค) เมื่อมีการเรียก action นี้
ให้เรา deploy web application ไปยัง Tomcat server ที่เรา set ไว้ตั้งแต่ series 4 (Java Programming Bookstore Application (Series 4): Building Web Applications Using Servlets and JSP)
ก่อน run project ให้เรา คลิกเมาส์ขวาที่ไฟล์ pom.xml และเลือก Run As > Maven install ให้สังเกตที่ console tab ตามรูปที่ 11
รูปที่ 10

 

รอจน eclipse download dependency จนสำเร็จตามรูปที่ 11
รูปที่ 11

 

จากนั้นลอง start Tomcat Server แล้วทดสอบกัน http://localhost:8080/helloWorldStruts2/
ได้ผลตามรูปที่ 12
รูปที่ 12
เมื่อได้ผลตามรูปที่ 12 เราก็แน่ใจได้ว่าเรา config ถูกต้องแล้ว ต่อไปเราจะให้ HelloWorld Project ของเราแสดงข้อความยินดีต้อนรับผู้ใช้งานกัน
Java Programming Bookstore Appication (Series 5.1): Building a Web Application Using Struts 2
ตอนต่อไปติดตามได้ที่
Java Programming Bookstore Appication (Series 5.1): Building a Web Application Using Struts 2
Java Programming Bookstore Application (Series 6): Building Java Web Applications with Spring Web MVC
Java Programming Bookstore Application (Series 7): Component-Based Web Development Using JSF 2
Java Programming Bookstore Application (Series 8): Rapid Web Development with Grails
Java Programming Bookstore Application (Series 9): Play with Java and Scala
อ้างอิง
 
ผู้เขียน: procodeblog

Java Bookstore(Series 4.1)

จาก Java Programming Bookstore Appication Series 4: Building Web Applications Using Servlets and JSP เราได้ทำการสร้าง Web Project ขึ้นมาใหม่และ setup virtual server กันแล้วต่อไปเราจะเริ่มเขียนโปรแกรมกันแล้วครับ ตามรูปที่ 1 ให้เราเริ่มสร้างไฟล์ Java servlet เพื่อทดสอบก่อนโดยการคลิกเมาส์ขวาที่โฟลเดอร์ src > New > Class จะปรากฏหน้าต่างตามรูปที่ 2
รูปที่ 1

 

จากรูปที่ 2 ให้ตั้งชื่อคลาสนี้ว่า HelloWorld แล้วกดปุ่ม Finish แล้วแก้ไขตาม java code ดังตัวอย่างที่ 1
รูปที่ 2

 

ตัวอย่างที่ 1
package bookstore;
 
import java.io.IOException;
import java.io.PrintWriter;
 
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
/**
 * @author
 *
 */
public class HelloWorld extends HttpServlet {
 
        /**
        *
        */
        private static final long serialVersionUID = 5554359782034597552L;
 
        @Override
        protected void doGet(HttpServletRequest req, HttpServletResponse response)
                      throws ServletException, IOException {
 
               try {
                     response.setContentType( “text/html”);
                     PrintWriter printWriter = response.getWriter();
                     printWriter.println( “<h2>”);
                     printWriter.println( “Hello World”);
                     printWriter.println( “</h2>”);
              } catch (IOException ioException) {
                     ioException.printStackTrace();
              }
       }
}
จากนั้นให้แก้ไขไฟล์ web.xml ตามตัวอย่างที่ 2
ตัวอย่างที่ 2
<?xml version= “1.0” encoding =“UTF-8”?>
        xmlns= http://java.sun.com/xml/ns/javaee&#8221;
        id= “WebApp_ID” version =“3.0”>
        <display-name> bookstore hello world</display-name >
        <servlet>
               <servlet-name> bookstore</servlet-name >
               <servlet-class> bookstore.HelloWorld</servlet-class >
        </servlet>
        <servlet-mapping>
               <servlet-name> bookstore</servlet-name >
               <url-pattern> /hello</ url-pattern>
        </servlet-mapping>
       
        <welcome-file-list>
               <welcome-file> index.html</welcome-file >
               <welcome-file> index.htm</welcome-file >
               <welcome-file> index.jsp</welcome-file >
               <welcome-file> default.html</welcome-file >
               <welcome-file> default.htm</welcome-file >
               <welcome-file> default.jsp</welcome-file >
        </welcome-file-list>
</web-app>
 
จากนั้นทดสอบ start Tomcat server และลองเรียก url ตามนี้ http://localhost:8080/bookstore/hello จะได้ผลตามรูปที่ 3
รูปที่ 3

เราแน่ใจได้แล้วว่าเรา setup ทุกอย่างมาถูกต้องแล้ว จากนี้ก็มาเริ่มสร้าง bookstore application กันสักทีครับ

ให้เรา copy java code จาก stand-alone java application มาที่โปรเจ็ค web ของเราครับ โดย copy ตามรูปที่ 3.1 แล้วมาวางไว้ที่ Java Web Project ที่โฟลเดอร์ src ตามรูปที่ 3.2
รูปที่ 3.1

 

รูปที่ 3.2

 

ลักษณะการทำงานจะมีด้วยกัน 6 step ตามรูปที่ 4 เราจะทำกันไปทีละ step นะครับ
รูปที่ 4 

 

Step 1: Request 

ตามตัวอย่างที่ 3 เราจะเริ่มจาก Deployment Descriptor (web.xml)
ตัวอย่างที่ 3
<?xml version= “1.0” encoding =“UTF-8”?>
        xmlns= http://java.sun.com/xml/ns/javaee&#8221;
        id= “WebApp_ID” version =“3.0”>
        <display-name> bookstore</display-name >
        <servlet>
               <servlet-name> bookstore</servlet-name >
               <servlet-class> bookstore.HelloWorld</servlet-class >
        </servlet>
       
        <servlet>
               <servlet-name> BookServlet</servlet-name >
               <servlet-class> com.apress.bookweb.controller.BookController</servlet-class >
               <init-param>
                      <param-name> base</ param-name>
                      <param-value> /bookstore/books</param-value >
               </init-param>
               <init-param>
                      <param-name> imageURL</ param-name>
                      <param-value> /bookstore/images</param-value >
               </init-param>
               <load-on-startup> 1</ load-on-startup>
        </servlet>
       
        <context-param>
               <param-name> param1</ param-name>
               <param-value> /bookstore/books</param-value >
        </context-param>
        <context-param>
               <param-name> imageURL</ param-name>
               <param-value> /bookstore/images</param-value >
        </context-param>
        <servlet-mapping>
               <servlet-name> BookServlet</servlet-name >
               <url-pattern> /books</ url-pattern>
        </servlet-mapping>
        <servlet-mapping>
               <servlet-name> bookstore</servlet-name >
               <url-pattern> /hello</ url-pattern>
        </servlet-mapping>
        <welcome-file-list>
               <welcome-file> index.html</welcome-file >
               <welcome-file> index.htm</welcome-file >
               <welcome-file> index.jsp</welcome-file >
               <welcome-file> default.html</welcome-file >
               <welcome-file> default.htm</welcome-file >
               <welcome-file> default.jsp</welcome-file >
        </welcome-file-list>
</web-app>
จากตัวอย่างที่ 3
  • url-pattern/books จะถูก map กับ BookServlet ให้สังเกตใน <servlet-mapping> และ BookServlet  ก็ยัง map ไปยัง BookController ใน <servlet> ดังนั้นเมื่อเราเรียก URL (http://localhost:8080/bookstore/books) ผ่าน browser url-pattern/books เป็นการเรียกใช้ BookController นั่นเองครับ
  • <context-param>
Step 2: Access DB via DAO และ Step 3: Set Results
จาก step 1 เมื่อมี rquest url-pattern/books ก็เข้าสู่ส่วนของ Controller นั่นคือ BookController เมธอดแรกที่จะทำงานคือ init() Method ให้เราสร้าง BookController.java ตามรูปที่ 5
ข้อควรระวัง: ต้องแน่ใจว่า Package: ต้องตรงกันใน web.xml (com.apress.bookweb.controller) จากนั้นให้กดปุ่ม Browse… ที่ตรงกับ Superclass จะปรากฏตามรูปที่ 6
รูปที่ 5

 

ให้พิมพ์คลาสที่เราจะใช้เป็น Superclass ซึ่งก็คือ HttpServlet ตามรูปที่ 6 จากนั้นกดปุ่ม OK และปุ่ม Finish
รูปที่ 6

 

เริ่มแก้ไข BookController ตามตัวอย่างที่ 4
ตัวอย่างที่ 4
package com.apress.bookweb.controller;
 
import java.util.List;
 
import javax.servlet.ServletConfig;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
 
import com.apress.books.dao.BookDAO;
import com.apress.books.dao.BookDAOImpl;
import com.apress.books.model.Category;
 
public class BookController extends HttpServlet {
 
        private static final long serialVersionUID = 7182979735084255108L;
 
        @Override
        public void init(ServletConfig config) throws ServletException {
 
               super.init(config);
              BookDAO bookDao = new BookDAOImpl();
              
               // calling DAO method to retrieve bookList from Database
              List<Category> categoryList = bookDao.findAllCategories();
              ServletContext context = config.getServletContext();
              context.setAttribute( “categoryList”, categoryList);
       }
       
}
จากตัวอย่างที่ 4
  • ติดต่อ database ผ่าน DAO ด้วย findAllCategories() โดยใช้ BookDAO
  • set ผลลัพธ์ที่ได้ไปยัง ServletContext เพื่อส่งกลับไปยังหน้า view
Step 4: Dispatch to View ส่งกลับไปยังหน้าเพจ
เมื่อ BookController ทำงานใน init() สำเร็จ servlet container จะเรียก cycle ต่อไปคือ service() (อ่านได้ใน life-cycle ของ Servlet) เมธอด service() จะคอยดัก request ที่เรียกเข้ามาว่าเป็น GET หรือ POST ตามตัวอย่างที่ 5 ใน BookController คลาส
ตัวอย่างที่ 5
@Override
        protected void doGet(HttpServletRequest request,
                     HttpServletResponse response) throws ServletException, IOException {
 
              doPost(request, response);
       }
 
        @Override
        protected void doPost(HttpServletRequest request,
                     HttpServletResponse response) throws ServletException, IOException {
 
              String base = “/jsp/”;
              String url = base + “home.jsp”;
              String action = request.getParameter( “action”);
              String category = request.getParameter( “category”);
              String keyWord = request.getParameter( “keyWord”);
 
               if (action != null) {
                      switch (action) {
                      case “allBooks” :
                           findAllBooks(request, response);
                           url = base + “listOfBooks.jsp”;
                            break;
                      case “category” :
                           findAllBooks(request, response);
                           url = base + “category.jsp?category=” + category;
                            break;
                      case “search” :
                           searchBooks(request, response, keyWord);
                           url = base + “searchResult.jsp”;
                            break;
                     }
              }
 
              RequestDispatcher requestDispatcher = getServletContext()
                           .getRequestDispatcher(url);
 
              requestDispatcher.forward(request, response);
       }
 
        private void searchBooks(HttpServletRequest request,
                     HttpServletResponse response, String keyWord)
                      throws ServletException, IOException {
 
               try {
                     BookDAO bookDao = new BookDAOImpl();
                     List<Book> bookList = bookDao.searchBooksByKeyword(keyWord);
 
                     request.setAttribute( “bookList”, bookList);
 
              } catch (Exception e) {
                     System. out.println(e);
              }
       }
 
        private void findAllBooks(HttpServletRequest request,
                     HttpServletResponse response) throws ServletException, IOException {
 
               try {
                     BookDAO bookDao = new BookDAOImpl();
                     List<Book> bookList = bookDao.findAllBooks();
                     request.setAttribute( “bookList”, bookList);
 
              } catch (Exception e) {
                     System. out.println(e);
              }
       }
จากตัวอย่างที่ 5
  • doPost() method จะถูกเรียกจาก doGet() method อีกที
  • request.getParameter(“XXX”) เป็นการรับค่าจาก request ถ้าไม่พบ parameter ใดๆ ผลลัพธ์จะได้ค่า null
  • requestDispatcher.forward(request, response) เป็นการเรียกไปยังหน้า page ที่ต้องการ
Step 5: View uses Model เป็นขั้นตอนการดึงข้อมูลจาก Model มาแสดงบนหน้า page 
จาก step 4 controller จะทำการเรียกหน้า home.jsp โดย RequestDispatcher ให้เราทำการสร้างหน้า html ต่อไปนี้  home.jsp จะประกอบด้วย leftColumn.jsp ซึ่งเป็นส่วนเมนู และ header.jsp
จากรูปที่ 7 ให้สร้างหน้า JSP โดยการคลิกเมาส์ขวาที่โฟลเดอร์ WebContent/jsp เลือกเมนู  New > JSP File จะปรากฏหน้าต่างตามรูปที่ 8
รูปที่ 7

 

ให้ตั้งชื่อ File name: เป็น home.jsp และกดปุ่ม Finish (ทำวิธีเดียวกันกับไฟล์ที่เหลือ) จากนั้นให้แก้ไขหน้า home.jsp ตามตัวอย่างที่ 6
รูปที่ 8

 

ตัวอย่างที่ 6 home.jsp
<%@ page language=“java” contentType=“text/html; charset=ISO-8859-1”
        pageEncoding=“ISO-8859-1” %>
<%@page import= “java.util.List”%>
<%@page import= “java.util.ArrayList”%>
<%@page import= “java.util.Iterator”%>
<%@page import= “com.apress.books.model.Book” %>
<!DOCTYPE html >
<%
String imageURL=application.getInitParameter( “imageURL”);
%>
<html>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” />
<meta name= “viewport” content =“width=device-width, initial-scale=1” />
<link rel= “stylesheet” href =“css/bookstore.css” type= “text/css” />
<script type= “text/javascript” src =“js/jquery-1.9.1.js”></ script>
<script src= “js/bookstore.js”></script >
</head>
<body>
        <div id= “centered”>
 
               <jsp:include page= “header.jsp” flush =“true” />
               <br />
               <jsp:include page= “leftColumn.jsp” flush =“true” />
               <span class= “label”>Featured Books </span>
               <table>
                      <tr>
                            <td>< span class =“tooltip_img1”>< img
                                          src= <%=imageURL %>/A9781430248064-small_3.png” /></ span></td >
                            <td>< img src= <%=imageURL %>/A9781430239963-small_1.png” /></ td>
                            <td>< img src= <%=imageURL %>/A9781430247647-small_3.png” /></ td>
                            <td>< img src= <%=imageURL %>/A9781430231684-small_8.png” /></ td>
                            <td>< img src= <%=imageURL %>/A9781430249474-small_1.png” /></ td>
                      </tr>
                      <tr>
                            <td>< img src= <%=imageURL %>/A9781430248187-small_1.png” /></ td>
                            <td>< img src= <%=imageURL %>/A9781430243779-small_2.png” /></ td>
                            <td>< img src= <%=imageURL %>/A9781430247401-small_1.png” /></ td>
                            <td>< img src= <%=imageURL %>/A9781430246596-small_1.png” /></ td>
                            <td>< img src= <%=imageURL %>/A9781430257349-small_1.png” /></ td>
                      </tr>
               </table>
        </div>
</body>
</html>
จากตัวอย่างที่ 6
  • <jsp:include> tag ช่วยให้เราสามารถเรียกใช้ไฟล์ jsp อื่นๆได้ เช่นในตัวอย่างจะเป็นการดึง jsp ที่ทำหน้าที่เมนู leftColumn.jsp ซึ่งสามารถใช้ เทคนิคนี้ในการ reuse ไฟล์ jsp ได้ลดการซ้ำซ้อนของ code ส่วนของเมนู ดูได้จากตัวอย่างที่ 7
ตัวอย่างที่ 7 leftColumn.jsp
<%@page language= “java” contentType =“text/html”%>
<%@page import= “java.util.Enumeration” %>
<%@page import= “java.util.Hashtable”%>
<%@page import= “java.util.List”%>
<%@page import= “java.util.ArrayList”%>
<%@page import= “java.util.Iterator”%>
<%@page import= “com.apress.books.model.Book” %>
<%@page import= “com.apress.books.model.Category” %>
<%
       String param1 = application.getInitParameter( “param1”);
%>
 
<link rel= “stylesheet” href =“css/bookstore.css” type= “text/css” />
<script src= “js/bookstore.js” type =“text/javascript”></ script>
<script type= “text/javascript” src =“js/jquery-1.9.1.js”></ script>
</head>
<div class= “leftbar”>
        <ul id= “menu”>
               <li>< div>
                            <a class= “link1” href =<%=param1%> > <span class=“label”
                                   style=” margin-left: 15px ;”> Home</ span>
                            </a>
                      </div></ li>
               <li>< div>
                            <a class= “link1” href= <%=param1 %>?action=allBooks”>< span
                                   style=” margin-left: 15px ;” class =“label”> All Books</span></ a>
                      </div></ li>
               <li>< div>
                            <span class= “label” style =”margin-left : 15px;”> Categories</span >
                      </div>
                      <ul>
                            <%
                                  // comment 1
                                  List<Category> categoryList1 = (List<Category>) application
                                                .getAttribute( “categoryList”);
                                  Iterator<Category> iterator1 = categoryList1.iterator();
 
                                  // comment 2
                                   while (iterator1.hasNext()) {
                                         Category category1 = (Category) iterator1.next();
                            %>
                            <li>< a class =“label”
                                   href= <%=param1 %>?action=category&categoryId=<%= category1.getId()%>&category= <%=category1.getCategoryDescription() %>>< span
                                          class= “label” style =”margin-left : 30px;”> <%=category1.getCategoryDescription() %></span ></a>
                            </li>
                            <%
                                  }
                            %>
                      </ul></ li>
               <li>< div>
                            <span class= “label” style =”margin-left : 15px;”>Contact Us</span>
 
                      </div></ li>
        </ul>
        <form class= “search”>
               <input type= “hidden” name =“action” value= “search” /> < input id=“text”
                      type= “text” name =“keyWord” size= “12” /> < span
                      class= “tooltip_message”>?</span >
               <p />
               <input id= “submit” type =“submit” value= “Search” />
        </form>
 
 
</div>
 
จากตัวอย่างที่ 7
 
  • ให้สังเกตที่ comment 1 เราจะได้รับรายการ category มาจาก ServletContext ซึ่งส่งมาจาก step 2 นั่นเอง
  • comment 2 เป็นการวนเพื่อดึงข้อมูลมาจาก model และนำผลที่ได้มาแสดงบน page
  • จากตัวอย่างของตัวอย่างนี้การฝั่ง java code ใน JSP (scriptlets และ expressions) เป็นสิ่งที่ไม่ควรทำซึ่งผมจะอธิบายต่อไปในเรื่องของการใช้ JSTL และ EL  
ตัวอย่างที่ 8 header.jsp
<%@ page language=“java” contentType=“text/html; charset=ISO-8859-1”
        pageEncoding=“ISO-8859-1” %>
 
<div class= “header”>
        <h2>
               <span style=” margin-left: 15px ; margin-top : 15px; “ class=“label” >BOOK
                      <span style=  color: white;”> STORE</ span></span >
        </h2>
</div>
 
ตัวอย่างที่ 9 list.jsp
<%@ page language=“java” contentType=“text/html; charset=ISO-8859-1”
        pageEncoding=“ISO-8859-1” %>
<%@page import= “java.util.List”%>
<%@page import= “java.util.ArrayList”%>
<%@page import= “java.util.Iterator”%>
<%@page import= “com.apress.books.model.Book” %>
<%@page import= “com.apress.books.model.Author” %>
 
<!DOCTYPE html >
<html>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=ISO-8859-1”>
</head>
<body>
        <%
                     String category = request.getParameter( “category”);
               if(category != null){
               %>
        <div>
               <span class= “label” style =”margin-left : 15px;”> List of <%= category%>
                     Books
               </span>
        </div>
 
        <%} %>
        <table id= “grid”>
               <thead>
                      <tr>
                            <th id= “th-title”>Book Title </th>
                            <th id= “th-author”>Author</th >
                      </tr>
               </thead>
 
 
               <tbody>
                      <%
        List<Book> books = (List<Book>)request.getAttribute(“bookList”);
        Iterator<Book> iterator = books.iterator();
 
        while (iterator.hasNext()) {
          Book book = (Book)iterator.next();
          Long bookId = book.getId();
          List<Author> authors = book.getAuthors();
        
       
  %>
                      <tr>
                            <th scope= “row” id=“r100” ><%=book.getBookTitle() %></th >
                            <% for (Author author: authors){
                                          if ( book.getId().equals(author.getBookId())){
 
                                           %><td ><%=author.getFirstName()+ ”  “ +author.getLastName()%> </td>
 
                            <% }} %>
                      </tr>
 
                      <%
          }
       
       
  %>
 
               </tbody>
 
        </table>
</body>
</html>
 
ตัวอย่างที่ 10 listOfBooks.jsp
<%@ page language=“java” contentType=“text/html; charset=ISO-8859-1”
        pageEncoding=“ISO-8859-1” %>
<%@page import= “java.util.List”%>
<%@page import= “java.util.ArrayList”%>
<%@page import= “java.util.Iterator”%>
<%@page import= “com.apress.books.model.Book” %>
<!DOCTYPE html >
<%
String imageURL=application.getInitParameter( “imageURL”);
%>
<html>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” />
<meta name= “viewport” content =“width=device-width, initial-scale=1” />
<script src= “js/jquery-1.9.1.js”></script >
<link rel= “stylesheet” href =“css/bookstore.css” type= “text/css” />
<script src= “js/bookstore.js” type =“text/javascript”></ script>
 
</head>
 
<body>
        <div id= “centered”>
 
               <jsp:include page= “header.jsp” flush =“true” />
               <br />
               <jsp:include page= “leftColumn.jsp” flush =“true” />
               <div>
                      <span class= “label” style =”margin-left : 15px;”>List of All
                           Books </span>
               </div>
 
 
               <jsp:include page= “list.jsp” flush =“true” />
 
 
        </div>
 
 
</body>
</html>
ตัวอย่างที่ 11 category.jsp
<%@ page language=“java” contentType=“text/html; charset=ISO-8859-1”
        pageEncoding=“ISO-8859-1” %>
<%@page import= “java.util.List”%>
<%@page import= “java.util.ArrayList”%>
<%@page import= “java.util.Iterator”%>
<%@page import= “com.apress.books.model.Book” %>
<%@page import= “com.apress.books.model.Author” %>
 
<!DOCTYPE html >
<html>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” />
<meta name= “viewport” content =“width=device-width, initial-scale=1” />
<script src= “js/jquery-1.9.1.js”></script >
<link rel= “stylesheet” href =“css/bookstore.css” type= “text/css” />
<script src= “js/bookstore.js”></script >
 
 
</head>
<body>
        <div id= “centered”>
               <jsp:include page= “header.jsp” flush =“true” />
               <br />
               <jsp:include page= “leftColumn.jsp” flush =“true” />
               <%
                     String category = request.getParameter( “category”);
                     String categoryId = request.getParameter( “categoryId”);
                      if (category != null) {
               %>
               <div>
                      <span class= “label” style =”margin-left : 15px;”>List of <%=category%> Books
                      </span>
               </div>
 
               <%
                     }
               %>
               <table id= “grid”>
                      <thead>
                            <tr>
                                   <th id= “th-title”>Book Title </th>
                                   <th id= “th-author”>Author</th >
                            </tr>
                      </thead>
                      <tbody>
                            <%
                                  List<Book> books = (List<Book>) request.getAttribute(“bookList” );
                                                Iterator<Book> iterator = books.iterator();
                                                 while (iterator.hasNext()) {
                                                       Book book = (Book) iterator.next();
                                                        if (book.getCategoryId().toString().equals(categoryId)) {
                                                              Long bookId = book.getId();
                                                              List<Author> authors = book.getAuthors();
                            %>
                            <tr>
                                   <th scope= “row” id=“r100” ><%=book.getBookTitle() %></th >
                                   <%
                                          for (Author author : authors) {
                                                                                   if (book.getId().equals(author.getBookId())) {
                                   %><td ><%=author.getFirstName() + ”  “
                                                              + author.getLastName()%></td >
 
                                   <%
                                         }
                                                                           }
                                   %>
 
                            </tr>
 
                            <%
                                  }
                                                }
                            %>
                      </tbody>
 
               </table>
        </div>
</body>
</html>
 
 
ตัวอย่างที่ 12 searchResult.jsp
<%@ page language=“java” contentType=“text/html; charset=ISO-8859-1”
        pageEncoding=“ISO-8859-1” %>
<%@page import= “java.util.List”%>
<%@page import= “java.util.ArrayList”%>
<%@page import= “java.util.Iterator”%>
<%@page import= “com.apress.books.model.Book” %>
<!DOCTYPE html >
<html>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” />
<meta name= “viewport” content =“width=device-width, initial-scale=1” />
<script src= “js/jquery-1.9.1.js”></script >
<link rel= “stylesheet” href =“css/bookstore.css” type= “text/css” />
<script src= “js/bookstore.js”></script >
</head>
 
<body>
        <div id= “centered”>
 
               <jsp:include page= “header.jsp” flush =“true” />
               <br />
               <jsp:include page= “leftColumn.jsp” flush =“true” />
 
               <jsp:include page= “list.jsp” flush =“true” />
 
 
 
        </div>
 
 
</body>
</html>
 
 
Step 6: Response ส่งกลับแสดงยัง Browser
ซึ่ง JSP เหล่านี้จะถูก render ด้วย browser นั่นเอง
 
หน้า Home Page
 
ผลลัพธ์ที่ได้ตามรูปที่ 9 (อย่าลืม copy โฟลเดอร์ css, images, js ไว้ในโฟลเดอร์ WebContent)
 
รูปที่ 9 

 

 
เมื่อเลือกเมนู Categories จะได้ผลตามรูปที่ 10
รูปที่ 10

 

การค้นหาโดย Keyword
เมื่อพิมพ์ Keyword ลงใน textbox เช่นคำว่า Josh จะได้ผลตามรูปที่ 11
รูปที่ 11

 

เพิ่มเติม
ก่อน run ให้ copy ไฟล์ mysql-connector-java-5.1.33-bin.jar (MySQL Connector/J) ไปวางที่ Tomcat Home > โฟลเดอร์ lib

 

ตอนต่อไปติดตามได้ที่
Java Programming Bookstore Appication (Series 5): Building a Web Application Using Struts 2
Java Programming Bookstore Application (Series 6): Building Java Web Applications with Spring Web MVC
Java Programming Bookstore Application (Series 7): Component-Based Web Development Using JSF 2
Java Programming Bookstore Application (Series 8): Rapid Web Development with Grails
Java Programming Bookstore Application (Series 9): Play with Java and Scala
อ้างอิง
 
ผู้เขียน: procodeblog

Java Bookstore(Series 4)

Java Programming Bookstore Application (Series 4): Building Web Applications Using Servlets and JSP

ใน series ต่อไปนี้จะได้พบกับการเขียน web layer เพื่อเป็น client ที่จะมาเรียกใช้ data access layer ตามรูปที่ 1
รูปที่ 1
แต่ในการเขียน real world application นั้น ควรจะเพิ่ม service layer สำหรับการติดต่อกับ database และคอยตรวจจับ database exception เพื่อรองรับการเติบโตของระบบซึ่งจะทำให้ระบบสามารถแยกการทำงานได้ง่ายขึ้น เช่น การเขียน web application แบบ 3-tier อาจจะได้กล่าวต่อไปในอนาคต แต่ series นี้เราจะเขียน web application แบบง่ายๆ 2-tier
เริ่มจากส่วนของ Home Page ตามรูปที่ 2 เป็นหน้าตาของ home page ของเราซึ่งเมนูด้านซ้ายจะแสดงข้อมูลประเภทหนังสือที่ดึงข้อมูลมาจาก database
รูปที่ 2


ส่วนรูปที่ 3 เราแสดง MVC Architecture ของระบบที่เราจะพัฒนาขึ้น จากรูปที่ 3 เป็นตัวอย่างของการดึงข้อมูลมาแสดงบนหน้า home page สามารถอธิบายคร่าวๆได้ว่า MVC Architecture นั้นก็คือ M คือ Model จากรุปที่ 3 จะเป็น Category และ V คือ View จะใช้สำหรับแสดงข้อมูล เช่น home.jsp และ C คือ Controller โดยมี BookController ทำหน้าที่ ซึ่งลักษณะการทำงานจะมีด้วยกัน 6 step ตามรูปที่ 3
รูปที่ 3
ให้ลง Eclipse IDE ก่อนนะครับ ตามลิงค์นี้(การพัฒนาโปรแกรม Java ด้วย Eclipse IDE Windows 64-bit) เราจะได้ทดลองสร้าง web application กัน โดยเราจะใช้ Tomcat 7 เป็นทั้ง HTTP server และ servlet container ดังนั้นเราก็ต้อง download Tomcat 7 กันก่อนเลย ตามลิงค์นี้ และ install Tomcat 7 (7 ขั้นตอนการ install Tomcat 7 บน Windows 7 (64 bit))
จากนั้น เปิด Eclipse IDE ขึ้มาเลยครับแล้วไปที่เมนูและเลือก Window > Preferences จะได้หน้าต่างตามรูปที่ 4 จากนั้นให้เลือกเมนู Java > Installed JREs และให้ตรวจสอบ JRE8 หรือ JDK8 ว่าได้ install แล้วหรือยัง (ถ้ายังให้ทำตามลิงค์นี้ การ Setup Development Environment สำหรับ Java Developer) กรณีที่ไม่พบ JRE8 เหมือนรูปที่ 4 ให้ กดปุ่ม Add และก็ไปเลือกไฟล์ตามรูปที่ 5
รูปที่ 4
เมื่อเลือก path แล้วให้กดปุ่ม Finish ได้เลย
รูปที่ 5
เริ่มสร้าง Java web Project กันเลยให้เลือก เมนู File > New > Project… ตามรูปที่ 6 จะได้หน้าต่างตามรูปที่ 7 ขึ้นมา
รูปที่ 6
จากนั้นให้เลือกโฟลเดอร์ Web > Dynamic Web Project แล้วกดปุ่ม Next >
จะปรากฏหน้าจอขึ้นมาให้ตั้งชื่อ project ว่า bookstore และเลือกตามรูปที่ 7.1
รูปที่ 7
จากรุป 7.1 เมื่อตั้งชื่อ Project name ให้เลือก Target runtime ถ้าไม่พบข้อมูลให้กดปุ่ม New Runtime… และทำตามขั้นตอนตามลิงค์นี้
รูปที่ 7.1
เมื่อได้แล้วให้กดปุ่ม Finish ให้รอตามรูปที่ 8
รูปที่ 8
Eclipse IDE จะปรากฏหน้าจอถามเกี่ยวกับการเลือก view project เป็นรูปแบบ Java EE หรือไม่ให้กดปุ่ม Yes
รูปที่ 9
เราจะได้โครงสร้าง project ตามรูปที่ 10 ครับ
รูปที่ 10
ก่อนจะเริ่มเขียนโปรแกรม เราจะทำการสร้าง virtual web server บน IDE กันก่อนโดยคลิกที่ลิงค์ตรง tap Servers ที่อยู่ด้านล่างตามรูปที่ 11
รูปที่ 11

เมื่อคลิกลิงค์จะปรากฏหน้าต่างตามรูปที่ 12 ให้เลือก Tomcat version ที่เรา install แล้วกดปุ่ม Finish

รูปที่ 12
ตามรูปที่ 13 ให้เราเลือก bookstore และกดปุ่ม Add > แล้วกดปุ่ม Finish
รูปที่ 13
จะปรากฏ server ขึ้นมาใน Tab Servers ให้ทดสอบด้วยการคลิกเมาส์ขวาและเลือกเมนู Start
รูปที่ 14

จากรูปที่ 15 คือผลการ Start

รูปที่ 15
ตอนต่อไปติดตามได้ที่
Java Programming Bookstore Application (Series 4.1): Building Web Applications Using Servlets and JSP
Java Programming Bookstore Application (Series 5): Building a Web Application Using Struts 2
Java Programming Bookstore Application (Series 6): Building Java Web Applications with Spring Web MVC
Java Programming Bookstore Application (Series 7): Component-Based Web Development Using JSF 2
Java Programming Bookstore Application (Series 8): Rapid Web Development with Grails
Java Programming Bookstore Application (Series 9): Play with Java and Scala
อ้างอิง
ผู้เขียน: procodeblog

ขั้นตอนการ Set Target Runtime บน Eclipse IDE

เมื่อเราทำการสร้าง Dynamic Web Project เราสามารถสร้าง virtual server ที่ทำให้เราสามารถรัน Project เราได้ผ่าน IDE โดยการตั้งค่าที่ Target runtime ถ้าไม่พบให้กดปุ่ม New Runtime… ซึ่งในบทความนี้จะใช้ Tomcat เป็น web server เมื่อเรากดปุ่ม New Runtime… จะปรากฏหน้าต่างตามรูปที่ 1.1
รูปที่ 1

 

จากรูปที่ 1.1 จะเห็นรายการ tomcat version ต่างๆให้เลือก version เดียวกับที่เราได้ install ไว้ (ขั้นตอนการ install tomcat) ในบทความนี้จะใช้ Apache Tomcat v7.0
เมื่อเลือกแล้วให้กดปุ่ม Next > จะปรากฏตามรูปที่ 2
รูปที่ 1.1
ตามรูปที่ 2 ให้เรา กดปุ่ม Browser ไปที่ path ที่เราได้ install Tomcat ไว้จะได้ตามรูปที่ 2.1
รูปที่ 2
ให้เลือก JRE version ที่เรา install ไว้จากนั้นกดปุ่ม Finish
รูปที่ 2.1
ผู้เขียน: procodeblog

Java Bookstore(Series 3)

Java Programming Bookstore Appication (Series 3): Client for the Data Access Layer

จาก Series 2 เราจะมี data access layer พร้อมแล้วซึ่งใน series นี้เราจะเขียน client เพื่อทดสอบ data access layer กันด้วย stand-alone Java application โดยใน series ถัดไป (ยังไม่รู้ series ไหนนะ ^^) เราจะแทนที่ด้วย Java Web Application เรามาเริ่มเขียน stand-alone Java app กันเลย ให้เราสร้างคลาสชื่อ BookApp ในโปรเจ็คเดียวกับ Series 2 แล้วเขียน java code ตามตัวอย่างที่ 1

ตัวอย่างที่ 1 Stand-Alone Bookstore Java App
package com.apress.books.client;
import java.util.List;
import com.apress.books.dao.BookDAO;
import com.apress.books.dao.BookDAOImpl;
import com.apress.books.model.Book;
public class BookApp {
        private static BookDAO bookDao = new BookDAOImpl();
        public static void main(String[] args) {
               // List all books
              System. err.println(“Listing all Books:” );
               findAllBooks();
              System. out.println();
               // search book by keyword
              System. err.println(“Search book by keyword in book title : Groovy:”);
               searchBooks(“Groovy”);
              System. out.println();
              System. err.println(“Search book by keyword in author’s name : Josh:”);
               searchBooks(“Josh”);
       }
        private static void searchBooks(String keyWord) {
              List<Book> books = bookDao.searchBooksByKeyword(keyWord);
               for (Book book : books) {
                     System. out.println(book);
              }
       }
        private static void findAllBooks() {
              List<Book> books = bookDao.findAllBooks();
               for (Book book : books) {
                     System. out.println(book);
              }
       }
}
เราจะได้โครงสร้าง stand-alone Java application ตามรูปที่ 1
รูปที่ 1

ก่อนจะเริ่มเราต้องแน่ใจก่อนว่าได้มีการ add jar file เข้า Project แล้วลองทำตามขั้นตอนเลยครับ ตามรูปที่ 1.1 หลังจากเรา install MySQL Connector J ให้ไปตาม Path ตามรูป
รูปที่ 1.1




ไปที่ Java Project ครับแล้วคลิกขวาตามรูปที่ 1.2 แล้วเลือกเมนู Configure Build Path…
รูปที่ 1.2
จะขึ้นหน้าต่างตามรูปที่ 1.3 มาให้กดปุ่ม Add External JARs…
รูปที่ 1.3
ให้เราเลือกไฟล์ mysql-connector-java-x.x.xx-bin.jar ตามรูปที่ 1.4 แล้วกดปุ่ม open
รูปที่ 1.4
เราจะเห็นไฟล์ที่ add เข้ามาตามรูปที่ 1.5 จากนั้นกดปุ่ม OK
รูปที่ 1.5
จากนั้นลอง run ได้เลยตามรูปที่ 2 ให้คลิกขวาที่ไฟล์ BookApp.java และเลือก Run As > Java Application
อย่าลืม Start MySQL Server นะครับ
รูปที่ 2
ผลที่ได้จากการ run ตามรูปที่ 3 ครับ พบปัญหา ถามได้ครับ
รูปที่ 3
ใน series ต่อไปจะได้พบกับ การเขียน web layer เพื่อเป็น client ที่จะมาเรียกใช้ data access layer
ตอนต่อไปติดตามได้ที่
Java Programming Bookstore Appication (Series 4): Building Web Applications Using Servlets and JSP
Java Programming Bookstore Appication (Series 5): Building a Web Application Using Struts 2
Java Programming Bookstore Application (Series 6): Building Java Web Applications with Spring Web MVC
Java Programming Bookstore Application (Series 7): Component-Based Web Development Using JSF 2
Java Programming Bookstore Application (Series 8): Rapid Web Development with Grails
Java Programming Bookstore Application (Series 9): Play with Java and Scala
อ้างอิง
ผู้เขียน: procodeblog

Java Bookstore(Series 2)

Java Programming Bookstore Appication (Series 2): Data Access Layer for the Bookstore Application

ก่อนเริ่มตอนนี้ควรไปติดตั้งและสร้าง database ก่อนนะครับ ตามลิงค์นี้ Series 1  เมื่อพร้อมแล้วก็เริ่มกันเลย ใน series 2 เราจะสร้าง data access layer กัน ซึ่งใน layer นี้มีหน้าที่หลักในการรับหรือส่งค่าจาก database ผ่าน JDBC และนำข้อมูลที่ได้มา map เป็น Java objects  ซึ่งทำหน้าที่เป็น domain objects หน้าที่หลักของ data access layer คือคอยเป็นตัวกลางในการเก็บค่าหรือรับค่าจาก database จากตัวอย่างในรูปที่ 1 เป็นรูปแสดงการใช้ data access object (DAO) pattern สามารถช่วยให้เราเปลี่ยนรูปแบบของ data access layer ได้ง่ายขึ้น เช่น จาก JDBC ไปเป็น ORM (Hibernate, JPA หรืออื่น) โดยเราไม่ต้องแก้ไขฝั่ง client เลย

รูปที่ 1
อย่างแรกที่เราต้องทำคือสร้าง domain objects ขึ้นมาก่อนได้แก่ Book, Author, Category domain สามารถใช้ Eclipse IDE ในการสร้างได้ครับ (การพัฒนาโปรแกรม Java ด้วย Eclipse IDE)
ให้เราเปิด Eclipse IDE ขึ้นมาครับจากนั้นก็สร้าง Java project ใหม่ขึ้นมาโดยตั้งชื่อ project ว่า books
ให้สร้างไฟล์ class ขึ้นมาชื่อว่า Category ตามรูปที่ 2
รูปที่ 2
และเขียน java code ตามตัวอย่างที่ 1
ตัวอย่างที่ 1 Model: Category (Category.java)
package com.apress.books.model;
package com.apress.books.model;
public class Category {
        private Long id ;
        private String categoryDescription ;
        public Long getId() {
               return id ;
       }
        public void setId(Long id) {
               this.id = id;
       }
        public String getCategoryDescription() {
               return categoryDescription ;
       }
        public void setCategoryDescription(String categoryDescription) {
               this.categoryDescription = categoryDescription;
       }
        public String toString() {
               return “Category – Id: ” + id + “, Category Description: “
                           + categoryDescription;
       }
}
และทำเหมือนกันกับรูปที่ 2 โดยสร้าง class ชื่อว่า Author และ Book โดยเขียน java code ตามตัวอย่างที่ 2 และ 3
ตัวอย่างที่ 2 Model: Author (Author.java)
package com.apress.books.model;
public class Author {
        private Long id ;
        private Long bookId ;
        private String firstName ;
        private String lastName ;
        public Long getId() {
               return id ;
       }
        public void setId(Long id) {
               this.id = id;
       }
        public Long getBookId() {
               return bookId ;
       }
        public void setBookId(Long bookId) {
               this.bookId = bookId;
       }
        public String getFirstName() {
               return firstName ;
       }
        public void setFirstName(String firstName) {
               this.firstName = firstName;
       }
        public String getLastName() {
               return lastName ;
       }
        public void setLastName(String lastName) {
               this.lastName = lastName;
       }
        public String toString() {
               return “Author – Id: ” + id + “, Book id: ” + bookId + “, First Name: “
                           + firstName + “, Last Name: ” + lastName ;
       }
}
ตัวอย่างที่ 3 Model: Book (Book.java)
package com.apress.books.model;
import java.util.List;
public class Book {
        private Long id ;
        private Long categoryId ;
        private String bookTitle ;
        private List<Author> authors ;
        private String publisherName ;
        public Long getId() {
               return id ;
       }
        public void setId(Long id) {
               this.id = id;
       }
        public Long getCategoryId() {
               return categoryId ;
       }
        public void setCategoryId(Long categoryId) {
               this.categoryId = categoryId;
       }
        public String getBookTitle() {
               return bookTitle ;
       }
        public void setBookTitle(String bookTitle) {
               this.bookTitle = bookTitle;
       }
        public List<Author> getAuthors() {
               return authors ;
       }
        public void setAuthors(List<Author> authors) {
               this.authors = authors;
       }
        public String getPublisherName() {
               return publisherName ;
       }
        public void setPublisherName(String publisherName) {
               this.publisherName = publisherName;
       }
        public String toString() {
               return “Book – Id: ” + id + “, Book Title: ” + bookTitle ;
       }
}
เมื่อเราได้ domain object แล้วจากนี้เราจะสร้าง interface ง่ายๆกันชื่อว่า BookDAO ซึ่งทำหน้าที่ในการ encapsulates การเข้าถึง database ของ web applicaltion หรือโปรแกรมทางฝั่ง client โดยเขียน java code ตามตัวอย่างที่ 4
ตัวอย่างที่ 4 BookDAO Interface (BookDAO.java)
package com.apress.books.dao;
import java.util.List;
import com.apress.books.model.Book;
import com.apress.books.model.Category;
public interface BookDAO {
        public List<Book> findAllBooks();
        public List<Book> searchBooksByKeyword(String keyWord);
        public List<Category> findAllCategories();
        public void insert(Book book);
        public void update(Book book);
        public void delete(Long bookId);
}
คำอธิบาย
  • findAllBooks() สำหรับดึงข้อมูลหนังสือทั้งหมดจาก database
  • SearchBooksByKeyword(String keyWord) ใช้สำหรับให้ user สามารถค้นหาหนังสือใน database โดยใช้ keyword ในการค้นหาซึ่งอาจจะเป็นชื่อหนังสือ หรือชื่อ หรือนามสกุลผู้เขียนก็ได้
  • findAllCategories() ใช้สำหรับดึงข้อมูลประเภทหนังสือทั้งหมดจาก database
และยังมี methods ที่เหลือที่ใช้สำหรับ CRUD (create, read, update, delete) เมื่อได้ interface จากนั้นเราจะสร้าง java code สำหรับการ implement BookDAO Interface กัน ตามตัวอย่างที่ 5
รูปที่ 3 ตัวอย่างการสร้างคลาสและ implement interface
ตัวอย่างที่ 5 BookDAOImpl
package com.apress.books.dao;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;
import com.apress.books.model.Author;
import com.apress.books.model.Book;
import com.apress.books.model.Category;
public class BookDAOImpl implements BookDAO {
        // comment 1
        static {
               try {
                     Class. forName(“com.mysql.jdbc.Driver”);
              } catch (ClassNotFoundException ex) {
              }
       }
        private Connection getConnection() throws SQLException {
               return DriverManager.getConnection(“jdbc:mysql://localhost:3306/books”,
                            “root”, “password” );
       }
        private void closeConnection(Connection connection) {
               if (connection == null)
                      return;
               try {
                     connection.close();
              } catch (SQLException ex) {
              }
       }
       // comment 1
        public List<Book> findAllBooks() {
              List<Book> result = new ArrayList<>();
              List<Author> authorList = new ArrayList<>();
              String sql = “select * from book inner join author on book.id = author.book_id”;
              Connection connection = null;
               try {
                     connection = getConnection();
                     PreparedStatement statement = connection.prepareStatement(sql);
                     ResultSet resultSet = statement.executeQuery();
                      while (resultSet.next()) {
                           Book book = new Book();
                           Author author = new Author();
                           book.setId(resultSet.getLong( “id”));
                           book.setBookTitle(resultSet.getString( “book_title”));
                           book.setCategoryId(resultSet.getLong( “category_id”));
                           author.setBookId(resultSet.getLong( “book_Id”));
                            author.setFirstName(resultSet.getString( “first_name”));
                           author.setLastName(resultSet.getString( “last_name”));
                           authorList.add(author);
                           book.setAuthors(authorList);
                            book.setPublisherName(resultSet.getString( “publisher”));
                           result.add(book);
                     }
              } catch (SQLException ex) {
                     ex.printStackTrace();
              } finally {
                     closeConnection(connection);
              }
               return result;
       }
        public List<Book> searchBooksByKeyword(String keyWord) {
              List<Book> result = new ArrayList<>();
              List<Author> authorList = new ArrayList<>();
              String sql = new StringBuilder()
                           .append( “select * from book inner join author on book.id = author.book_id”)
                           .append( ” where book_title like ‘%”).append(keyWord.trim())
                           .append( “%'”).append(” or first_name like ‘%” )
                           .append(keyWord.trim()).append( “%'”)
                           .append( ” or last_name like ‘%”).append(keyWord.trim())
                           .append( “%'”).toString();
              Connection connection = null;
               try {
                     connection = getConnection();
                     PreparedStatement statement = connection.prepareStatement(sql);
                     ResultSet resultSet = statement.executeQuery();
                      while (resultSet.next()) {
                           Book book = new Book();
                           Author author = new Author();
                           book.setId(resultSet.getLong( “id”));
                           book.setBookTitle(resultSet.getString( “book_title”));
                            book.setPublisherName(resultSet.getString( “publisher”));
                            author.setFirstName(resultSet.getString( “first_name”));
                           author.setLastName(resultSet.getString( “last_name”));
                           author.setBookId(resultSet.getLong( “book_id”));
                           authorList.add(author);
                           book.setAuthors(authorList);
                           result.add(book);
                     }
              } catch (SQLException ex) {
                     ex.printStackTrace();
              } finally {
                     closeConnection(connection);
              }
               return result;
       }
        public List<Category> findAllCategories() {
              List<Category> result = new ArrayList<>();
              String sql = “select * from category”;
              Connection connection = null;
               try {
                     connection = getConnection();
                     PreparedStatement statement = connection.prepareStatement(sql);
                     ResultSet resultSet = statement.executeQuery();
                      while (resultSet.next()) {
                           Category category = new Category();
                           category.setId(resultSet.getLong( “id”));
                           category.setCategoryDescription(resultSet
                                         .getString( “category_description”));
                           result.add(category);
                     }
              } catch (SQLException ex) {
                     ex.printStackTrace();
              } finally {
                     closeConnection(connection);
              }
               return result;
       }
        public void insert(Book book) {
               // TODO Auto-generated method stub
       }
        public void update(Book book) {
               // TODO Auto-generated method stub
       }
        public void delete(Long bookId) {
               // TODO Auto-generated method stub
       }
}
จากตัวอย่างที่ 5 ในส่วนของ // comment 1 เป็น code สำหรับการใช้งาน JDBC
  • getConnection() เราจะได้ driver implement ของ java.sql.Connection interface ซึ่งใช้ในการ run SQL Statement นั่นเอง เราจำเป็นต้องกำหนด MySQL Connector/J เราสามารถ downloadได้จาก http://dev.mysql.com/downloads/connector/j/ ตามรูปที่ 4
  • closeConnection(Connection connection) ทุกครั้งที่เรียกใช้งานเราต้องทำการเรียกเพื่อปิด connection เนื่องจาก connection แต่ละครั้งที่ทำการเปิดจะกินทรัพากรค่อนข้างสูง ถ้าไม่ปิดหรือลืมปิด connection เหล่านี้อาจจะเป็นเหตุให้ระบบมีปัญหาได้ในที่สุด
  • ส่วน method อื่นๆ คือส่วนที่ได้ implement ตามที่ BookDAO ได้กำหนดไว้ (กลับไปดูคำอธิบายของ BookDAO)
รูปที่ 4
ตอนต่อไปติดตามได้ที่
อ้างอิง
ผู้เขียน: procodeblog