Friday, March 2, 2012

在 Mac 開發 Java EE

雖然這篇文章的標題是說在 Mac 底下,但是實際上開發 Java EE 的環境中看程式碼的部份就好,將他們放到對應的 Apache Tomcat 檔案目錄底下或是 Eclipse 專案底下都是可以正常執行的。本篇內容記錄建置 Java EE 開發環境的安裝以及設定的過程以及 Hello world,所以很明顯是學習筆記吧 :)

底下分為四個部分:分別是 Web 容器和整合 Tomcat,IDE 準備與安裝,簡單範例(驗證環境是否安裝正確)


1. MAMP (Mac, Apache, MySQL, PHP)

它是 Optional,可選可不選,只因為寶尼的 MBP 已經安裝 MAMP 所以想說啟動的同時是否能位它添加 Java 運作必須的 Tomcat,以下是整合 Tomcat 以及 MAMP 的小小操作說明,大致上是來自於參考來源 [1.]。

2. Tomcat
將下載下來的檔案移到 /Application/MAMP/ 底下,接著解壓縮檔案。為了達到開啟 MAMP 也立即運作 Tomcat,必須要找出啟動 MAMP 的 Script 位於哪裡,並且我們可以將修改內容如下:

簡單的 Shell Script
// 啟動
#vi /Applications/MAMP/bin/startApache.sh
// 加入在最後一行
/Applications/MAMP/tomcat/bin/startup.sh

// 關閉
#vi /Applications/MAMP/bin/stopApache.sh
// 增加此行指令
/Applications/MAMP/tomcat/bin/shutdown.sh
/Applications/MAMP/Library/bin/apachectl stop

// 補充刪除可能存在的運作
sleep 2
kill -TERM ps aux | grep [t]omcat | awk '{ print $2}'
sleep 1
kill -9 ps aux | grep [t]omcat | awk '{ print $2}'

3. Eclipse EE

注意是 EE 的版本就好,另外就是簡單又方便的Tomcat 外掛 (Tomcat Launcher plugin)
可以到 http://www.eclipsetotale.com/tomcatPlugin.html 下載

Tomcat Plugin 產生的 Project 也會把 Tomcat 相關的 Web 容器加入 Library 路徑,然後也可以利用 Eclipse Tool 快速重新啟動伺服器,但是不會自動開啟 Eclipse 的內建瀏覽器和專案路徑(可能是沒研究出來!?)基本上,拿來寫 Servlet/JSP 還算不錯用。

4. Hello Servlet/JSP!

目標

建立一個登入頁面,能夠輸入帳號密碼做簡單的判斷,然後自動轉向到登入成功或是失敗的頁面,完成後的登入畫面如下圖所示。



以下實作一個登入頁面,取名稱為 login.jsp

/login.jsp
<%@ page language=\"java\" contentType=\"text/html; charset=UTF-8\" pageEncoding=\"UTF-8\"%>
<!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>Login View</title>
</head>
<body>
 <h1 align=\"center\">Please Login</h1>
 <form method=\"POST\" action=\"Login.do\" align=\"center\">
  <label>&#30331;&#20837;&#21517;&#31281;</label>
  <input type=\"text\" name=\"username\" /><br />
  <label>&#30331;&#20837;&#23494;&#30908;</label>
  <input type=\"password\" name=\"password\" /><br />
  <input type=\"submit\" value=\"&#30331;&#37636;\" />
 </form>
</body>
</html>

畫面呈現如下所示,中文的部份也已經轉換成 unicode,因此直接看擷取圖片即可。例外HelloWorld 是 Project 的名稱,所以 URL 的地方記得打上去正確的大小寫。


表單送出 POST 給 Servlet 交由 Login.do 處理,並且將實作的 Servlet 實作在 LoginAction.java 中。

/WEB-INF/src/LoginAction.java
public class LoginAction extends HttpServlet {
 public void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException {
  String username = request.getParameter("username");
  String password = request.getParameter("password");
  String result = "";
  
  if(!(username.equals("admin") && password.equals("admin"))) {
   result = "Failed";
  } else {
   result = "Hello " + username + ", login success!";
  }
  
  request.setAttribute("styles", result);
  RequestDispatcher view = request.getRequestDispatcher("hello.jsp");
  view.forward(request, response);
 }
}

登入成功或是失敗,都將字串寫到 styles 的屬性之中,供給 JSP 網頁(hello.jsp)作取值的操作,後續分別是登入成功以及失敗的登入畫面。然而 hello.jsp 被導向的頁面又如何撰寫呢?大致上就是把字串放出來而已。

/hello.jsp
<!DOCTYPE html PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\">
<html>
 <head>
  <meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\">
  <title>Hello</title>
 </head>
 <body>
  <h1 align=\"center\">Login Result</h1>
  <p align=\"center\">
  <% 
   String result = (String)request.getAttribute(\"styles\");
   out.print(\"<br/>Result: \"+ result);
  %>
  </p>
 </body>
</html>

登入成功

以及失敗的畫面。


但是藉由 Client 端請求的動作 login.do 要如何讓 Server 知道要去找哪一個對應的 Function 去處理就必須在一個很重要的 web.xml 檔案作設定。

/WEB-INF/web.xml
<?xml version=\"1.0\" encoding=\"UTF-8\"?>
<web-app version=\"3.0\" xmlns=\"http://java.sun.com/xml/ns/javaee\"
xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\"
xsi:schemaLocation=\"http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd\">
    <servlet>
        <servlet-name>LoginAction</servlet-name>
        <servlet-class>LoginAction</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>LoginAction</servlet-name>
        <url-pattern>/Login.do</url-pattern>
    </servlet-mapping>
</web-app>

範例主要實作表單 POST 給後端驗證,是一個簡單的 Servlet 應用,至於 Login.do 的原因是給我們辨識之用 Login.action 或是其他都是可行,唯獨 Java EE 人們慣用 .do 和 .action,日後若使用 Struts Framework 也還會再利用這兩個做細分。


參考來源

[1.] Add Tomcat into MAMP (Not MAMP Pro) 
[2.] 良葛格 Gossip:ServletJSP

No comments:

Post a Comment