{{{
#!html
jsp + servlet + javabean
教材1
}}}
[[PageOutline]]
本篇為此電子書（2開發簡單的servlet&jsp）的實做練習
* [http://secuse.nchc.org.tw/jspservlet/jspservlet%e5%88%9d%e9%9a%8e.pdf 下載 pdf 手冊][[BR]]
= 零. 下載資源 =
== 1.A 用 virtualbox 虛擬機器 ==
[http://secuse.nchc.org.tw/jspservlet/u1004.vdi 下載 virtualbox 的硬碟檔]
* 此硬碟檔為ubuntu 10.04 版本，已經調整好教材，請用virtualbox 3.2.2 以上版本掛載
== 1.B 自行下載資源 ==
1. [http://secuse.nchc.org.tw/jspservlet/tomcat-6.0.26.tar.gz 下載tomcat 6.5]
2. [http://secuse.nchc.org.tw/jspservlet/eclipse-SDK-3.5.2-linux-gtk.tar.gz 下載 eclipse 3.5 linux版]
= 範例一 =
* 2.1.1~ 2.1.3 的範例 (p2-1~p2-10)
== 2.0 ==
* 專案目錄將呈現以下結構
|| /opt/tomcat/webapps/servlet1/ || || || || ||
|| + || WEB-INF/ || || || ||
|| || - || web.xml || || ||
|| || + || classes/ || || ||
|| || || - || HelloServlet.java || ||
== 2.1 建立目錄 ==
{{{
cd /opt/tomcat/webapps/
mkdir -p /opt/tomcat/webapps/servlet1/WEB-INF/classes
}}}
== 2.2 第一個程式:HelloServlet.java ==
{{{
cd /opt/tomcat/webapps/servlet1/WEB-INF/classes
gedit HelloServlet.java
}}}
{{{
#!java
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;
public class HelloServlet extends HttpServlet {
protected void doGet(HttpServletRequest request,
HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
String name = request.getParameter("name");
out.println("");
out.println("");
out.println("Hello Servlet");
out.println("");
out.println("");
out.println(" Hello! " + name + " !
");
out.println("");
out.println("");
out.close();
}
}
}}}
== 2.3 編譯:HelloServlet.java檔 ==
{{{
cd /opt/tomcat/webapps/servlet1/WEB-INF/classes
javac -classpath /opt/tomcat/lib/servlet-api.jar ./HelloServlet.java
}}}
== 2.4 製作佈署描述檔:web.xml ==
{{{
cd /opt/tomcat/webapps/servlet1/WEB-INF/
gedit web.xml
}}}
{{{
#!xml
HelloServlet
HelloServlet
HelloServlet
/hello.do
}}}
== 2.5 啟動web容器:tomcat ==
{{{
cd /opt/tomcat
bin/startup.sh
}}}
== 2.6 用瀏覽器測試 ==
[http://localhost:8080/servlet1/hello.do?name=caterpillar]
ps: '''?name=caterpillar''' 可以改成你的名子來測試是否成功
------------
== 練習 ==
如果程式碼的第一行多了package宣告，要如何編譯執行
{{{
#!java
package tw.org.nchc.opsrc;
#其他相同省略~~~
}}}
= 範例二 =
* 此範例對應到手冊 2.1.4 的範例 (p2-10 ~ p2-11)
== 2.1 管理網頁帳號 ==
{{{
gedit /opt/tomcat/conf/web.xml
}}}
{{{
#!xml
}}}
== 2.2 封裝成war檔 ==
{{{
cd /opt/tomcat/webapps/servlet1/
jar cvf ~/servlet1.war *
}}}
此處注意不可 ''cd /opt/tomcat/webapps/ ;jar cvf ~/servlet1.war servlet1/* ''，因為這樣會多一層servlet1的目錄
刪除/opt/tomcat/webapps/servlet1/ 整個專案，再重開tomcat
{{{
rm -rf /opt/tomcat/webapps/servlet1/
/opt/tomcat/bin/shutdown.sh
/opt/tomcat/bin/startup.sh
}}}
先開啟[http://localhost:8080/servlet1/hello.do?name=caterpillar]
網頁錯誤（因為已經被移除掉了）
== 2.3 用管理頁面佈署 war 檔 ==
[http://localhost:8080/manager/html/list]
佈署~/servlet1.war檔（圖形介面難以文字描述）
開啟[http://localhost:8080/servlet1/hello.do?name=caterpillar]
有看到範例一的網頁即完成
== 練習 ==
透過網頁介面，將專案分別進行[[br]]
1. 停止 2. 開啟 3. 移除
= 範例三 =
* 2.2 節 （p2-11~p2-20）
== 3.0 ==
* 專案目錄將呈現以下結構
|| /opt/tomcat/webapps/servlet3/ || || || || ||
|| - || hello.jsp|| || || ||
|| + || WEB-INF/ || || || ||
|| || - || web.xml || || ||
|| || + || classes/ || || ||
|| || || - || HelloServlet.java || ||
|| || || - || Hello.java || ||
== 3.1 建立control:HelloServlet.java ==
{{{
cd /opt/tomcat/webapps/
mkdir -p /opt/tomcat/webapps/servlet3/WEB-INF/classes
cd /opt/tomcat/webapps/servlet3/WEB-INF/classes
gedit HelloServlet.java
}}}
{{{
#!java
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class HelloServlet extends HttpServlet {
private Hello hello;
public HelloServlet() {
hello = new Hello();
}
protected void doGet(HttpServletRequest request,
HttpServletResponse response)
throws ServletException, IOException {
String name = request.getParameter("user");
String message = hello.doHello(name);
request.setAttribute("message", message);
request.getRequestDispatcher("hello.jsp").forward(request, response);
}
}
}}}
== 3.2 建立model:Hello.java ==
{{{
gedit /opt/tomcat/webapps/servlet3/WEB-INF/classes/Hello.java
}}}
{{{
#!java
import java.util.*;
public class Hello {
private Map messages;
public Hello() {
messages = new HashMap();
messages.put("caterpillar", "Hello");
messages.put("Justin", "Welcome");
messages.put("momor", "Hi");
}
public String doHello(String user) {
String message = messages.get(user);
return message + ", " + user + "!";
}
}
}}}
== 3.3 建立view:hello.jsp ==
{{{
gedit /opt/tomcat/webapps/servlet3/hello.jsp
}}}
{{{
#!java
<%@page contentType="text/html" pageEncoding="UTF-8"%>
${param.user}
${message}
}}}
這個jsp檔為servlet所respone的呈現頁
== 3.4 佈署web容器:web.xml ==
{{{
gedit /opt/tomcat/webapps/servlet3/WEB-INF/web.xml
}}}
{{{
#!xml
HelloServlet
HelloServlet
HelloServlet
/hello.do
}}}
注意，HelloServlet 的 url-pattern 可任意命名，但千萬不可命名成 '''''hello.jsp'''''
== 3.5 編譯control與model ==
{{{
cd /opt/tomcat/webapps/servlet3/WEB-INF/classes
javac -cp /opt/tomcat/lib/servlet-api.jar ./Hello.java
javac -cp /opt/tomcat/lib/servlet-api.jar:. ./HelloServlet.java
}}}
上面的步驟順序很重要，並且在編譯HelloServlet 時，classpath 必須引入本身目錄，否則會出現錯誤訊息：找不到Hello這個symbol
== 3.6 重新啟動tomcat ==
{{{
cd /opt/tomcat
bin/shutdown.sh
bin/startup.sh
}}}
== 3.7 測試 ==
比較以下網址的不同處:
[http://localhost:8080/servlet3/hello.do?user=momor][[br]]
[http://localhost:8080/servlet3/hello.do?user=caterpillar][[br]]
[http://localhost:8080/servlet3/hello.do?user=Justin][[br]]
[http://localhost:8080/servlet3/hello.do?user=waue][[br]]
== 練習 ==
改寫程式碼，當輸入 user=rock,passwd=123456時，秀出歐八講的圖片，否則回應帳號密碼錯誤