码迷,mamicode.com
首页 > Web开发 > 详细

使用基本MVC2模式创建新闻网站

时间:2019-05-18 09:37:50      阅读:189      评论:0      收藏:0      [点我收藏+]

标签:连接数据库   att   jdb   news   聚集   check   计数   lists   []   

使用基本MVC2模式创建新闻网站

学号:201631062509

姓名:杨菓

1.什么是MVC

MVC全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范,用一种业务逻辑、数据、界面显示分离的方法组织代码,将业务逻辑聚集到一个部件里面,在改进和个性化定制界面及用户交互的同时,不需要重新编写业务逻辑。MVC被独特的发展起来用于映射传统的输入、处理和输出功能在一个逻辑的图形化用户界面的结构中。

(1)Model层:Model指模型部分,一般在应用中Model层包括业务处理层和数据访问层。数据访问层主要是对数据库的一些操作的封装。业务处理层应用JavaBean构建,  JavaBean主要是用作将从View层获取的数据和数据库的数据进行桥接。除却JavaBean以外,若想构建分布式应用系统,可以应用EJB组件进行业务逻辑层的构建。

 

(2)Controller层:Controller指控制部分,一般是对View层提交的请求为其设置对应的Servlet进行特定功能的处理,这里的进行特定功能的处理一般是编写在Model中的业务处理层中的。Controller一般只是在Web应用中充当一个中介者的作用。

 

(3)View层:View指视图部分,这一部分的内容是展示给用户实际进行交互的,通常使用JSP和HTML进行构建(个人比较喜欢以HTML嵌入JSP的方式来构建网页)。

 

综上来说,一个小型完整的基于MVC设计模式的Web应用程序的处理流程应该如下:

 

技术图片

 

      由上面的图中我们可以看出,用户在客户端(Web应用的客户端即为浏览器)中发出请求的时候,请求首先由View层的JSP/HTML将HTTP请求传给控制器中对应的Servlet,然后由Servlet负责调用Model层中的业务逻辑处理部分进行要求的处理,处理期间如果设计数据库的操作,则与数据库进行操作,最后全部操作结束之后,由业务逻辑层将结果发给控制层,控制层以HTTP响应的形式将结果发送回客户端。

 

 技术图片MVC编程模式

MVC 是一种使用 MVC(Model View Controller 模型-视图-控制器)设计创建 Web 应用程序的模式: [1] 
  • Model(模型)表示应用程序核心(比如数据库记录列表)。
  • View(视图)显示数据(数据库记录)。
  • Controller(控制器)处理输入(写入数据库记录)。
MVC 模式同时提供了对 HTML、CSS 和 JavaScript 的完全控制。
Model(模型)是应用程序中用于处理应用程序数据逻辑的部分。
  通常模型对象负责在数据库中存取数据。
View(视图)是应用程序中处理数据显示的部分。
  通常视图是依据模型数据创建的。
Controller(控制器)是应用程序中处理用户交互的部分。
  通常控制器负责从视图读取数据,控制用户输入,并向模型发送数据。
MVC 分层有助于管理复杂的应用程序,因为您可以在一个时间内专门关注一个方面。例如,您可以在不依赖业务逻辑的情况下专注于视图设计。同时也让应用程序的测试更加容易。
MVC 分层同时也简化了分组开发。不同的开发人员可同时开发视图、控制器逻辑和业务逻辑。

2.运行效果图

 登录页面

技术图片

登录后跳转新闻页面

技术图片

 

新闻添加和修改页面

技术图片

3.源代码

 查找

技术图片
 1 package servlet;
 2 
 3 import java.io.IOException;
 4 import java.util.List;
 5 
 6 import javax.servlet.ServletException;
 7 import javax.servlet.annotation.WebServlet;
 8 import javax.servlet.http.HttpServlet;
 9 import javax.servlet.http.HttpServletRequest;
10 import javax.servlet.http.HttpServletResponse;
11 
12 import bean.News;
13 import dao.Newsdao;
14 @WebServlet("/SelectServlet")
15 public class SelectServlet extends HttpServlet {
16     private static final long serialVersionUID = 1L;
17     public SelectServlet() {
18         super();
19     }
20 
21     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
22         doPost(request,response);
23     }
24 
25     protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
26         request.setCharacterEncoding("utf-8");
27         response.setContentType("text/html;cahrset=utf-8");
28         String id=request.getParameter("id");
29         int nid=Integer.parseInt(id);
30         Newsdao nd=new Newsdao();
31         List<News> list=nd.selectByID(nid);
32         request.setAttribute("news", list);
33         
34         System.out.println(list.size());
35         request.getRequestDispatcher("/content.jsp").forward(request, response);
36         
37         
38         
39     }
40 
41 }
查找

 连接数据库

技术图片
  1 package dao;
  2 
  3 import java.sql.Connection;
  4 import java.sql.DriverManager;
  5 import java.sql.PreparedStatement;
  6 import java.sql.ResultSet;
  7 import java.sql.SQLException;
  8 import java.sql.Statement;
  9 import java.util.ArrayList;
 10 import java.util.List;
 11 
 12 import bean.News;
 13 
 14 public class Newsdao {
 15     private static final long serialVersionUID = 1L;
 16 //    private String driverName="com.mysql.jdbc.Driver";
 17 //    private String url="jdbc:mysql://localhost:3306/newsdata?useSSL=false&serverTimezone=UTC";
 18 //    private String name="root";
 19 //    private String pwd="123456";
 20     static Connection con=null;
 21     public static  Connection getCon() {
 22         String driverName="com.mysql.cj.jdbc.Driver";
 23         String url="jdbc:mysql://localhost:3306/newsdata?useSSL=false&serverTimezone=UTC&allowPublicKeyRetrieval=true";
 24         String name="root";
 25         String pwd="123456";
 26                 try {
 27                     Class.forName(driverName);
 28                     try {
 29                         con = DriverManager.getConnection(url, name, pwd);
 30                     } catch (SQLException e) {
 31                         e.printStackTrace();
 32                     }
 33                     
 34                 } catch (ClassNotFoundException e) {
 35                     e.printStackTrace();
 36                 }
 37         return con;
 38     } 
 39     //添加新闻
 40         public boolean addNews(News news) {
 41             con=Newsdao.getCon();
 42             boolean flag=false;
 43             String sql="insert news(title,type,datetime,content) values(‘"+news.getTitle()+"‘,‘"
 44             +news.getType()+"‘,‘"
 45                     +news.getDateTime()+"‘,‘"
 46                     +news.getContent()+"‘)";
 47             //System.out.println("添加的sql语句"+sql);
 48             try {
 49                 PreparedStatement ps=con.prepareStatement(sql);
 50                 int i=ps.executeUpdate();
 51                 //System.out.println("i的值"+i);
 52                 ps.close();
 53                 con.close();
 54                 if(i>0) {
 55                     flag =true;
 56                 }
 57             } catch (SQLException e) {
 58                 System.out.println("添加出错");
 59                 e.printStackTrace();
 60             }
 61             
 62             return flag;
 63         }
 64         public List<News> selectByID(int id){
 65             con=Newsdao.getCon();
 66             List<News> list=new ArrayList<>();
 67             String sql="select * from news where id="+id+"";
 68             System.out.println(sql);
 69             Statement state;
 70             ResultSet rs;
 71             try {
 72                 state = con.createStatement();
 73                 rs=state.executeQuery(sql);
 74                 while(rs.next()) {
 75                     News news=new News();
 76                     news.setTitle(rs.getString("title"));
 77                     news.setContent(rs.getString("content"));
 78                     news.setDateTime(rs.getString("dateTime"));
 79                     news.setType(rs.getString("type"));
 80 ;                    news.setId(id);
 81                     list.add(news);
 82                     //System.out.println(news.getTitle());
 83                 }
 84                 rs.close();
 85                 state.close();
 86                 con.close();
 87             } catch (SQLException e) {
 88                 System.out.println("查询出错");
 89                 e.printStackTrace();
 90             }
 91             return list;
 92         }
 93         
 94         
 95         //删除新闻
 96         public List<News> selectAll(){
 97             con=Newsdao.getCon();
 98             List<News> list=new ArrayList<News>();
 99             String sql="select * from news";
100             Statement state;
101             ResultSet rs;
102             try {
103                 state = con.createStatement();
104                 rs=state.executeQuery(sql);
105                 while(rs.next()) {
106                     News news=new News();
107                     news.setId(rs.getInt("id"));
108                     news.setTitle(rs.getString("title"));
109                     news.setContent(rs.getString("content"));
110                     news.setDateTime(rs.getString("dateTime"));
111                     news.setType(rs.getString("type"));
112                     list.add(news);
113                     //System.out.println(news.getType());
114                 }
115                 rs.close();
116                 state.close();
117                 con.close();
118             } catch (SQLException e) {
119                 System.out.println("查询出错");
120                 e.printStackTrace();
121             }
122             return list;
123         }
124         
125         //修改新闻
126         
127         public boolean update(News news) {
128             con=Newsdao.getCon();
129             boolean flag=false;
130             String sql="update news set title=‘"+news.getTitle()+"‘,type=‘"+news.getType()
131                     +"‘,dateTime=‘"+news.getDateTime()
132                     +"‘,content=‘"+news.getContent()+"‘ where id="+news.getId()+"";
133             System.out.println(sql);
134             Statement state=null;
135             try {
136                 state = con.createStatement();
137                 int i=state.executeUpdate(sql);
138                 System.out.println(i);
139                 if(i>0) {
140                     flag=true;
141                 }
142             } catch (SQLException e) {
143                 System.out.println("更新错误");
144                 e.printStackTrace();
145             }
146             
147             return false;
148         }
149         
150         //删除
151         public boolean delete(int  id) {
152             con=Newsdao.getCon();
153             boolean flag=false;
154             String sql="delete from news where id=‘"+id+"‘";
155            // System.out.println(sql);
156             PreparedStatement ps;
157             try {
158                 ps = con.prepareStatement(sql);
159                 int i=ps.executeUpdate();
160                 if(i>0){
161                     flag=true;
162                 }
163             } catch (SQLException e) {
164                 System.out.println("删除出错");
165                 e.printStackTrace();
166             }
167             
168             return flag;
169         }
170     
171 }
连接数据库

添加

技术图片
 1 package servlet;
 2 
 3 import java.io.IOException;
 4 import javax.servlet.ServletException;
 5 import javax.servlet.annotation.WebServlet;
 6 import javax.servlet.http.HttpServlet;
 7 import javax.servlet.http.HttpServletRequest;
 8 import javax.servlet.http.HttpServletResponse;
 9 
10 import bean.News;
11 import dao.Newsdao;
12 
13 /**
14  * Servlet implementation class AddServlet
15  */
16 @WebServlet("/AddServlet")
17 public class AddServlet extends HttpServlet {
18 
19        
20     public AddServlet() {
21         super();
22     }
23     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
24         doPost(request,response);
25     }
26 
27     protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
28         request.setCharacterEncoding("utf-8");
29         response.setContentType("text/html;charset=UTF-8");
30         String title=request.getParameter("title");
31         String type=request.getParameter("type");
32         String datetime=request.getParameter("datetime");
33         String content=request.getParameter("ueditor");
34         System.out.println("这是ueditor的内容"+title+content);
35         News news=new News();
36         news.setTitle(title);
37         news.setContent(content);
38         news.setDateTime(datetime);
39         news.setType(type);
40         
41         Newsdao nd=new Newsdao();
42         
43         try{
44             nd.addNews(news);
45             response.sendRedirect("newslistServlet");
46             //request.getRequestDispatcher("/newslist.jsp").forward(request, response);
47         }catch(Exception e) {
48             System.out.println("添加失败");
49         }
50     }
51 
52 }
添加

添加页面

技术图片
 1 <%@ page language="java" contentType="text/html; charset=utf-8"
 2     pageEncoding="utf-8"%>
 3        <%@page import="java.util.*" %>
 4        <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
 5         <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
 6 <!DOCTYPE html>
 7 <html>
 8 <head>
 9 <meta http-equiv="Content-Type" content="text/html" charset="utf-8">
10 <script type="text/javascript" charset="utf-8" src="utf8-jsp/ueditor.config.js"></script>
11     <script type="text/javascript" charset="utf-8" src="utf8-jsp/ueditor.all.min.js"> </script>
12     <script type="text/javascript" charset="utf-8" src="utf8-jsp/lang/zh-cn/zh-cn.js"></script>
13 
14 <title>新闻页</title>
15 <style type="text/css">
16 
17 body{
18 margin-top:20px;
19 backgroud-color:#ff2812;
20 text-align:center;
21 }
22 .text{
23     width:500px;
24     height:20px;
25     
26 }
27 .btn{
28   right: 35px;
29   bottom: 25px;
30   width: 100px;
31   height: 30px;
32   background: #759fc7;
33   font-size: 15px;
34   color: #fff;
35   letter-spacing: 10px;
36   margin-left:40px;
37   text-align: center;
38 }
39 </style>
40 </head>
41 <body>
42 <div >
43 <h2>添加新闻</h2>
44 <form action="addServlet" method="POST" >
45 新闻标题     <input class="text" type="text" name="title" ><br><br>
46 
47 新闻类别  
48  <input type="radio" name="type" value="娱乐" checked="checked"/>娱乐
49                      <input type="radio" name="type" value="体育"/>体育
50                      <input type="radio" name="type" value="国际"/>国际
51                      <input type="radio" name="type" value="社会"/>社会
52                      <input type="radio" name="type" value="财经"/>财经
53                      <input type="radio" name="type " value="科技"/>科技
54 <br><br>
55 发布时间       <input class="text" type="text" name="datetime"  ><br><br>
56 正文编辑
57 <script id="editor" type="text/plain" name="ueditor" style="width:1024px;height:500px;margin-left:100px"></script>
58 
59 <button class="btn" type="submit">保存</button >
60 <!-- <button class="btn" type="submit">退出</button> -->
61 </form>
62 </div>
63 
64 <script type="text/javascript">
65     var ue=UE.getEditor(‘editor‘);
66      function getPlainTxt() {
67             var arr = [];
68             arr.push("使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容");
69             arr.push("内容为:");
70             arr.push(UE.getEditor(‘editor‘).getPlainTxt());
71             alert(arr.join(‘\n‘))
72         }
73 </script>
74 </body>
75 </html>
添加页面

删除

技术图片
 1 package servlet;
 2 
 3 import java.io.IOException;
 4 
 5 import javax.servlet.ServletException;
 6 import javax.servlet.annotation.WebServlet;
 7 import javax.servlet.http.HttpServlet;
 8 import javax.servlet.http.HttpServletRequest;
 9 import javax.servlet.http.HttpServletResponse;
10 
11 import dao.Newsdao;
12 
13 /**
14  * Servlet implementation class DeleteServlet
15  */
16 @WebServlet("/DeleteServlet")
17 public class DeleteServlet extends HttpServlet {
18     private static final long serialVersionUID = 1L;
19        
20     public DeleteServlet() {
21         super();
22     }
23 
24     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
25         doPost(request,response);
26     }
27     protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
28         request.setCharacterEncoding("utf-8");
29         response.setContentType("text/html;charset=utf-8");
30         String id=(String)request.getParameter("id");
31         System.out.println("被删除的新闻");
32         int nid=Integer.parseInt(id);
33         Newsdao nd=new Newsdao();
34         nd.delete(nid);
35         response.sendRedirect("newslistServlet");
36         //request.getRequestDispatcher("/newslist.jsp").forward(request, response);
37     }
38 
39 }
删除

修改页面HTML

技术图片
 1 <%@ page language="java" contentType="text/html; charset=utf-8"
 2     pageEncoding="utf-8"%>
 3        <%@page import="java.util.*" %>
 4        <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
 5         <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
 6 <!DOCTYPE html>
 7 <html>
 8 <head>
 9 <meta http-equiv="Content-Type" content="text/html" charset="utf-8">
10 <script type="text/javascript" charset="utf-8" src="utf8-jsp/ueditor.config.js"></script>
11     <script type="text/javascript" charset="utf-8" src="utf8-jsp/ueditor.all.min.js"> </script>
12     <script type="text/javascript" charset="utf-8" src="utf8-jsp/lang/zh-cn/zh-cn.js"></script>
13 
14 <title>新闻页</title>
15 <style type="text/css">
16 
17 body{
18 margin-top:20px;
19 backgroud-color:#ff2812;
20 text-align:center;
21 }
22 .text{
23     width:500px;
24     height:20px;
25     
26 }
27 .btn{
28   right: 35px;
29   bottom: 25px;
30   width: 100px;
31   height: 30px;
32   background: #759fc7;
33   font-size: 15px;
34   color: #fff;
35   letter-spacing: 10px;
36   margin-left:40px;
37   text-align: center;
38 }
39 </style>
40 </head>
41 <body>
42 <div >
43 <h2>修改新闻</h2>
44 <form action="updateServlet" method="GET" >
45 <c:forEach var="s" items="${item}">
46 新闻编号          <input class="text" type="text" name="id" value="${s.id }"><br><br>
47 新闻标题     <input class="text" type="text" name="title" value="${s.title }"><br><br>
48 
49 新闻类别  
50          <input type="radio" name="type" value="娱乐"  ${("娱乐"eq s.type)?"checked":""}/>娱乐
51         <input type="radio" name="type" value="体育" ${("体育"eq s.type)?"checked":""}/>体育
52         <input type="radio" name="type" value="国际"  ${("国际"eq s.type)?"checked":""}/>国际
53         <input type="radio" name="type" value="社会"  ${("社会"eq s.type)?"checked":""}/>社会
54         <input type="radio" name="type" value="财经"  ${("财经"eq s.type)?"checked":""}/>财经
55         <input type="radio" name="type" value="科技"  ${("科技"eq s.type)?"checked":""}/>科技
56 <br><br>
57 发布时间       <input class="text" type="text" name="datetime" value="${s.dateTime }" ><br><br>
58 正文编辑
59 <script id="editor" type="text/plain" name="editor" style="width:1024px;height:500px;margin-left:100px">${s.content}</script>
60 
61 <button class="btn" type="submit">保存</button >
62 <!-- <button class="btn" type="submit">退出</button> -->
63 </form>
64 </div>
65 </c:forEach>
66 <script type="text/javascript">
67    
68     var ue=UE.getEditor(editor);
69     UE.getEditor(editor).setContent(${s.content});
70     /* function setContent(isAppendTo) {
71         var arr = [];
72         arr.push("使用editor.setContent(‘欢迎使用ueditor‘)方法可以设置编辑器的内容");
73         ue.getEditor(‘editor‘).setContent(‘欢迎使用ueditor‘, isAppendTo);
74         alert(arr.join("\n"));
75     }  */
76     //alter("gg");
77     //UE.getEditor(‘editor‘).setContent(‘${s.content}‘);
78     
79         function getContent() {
80             var arr = [];
81             arr.push(UE.getEditor(editor).getContent());
82             alert(arr.join("\n"));
83         }
84         
85         
86      
87 </script>
88 </body>
89 </html>
HTML

修改

技术图片
 1 package servlet;
 2 
 3 import java.io.IOException;
 4 
 5 import javax.servlet.ServletException;
 6 import javax.servlet.annotation.WebServlet;
 7 import javax.servlet.http.HttpServlet;
 8 import javax.servlet.http.HttpServletRequest;
 9 import javax.servlet.http.HttpServletResponse;
10 
11 import bean.News;
12 import dao.Newsdao;
13 
14 /**
15  * Servlet implementation class UpnewsServlet
16  */
17 @WebServlet("/UpdateServlet")
18 public class UpdateServlet extends HttpServlet {
19     private static final long serialVersionUID = 1L;
20    
21     public UpdateServlet() {
22         super();
23     }
24 
25     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
26         doPost(request,response);
27         
28     }
29 
30     protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
31         response.setContentType("text/html;charset=UTF-8");
32         request.setCharacterEncoding("utf-8");
33         String id=request.getParameter("id");
34         System.out.println("id的值为"+id);
35         int nid=Integer.parseInt(id);
36         String title=request.getParameter("title");
37         String type=request.getParameter("type");
38         String datetime=request.getParameter("datetime");
39         String content=request.getParameter("editor");
40         News news=new News();
41         news.setId(nid);
42         news.setTitle(title);
43         news.setContent(content);
44         news.setDateTime(datetime);
45         news.setType(type);
46         Newsdao nd=new Newsdao();
47         try{
48             nd.update(news);
49             response.sendRedirect("newslistServlet");
50         }catch(Exception e) {
51             System.out.println("修改失败");
52         }
53     }
54 
55 }
修改

4.百度云地址

链接:https://pan.baidu.com/s/1TLjuvTu5gLjcjRw1aPUYlg
提取码:i1pc
复制这段内容后打开百度网盘手机App,操作更方便

使用基本MVC2模式创建新闻网站

标签:连接数据库   att   jdb   news   聚集   check   计数   lists   []   

原文地址:https://www.cnblogs.com/Yy-Gg/p/10884441.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!