三分鐘教你學會MVC框架——基於java web開發

轉載自;http://www.cnblogs.com/levenyes/p/3290885.html


MVC全名是Model View Controller,是模型(model)-視圖(view)-控制器(controller)的縮寫,一種軟件設計典範,用於組織代碼用一種業務邏輯和數據顯示分離的方法。

                                                                                                                                                                                        ——《百度百科》

      記得我第一次接觸jsp的時候是學校裏面要求我們做課程設計,我和我的小夥伴們就打算模仿一個外賣網站做一個web項目。那時候啥都不懂,什麼HTML啊CSS啊統統不會,更別說JSP了。用jsp的時候也是把幾乎所有的邏輯控件都放到一個jsp裏面,頁面裏充斥着各式各樣的代碼,紛繁雜亂,最後項目修改起來也相當麻煩,結果如何可想而知。

      後來買了本書,在這裏也推薦一下,是臺灣林信良老師的《Servlet&JSP學習筆記》。裏面講解深入淺出,通俗易懂的同時也不會像一些所謂實戰的書籍那樣流於表面,從中,我第一次瞭解到MVC框架,並且在之後的項目中派上用場。

      閒話少說,下面開始手把手教大家如何搭建MVC框架,作爲例子,展示的是一個最簡單的登錄流程。

第一步:創建項目

     創建項目的工具我推薦MyEclipse,因爲不用我們配置Tomcat之類的東西,可以省去不少的功夫,把精力集中到MVC框架的學習當中。創建項目完畢之後,我們可以立刻啓動項目。

啓動項目完畢之後,MyEclipse自帶的瀏覽器會向我們展示這麼一個簡單到不能再簡單的頁面

 

    大家可能會想,爲什麼項目啓動後會展示這麼一個頁面呢?這個頁面又保存在哪裏呢?現在,讓我給大家一一揭曉。(知道箇中原因的讀者請跳過,寫這麼一段是爲了讓初學者更容易理解,見諒!)

    看到項目的文件結構,不難在WebRoot文件夾下找到名爲index.jsp這一文件。瀏覽器所展示的頁面,就是此文件經過處理過後的結果。點開之後,修改<body></body>之間的內容,例如改成This is My MVC project.。重新啓動項目後,告訴我你看到了什麼。

    好了,解決完頁面來源問題之後,接下來就是解答爲什麼會展示這麼一個頁面的問題了。我們點WebRoot文件夾節點,再點擊WEB-INF文件夾節點,找到web.xml文件並且雙擊打開,然後看看裏面的內容——

複製代碼
 1 <?xml version="1.0" encoding="UTF-8"?>
 2 <web-app version="2.5" 
 3     xmlns="http://java.sun.com/xml/ns/javaee" 
 4     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
 5     xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
 6     http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
 7 <!--以上內容暫時不需要理解,如果不明白可跳過-->
 8 
 9     
10   <welcome-file-list>     <!--welcome-file-list開頭-->
11     <welcome-file>index.jsp</welcome-file>   <!--設置歡迎頁面,也就是項目啓動後瀏覽器展示的第一個頁面-->
12   </welcome-file-list>    <!--welcome-file-list結尾-->
13  
14 </web-app>
複製代碼

     看到第11行的代碼中的index.jsp,是不是覺得似曾相識呢?沒錯,它就是我們剛纔一直在討論的那個頁面。這裏設置的就是項目啓動後瀏覽器展示的第一個頁面,讀者可以試着再WebRoot目錄下添加一個HTML文件或JSP文件,然後將這裏的index.jsp改成所添加的文件名,重新啓動項目,你就會發現有什麼東西不一樣了。web.xml文件,用處還不止一點,後面再討論。



前面已經創建完項目了,那麼下面一個步驟就是逐一新建在MVC框架中負責V(視圖)、C(控制器)、M(模型)的對應文件。

第一步:創建項目(已完成)

第二步:新建負責V(視圖)的JSP文件

    在文件夾Web-Root下新建名爲MyJsp.jsp的JSP文件,代碼如下:

 

複製代碼
 1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
 2 <%
 3 String path = request.getContextPath();
 4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
 5 %>
 6 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 7 <html>
 8 <head></head>
 9              <!--對於初學者,上面的代碼都可以暫時不必理會 -->
10 <body>
11     <form action="login.do"  method="post">      <!--所提交的表單,action爲"login.do",發出請求是post-->
12 <p>賬號:<input type="text" name="id" /></p>      <!--所輸入的"賬號"在提交後的標示是"id",下同 -->
13                                                     
14 <p>密碼:<input type="text" name="password" />
15       
16 <p><input type="submit" value="登錄"> </p>           <!--表單提交按鈕,顯示名稱爲"登錄"-->
17     </form>
18   </body>
19 </html>
複製代碼

 

    在創建完之後,記得在web.xml中,將<welcome-file-list>節點中的內容改成上面這個文件的文件名MyJsp.jsp。(建議初學者做完這個步驟之後先運行一遍項目,看看效果如何,再看看有沒有出錯的地方)
    如果運行的效果如下圖,那應該就沒什麼問題了。

      所謂的V(視圖),通俗地來講,就是用戶所看到的內容。具體到這個java web項目,就是用戶所看到的頁面。

第三步:新建負責C(控制器)的Servlet

      首先,要在src目錄下新建一個包,包名爲cc.MyMVC.servlet。然後,再在該包下新建一個servlet文件,名爲MyServlet,代碼如下:

複製代碼
 1 package cc.MyMVC.servlet;
 2 import java.io.IOException;
 3 import javax.servlet.ServletException;
 4 import javax.servlet.http.HttpServlet;
 5 import javax.servlet.http.HttpServletRequest;
 6 import javax.servlet.http.HttpServletResponse;
 7 
 8 import cc.MyMVC.POJO.MyPOJO;
 9 
10 public class MyServlet extends HttpServlet {
11     public MyServlet() {
12         super();
13     }
14     
15     public void destroy() {
16         super.destroy();
17     }
18 
19     public void doGet(HttpServletRequest request, HttpServletResponse response)
20             throws ServletException, IOException {
21     }
22 
23 //以下爲關鍵代碼,初學者只需看此處,其他地方都可以暫且不管
24     public void doPost(HttpServletRequest request, HttpServletResponse response)//處理post請求的方法
25             throws ServletException, IOException {
26         boolean b=false;
27         MyPOJO myPOJO=new MyPOJO();//新建MyPOJO類的對象myPOJO
28         
29         //根據標示名獲取JSP文件中表單所包含的參數
30         String id=request.getParameter("id");
31         String password=request.getParameter("password");
32         
33         b=myPOJO.login(id,password);//使用模型對賬號和密碼進行驗證,返回一個boolean類型的對象
34         
35         if(b){  //如果驗證結果爲真,跳轉至登錄成功頁面
36             response.sendRedirect("LoginSuccessful.jsp");
37         }
38         else {  //如果驗證結果爲假,跳轉至登錄失敗頁面
39             response.sendRedirect("LoginFailed.jsp");
40         }
41         
42     }
43     
44     public void init() throws ServletException {
45     }
46 }
複製代碼

     很不幸,第三步提到的模型(M)還沒有創建,大家可以略過。大家可以看到,這個servlet中doGet方法裏的代碼都被刪光光了,無法處理get請求。而這個對我們這個項目可以說是毫無影響,看到我們第二步創建的jsp文件,會發現表單提交的方式是post請求,所以,我們只需要實現doPost方法就好了,並且這個方法將處理提交的post請求。

     控制器(C)的作用,就是對流程的控制,接收視圖傳來的參數,交由模型進行處理,再根據處理的結果決定下一步的操作。具體到本項目,servlet接收jsp傳來的參數id和password,交由POJO處理,根據返回的boolean結果跳轉到登錄成功(失敗)的頁面。

 

第四步:修改web.xml文件,註冊servlet並且建立action與servlet之間的映射。

    前面說到,MyServlet.servlet會處理提交的請求,那麼,爲什麼servlet會接收到這個請求呢?因爲,我事先修改了web.xml文件,在裏面添加了相應的代碼。web.xml的完整代碼如下:

複製代碼
 1 <?xml version="1.0" encoding="UTF-8"?>
 2 <web-app version="2.5" 
 3     xmlns="http://java.sun.com/xml/ns/javaee" 
 4     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
 5     xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
 6     http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
 7 <!--以上內容暫時不需要理解,如果不明白可跳過-->
 8 
 9   <servlet>
10     <servlet-name>MyServlet</servlet-name><!--定義servlet的名稱 -->
11     <servlet-class>cc.MyMVC.servlet.MyServlet</servlet-class><!--對應servlet所屬的文件名 -->
12   </servlet>
13 
14   <servlet-mapping> <!-- 建立servlet與action之間的映射 -->
15     <servlet-name>MyServlet</servlet-name>  <!-- 映射中servlet的名稱,已定義 -->
16     <url-pattern>/login.do</url-pattern>    <!-- 所對應的action -->
17   </servlet-mapping>
18 <!--以上內容爲新添加的代碼,請重點關注-->
19 
20     
21   <welcome-file-list>     <!--welcome-file-list開頭-->
22     <welcome-file>MyJsp.jsp</welcome-file>   <!--設置歡迎頁面,也就是項目啓動後瀏覽器展示的第一個頁面-->
23   </welcome-file-list>    <!--welcome-file-list結尾-->
24  
25 </web-app>
複製代碼

    看到關於action的那一行XML代碼,是否想到了什麼呢?沒錯,就是jsp表單中所定義的action。試着修改,看看會有什麼效果?

第五步:新建M(模型)的POJO文件

    POJO(Plain Ordinary Java Objects)簡單的Java對象,實際就是普通JavaBeans,是爲了避免和EJB混淆所創造的簡稱。POJO實質上可以理解爲簡單的實體類,顧名思義POJO類的作用是方便程序員使用數據庫中的數據表。——《百度百科》

    首先,在src文件下新建包,包名爲cc.MyMVC.POJO。然後在該包下新建class文件,名爲MyPOJO。

    爲了讓讀者,尤其是初學者更快地理解MVC,而不是將精力耗費在理解POJO以及數據庫操作上面,我將POJO進行了儘可能的簡化。代碼如下:

複製代碼
 1 package cc.MyMVC.POJO;
 2 
 3 public class MyPOJO {
 4     public boolean login(String id,String password){
 5       if(id.equals("admin")&&password.equals("123456")){//判斷用戶名以及密碼是否與設定相符
 6           return true;
 7       }
 8       else return false;
 9     }
10 }
複製代碼

第六步:新建V(視圖)中的另外兩個JSP文件
    在Web-Root文件夾下新建兩個jsp文件,分別命名爲LoginSuccessful.jsp以及LoginFailed.jsp。代碼如下:

複製代碼
 1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
 2 <%
 3 String path = request.getContextPath();
 4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
 5 %>
 6 
 7 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 8 <html>
 9   <head>
10   </head>
11   <body>
12     Login Successful. <br>
13   </body>
14 </html>
複製代碼
複製代碼
 1 <%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
 2 <%
 3 String path = request.getContextPath();
 4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
 5 %>
 6 
 7 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 8 <html>
 9   <head>
10   </head>
11   
12   <body>
13     Login Failed. <br>
14   </body>
15 </html>
複製代碼

第七步:跑項目,看效果

      (1)輸入賬號:admin,密碼:123456 將會跳轉到頁面如下:

     (2)輸入錯誤的賬號或錯誤的密碼,將會跳轉到頁面如下:

      直到這裏,示例項目已經構建和演示完畢了。爲了簡化說明,狠心把許多重要但是對此次說明可能有妨礙的知識點給砍掉了。例如,web.xml爲什麼可以決定歡迎頁,爲什麼可以進行servlet的配置;HTTP中的post請求以及get請求又是什麼樣的?諸如此類,不一而足。再提一下林信良老師的《Servlet&JSP學習筆記》,裏面有更加詳細的講解,強烈推薦!
      MVC框架,主要是對應用的分層,在web項目中尤其流行,算是最基礎的分層模式。初學者可能還不瞭解MVC框架的作用,甚至會覺得這樣做故作高深,最後像我當初那樣,把所有的代碼都擠到一個或幾個jsp文件當中。其實,隨着項目規模的逐漸龐大以及團隊成員的增加,分層的思想不僅有助於分工合作,還增加了項目的伸縮性,降低了測試和debug的工作量和難度。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章