内包含案例，基于jsp+servlet的：MVC模式计算器；MVC模式登陆
第十一章 Servlet MVC模式
模型-视图-控制器（model-view-controller），简称MVC。MVC是一种先进的设计模式，它的核心思想是有效地组合“视图”、“模型”和“控制器”。掌握MVC模式对于设计合理的Web应用框架有着十分重要的意义。
MVC是一种通过三个不同部分构造一个软件或组件的理想办法：
- l 模型（model）用于存储数据的对象
- l 视图（view）向控制器提交所需数据、显示模型中的数据
- l 控制器（controller）负责具体的业务逻辑操作，即控制器根据视图提出的要求对数据做出处理，将有关结果存储到模型中，并负责让模型和视图进行必要的交互，当模型中的数据变化时，让视图更新显示。
从面向对象的角度看，MVC结构可以使程序更具有对象化特性，也更容易维护和扩展。
在JSP技术中，“视图”、“模型”和“控制器”的具体实现如下：
l 模型 一个或多个Javabean对象，用于存储数据，Javabean主要提供简单的setXXX方法和getXXX方法，在这些方法中不涉及对数据的具体处理细节，以便增强模型的通用性。
l 视图 一个或多个JSP页面，其作用主要是向控制器提交必要的数据和为模型提供数据显示，JSP页面主要使用HTML标记和Javabean标记来显示数据。
l 控制器 一个或多个servlet对象，根据视图提交的要求进行数据处理操作，并将有关的结果存储到Javabean中，然后servlet使用重定向方式请求视图中的某个JSP页面更新显示，即让该JSP页面通过使用Javabean标记显示控制器存储在Javabean中的数据。
JSP开发web项目的两种模型（Model1/Model2)
Model1（JSP+JavaBeans模式）：
- 使用JSP+JavaBeans将页面显示和业务逻辑处理分开
- JSP实现页面显示，响应请求并将结果返回给客户
- JavaBean对象保存数据和实现业务逻辑
优点：实现了页面显示与业务逻辑的分离
缺点：需要在JSP页面控制流程转向并且调用JavaBean代码；业务逻辑复杂时，JSP编写变得复杂
案例
Jsp+javaBeans模式简单计算器：
Calculator.jsp
|
<%@ page language="java" contentType="text/html; charset=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>calculator</title> <script type="text/javascript"> function checkForm(){ // 对需要校验字段 添加 id 属性 var first = document.getElementById("first").value; var second = document.getElementById("second").value; var operator = document.getElementById("operator").value; // 判断参数必须为数字 if(isNaN(first) || isNaN(second)){ // isNaN is not a number alert("输入参数 必须为数字！"); return false; } if(second==0 && operator == '/'){ alert("除数不能为0！"); return false; } } </script> </head> <body> <!-- 计算器页面 -->
<!-- 计算结果 --> <jsp:useBean id="calculator" class="com.silvan.pojo.CalculatorDemo1" scope="page"></jsp:useBean> <!-- 当用户提交form 自动封装 数据 --> <jsp:setProperty property="*" name="calculator"/>
<h3>计算结果是 ：${calculator.firstNum } ${calculator.operator } ${calculator.secondNum } = ${calculator.result }</h3> <hr/> <!-- 计算form表单 --> <h3>简单的计算器</h3> <form action="/lesson11/calculator.jsp" method="post" onsubmit="checkForm();"> <table> <tr> <td>第一个参数</td> <td> <!-- 使用 setProperty * form输入项name 必须和 javabean类属性一致 --> <input type="text" name="firstNum" id="first"/> </td> </tr> <tr> <td>运算符</td> <td> <select name="operator" id="operator"> <option value="+">+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> </td> </tr> <tr> <td>第二个参数</td> <td> <input type="text" name="secondNum" id="second" /> </td> </tr> <tr> <td colspan="2"> <input type="submit" value="计算"/> </td> </tr> </table> </form> </body> </html> |
CalculatorDemo1.java
|
package com.silvan.pojo; /** * 計算類 * @author Administrator */ public class CalculatorDemo1 { private String firstNum = "0"; // 参数一 private String secondNum = "0"; // 参数二 private String operator = "+"; // 运算符 private double result; // 运算结果
public String getFirstNum() { return firstNum; }
public void setFirstNum(String firstNum) { this.firstNum = firstNum; }
public String getSecondNum() { return secondNum; }
public void setSecondNum(String secondNum) { this.secondNum = secondNum; }
public String getOperator() { return operator; }
public void setOperator(String operator) { this.operator = operator; }
public double getResult() { // 将运算逻辑写到这里 Double a = Double.parseDouble(firstNum); Double b = Double.parseDouble(secondNum); Double result = 0.0; if (operator.equals("+")) { result = a + b; } else if (operator.equals("-")) { result = a - b; } else if (operator.equals("*")) { result = a * b; } else if (operator.equals("/")) { result = a / b; } return result; }
public void setResult(double result) { this.result = result; } } |
模型2（MVC模式也就是JSP+JavaBeans+servlet模式）
- 将模型1中JSP嵌入的流程控制和部分逻辑处理代码提取至一个单独的角色：控制器
- 模型2是MVC架构模式在WEB开发中的应用
案例1
JSP中的MVC模式计算器
视图层Calculator.jsp
|
<%@ page language="java" contentType="text/html; charset=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>calculator</title> <script type="text/javascript"> function checkForm(){ // 对需要校验字段 添加 id 属性 var first = document.getElementById("first").value; var second = document.getElementById("second").value; var operator = document.getElementById("operator").value; // 判断参数必须为数字 if(isNaN(first) || isNaN(second)){ // isNaN is not a number alert("输入参数 必须为数字！"); return false; } if(second==0 && operator == '/'){ alert("除数不能为0！"); return false; } } </script> </head> <body> <!-- 计算form表单 --> <h3>简单的计算器</h3> <form action="/lesson11/CalculatorServletDemo2" method="post" onsubmit="checkForm();"> <table> <tr> <td>第一个参数</td> <td> <!-- 使用 setProperty * form输入项name 必须和 javabean类属性一致 --> <input type="text" name="firstNum" id="first"/> </td> </tr> <tr> <td>运算符</td> <td> <select name="operator" id="operator"> <option value="+">+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> </td> </tr> <tr> <td>第二个参数</td> <td> <input type="text" name="secondNum" id="second" /> </td> </tr> <tr> <td colspan="2"> <input type="submit" value="计算"/> </td> </tr> </table> </form> </body> </html> |
控制层CalculatorServletDemo2.java
|
package com.silvan.servlet; import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import com.silvan.pojo.CalculatorDemo2; public class CalculatorServletDemo2 extends HttpServlet { /** * Constructor of the object. */ public CalculatorServletDemo2() { super(); } /** * Destruction of the servlet. <br> */ public void destroy() { super.destroy(); // Just puts "destroy" string in log // Put your code here } /** * The doGet method of the servlet. <br> * * This method is called when a form has its tag value method equals to get. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */ public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //取出计算值 double firstNum = Double.parseDouble(request.getParameter("firstNum")); double secondNum = Double.parseDouble(request.getParameter("secondNum")); String operator = request.getParameter("operator"); double result = 0; //计算结果 if (operator.equals("+")) { result = firstNum + secondNum; } else if (operator.equals("-")) { result = firstNum - secondNum; } else if (operator.equals("*")) { result = firstNum * secondNum; } else if (operator.equals("/")) { result = firstNum / secondNum; } //将数据存入bean中 CalculatorDemo2 dataBean = new CalculatorDemo2(); dataBean.setFirstNum(firstNum); dataBean.setSecondNum(secondNum); dataBean.setOperator(operator); dataBean.setResult(result); request.setAttribute("bean", dataBean); //跳转到结果显示界面 request.getRequestDispatcher("/demo2/showResult.jsp").forward(request, response);
} /** * The doPost method of the servlet. <br> * * This method is called when a form has its tag value method equals to post. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */ public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } /** * Initialization of the servlet. <br> * * @throws ServletException if an error occurs */ public void init() throws ServletException { // Put your code here } } |
模型层CalculatorDemo2.java
|
package com.silvan.pojo; public class CalculatorDemo2 { private double firstNum; // 参数一 private double secondNum; // 参数二 private String operator; // 运算符 private double result; // 运算结果
public double getFirstNum() { return firstNum; }
public void setFirstNum(double firstNum) { this.firstNum = firstNum; }
public double getSecondNum() { return secondNum; }
public void setSecondNum(double secondNum) { this.secondNum = secondNum; }
public String getOperator() { return operator; }
public void setOperator(String operator) { this.operator = operator; }
public double getResult() { return result; }
public void setResult(double result) { this.result = result; }
} |
视图层showResult.jsp
|
<%@ page language="java" contentType="text/html; charset=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>calculator</title> </head> <body> <h3>运算结果</h3> <jsp:useBean id="bean" type="com.silvan.pojo.CalculatorDemo2" scope="request"></jsp:useBean> <jsp:getProperty property="firstNum" name="bean"/> <jsp:getProperty property="operator" name="bean"/> <jsp:getProperty property="secondNum" name="bean"/> = <jsp:getProperty property="result" name="bean"/> </body> </html> |
案例2
MVC模式实现登录
Login.jsp
|
<body> <h1>登陆表单</h1> <h3 style="color:red;">${msg }</h3> <form action="/login/LoginServlet" method="post"> <table> <tr> <td>用户名</td> <td><input type="text" name="username" /> </td> </tr> <tr> <td>密码</td> <td><input type="password" name="password" /> </td> </tr> <tr> <td colspan="2"><input type="submit" value="登陆" /></td> </tr> </table> </form> </body> |
Web.xml
|
<servlet> <servlet-name>LoginServlet</servlet-name> <servlet-class>com.silvan.servlet.LoginServlet</servlet-class> </servlet>
<servlet-mapping> <servlet-name>LoginServlet</servlet-name> <url-pattern>/LoginServlet</url-pattern> </servlet-mapping> |
LoginServlet.java
|
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 解决编码问题 request.setCharacterEncoding("utf-8"); // 接收表单参数 String username = request.getParameter("username"); String password = request.getParameter("password");
// 将form 数据封装 javabean对象 User user = new User(); user.setUserName(username); user.setPassWord(password);
// 传递数据javabean 给 处理javabean // 使用模型完成对用户验证 去创建一个UserModel对象，调用对应的方法 UserService userService = new UserService();
if (userService.checkUser(user)) { // 把用户名放入session,以备后用 request.getSession().setAttribute("username", username); // 合法 // 转向，跳转方法效率不高 // response.sendRedirect("welcome.jsp"); // 因为sendRedirect方法效率不高，在公司常常使用转发方法 // getRequestDispatcher方法效率高，并且可以把request请求信息往下转发 request.getRequestDispatcher("/index.jsp").forward(request, response); } else { // 不合法 request.setAttribute("msg", "用户名或密码错误！"); request.getRequestDispatcher("/Login.jsp").forward(request, response); }
}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { this.doGet(request, response); } |
User.java
|
public class User { private String userName; private String passWord; get/set…… } |
LoginService.java
|
/** * 业务逻辑层，一般归类于模型层 * @author Administrator * */ public class UserService { // 验证用户是否存在 public boolean checkUser(User user) { String driver = "oracle.jdbc.driver.OracleDriver"; String url = "jdbc:oracle:thin:@localhost:1521:XE"; String username = "zhou"; String password = "123456"; boolean flag = false; Connection conn = null; PreparedStatement pstmt = null; ResultSet rs = null; try { //加载数据库连接驱动类 Class.forName(driver); //获取数据库连接 conn = DriverManager.getConnection(url,username,password); // 执行查询 String sql = "select * from USER1 where username='" + user.getUserName() + "'"; // 创建prepareStatement对象 pstmt = conn.prepareStatement(sql); //得到查询结果 rs = pstmt.executeQuery(); System.out.println("sql=" + sql); //处理查询结果 if (rs.next()) { if (user.getPassWord().equals(rs.getString("pwd"))) { // 登录成功 // 将得到的数据传给下一个页面 // 1，cookie 2,session 3 response.sendRedirect flag = true; } } } catch (Exception e) { e.printStackTrace(); } finally { //关闭数据库连接 try { if (pstmt!=null){ pstmt.close(); } if(conn!=null){ conn.close(); } if(rs!=null){ rs.close(); } } catch (SQLException e) { e.printStackTrace(); } } return flag; } } |
Index.jsp
|
<body> ${username }登录成功！ </body> |