JSP新闻发布系统课设报告.doc
.- 程序语言综合课程设计设计报告学院：信息工程学院组长：黄敏（计算机中加141, 06号）成 员：刘存国（计算机中加141, 16号）指导老师杨书新完成时间：2016年07月1日目 录第一章 需求分析11.1 功能需求11.2 性能需求11.3 用户界面需求21.4 安全需求2第二章 总体设计32.1 系统功能描述32.2 E-R模型42.3 系统功能模块划分52.4 系统流程图6第三章 数据库设计73.1概念设计73.2逻辑设计73.3物理设计7第四章 详细设计与实现94.1前台界面和功能实现94.2后台界面和功能实现12总结25致谢25第一章 需求分析1.1 功能需求本系统的目的是实现新闻发布系统的基本功能。（1）查看新闻任何用户均可以使用查看新闻功能，查看新闻功能在新闻首页显示最新新闻，用户可以点击首页的新闻标题链接查看相关新闻内容，可以根据新闻首页的分类新闻（如国内、社会等）查看你想要了解的新闻消息，也可以通过或者通过点击自己感兴趣图片的下方链接来查看相关新闻。（2）站内新闻检索功能任何用户均可以使用新闻搜素功能，可通过关键词以及标题来搜索符合的新闻。（3）Admin管理员登录功能当用户需要使用新闻管理功能时，需要先以管理员的身份登录系统，在地址栏中输入管理员登录的地址，进入登录页面。用户在登录页面输入用户名和密码以及随机产生的验证码，若登录失败，则清空输入，并简要显示错误原因，管理员登录页面等待下一次登录，否则登录成功，从而使用新闻管理功能。（4）新闻类别管理Admin管理员登录后，可以对新闻的类别进行添加修改删除功能。（5）新闻发布功能获得权限的用户可以使用新闻发布功能。用户通过点击“添加新闻”项进入新闻发布页面，填写新闻的主题、标题、作者、摘要以及相关内容和图片，按提交键即可，发布时间取当前系统时间，不需用户填写。（6）新闻管理功能管理员登录后，可进行新闻管理操作，包括对现有新闻的删除和修改。在管理页面上，用户可通过单击每条记录右侧的“修改”或“删除”超链接来进行操作。当管理员本次维护结束后，可通过“login out”退出该页面。1.2 性能需求（1）Tomcat可以免安装，体积小，运行效率高，能很方便的在Windows和linux系统下发布。同时使用mysql数据库，安装方便且免费使用，mysql在Windows和linux下都能被良好的支持。而JSP不但可以使用Myeclipse，也可使用dreamweaver编辑，甚至记事本等文本编辑工具即可编写，因此对系统运行环境非常低，小型服务器和家用电脑均作为本系统运行环境。 （2）界面设计友好美观、数据要准确安全可靠；实现对新闻信息的添加、修改、删除，便于更新网站内容；系统最大限度地实现易维护性和易操作性；对于一个新闻发布系统而言新闻信息是很多的，而且使用的人数较多，所以对系统的安全性有着比较高的要求，对于数据库，要设置不同用户的权限，数据的修改必须由合法用户操作。1.3 用户界面需求网站页面是用户直接访问的页面，所以必须要让用户访问就能看出来这个网站的主题思想是什么，一下就能体现出这个网站的中心内容。并且首页的模块之间要联系紧密，更好的让用户理解明白。1.4 安全需求由于使用JSP编写的程序代码隐蔽，在客户端仅可以看到由JSP输出的动态HTML文件，因此只要编写程序时注意严谨性，防止SQL注入和cookies欺骗，整个系统的安全就能得到保障，同时也能防止别人抄袭源代码。本系统的管理员可以有多名，为防止暴力猜解密码，在设计后台登录模块时需考虑验证码的设计。第二章 总体设计高效的新闻发布系统可简便维护工作，使用新闻发布系统，管理员只需设计标题、内容和图片等新闻，系统将自动生成对应的网页，使新闻发布和管理变得很轻松。而对于前台界面，为适应多个用户的需求，必须达到友好、方便、简洁和易用的特点。本文将根据前期的需求分析，对新闻发布系统进行总体设计。2.1 系统功能描述新闻发布及管理系统包括新闻类别管理、新闻发布管理、新闻查询和图片处理等模块。具体描述如下。1新闻类别管理： (1)新闻类别的录入，包括类别名称等信息； (2)新闻类别的修改； (3)新闻类别的删除； (4)新闻类别的查询。 2新闻发布管理： (1)基本新闻信息的发布，包括新闻标题、新闻内容和所属类别等； (2)基本新闻信息的修改； (3)基本新闻信息的删除； 3图片处理模块： (1)选择图片文件；(2)上传图片文件； (3)存储图片新闻；(4)修改新闻图片； (5)删除新闻图片；(6)在网页中浏览新闻图片。 4新闻查询模块： (1)按照新闻类别分页显示新闻；(2)按照日期分页显示新闻；(3)按照新闻发布者查询。5系统用户管理功能： (1)系统用户信息的录入，包括用户名和密码等信息；(2)系统用户信息的修改； (3)系统用户信息的删除。2.2 E-R模型根据分析可划分出新闻信息、用户信息、评论信息以及新闻信息类别和几个实体，具体E-R模型如下。（1） 新闻信息新闻信息主题上传图片内容标题作者摘要图2-1 新闻信息实体的E-R图（2）用户信息用户信息邮 箱用户名名性 别密 码图2-2 用户信息实体的E-R图（3）新闻类别信息新闻类别信息类别名称类别ID名图2-3 新闻类别信息实体的E-R图M1拥有用户信息新闻信息新闻类别信息M1属于图2-4 ER关系模型图2.3 系统功能模块划分从功能的内容可以看到，该新闻发布系统可以实现6个完整的功能。我们根据这些功能，设计出系统的功能模块。新闻发布及管理系统系统用户管理新闻更新管理新闻查询模块新闻添加管理新闻发布管理新闻类别管理 图2-5 系统功能模块图新闻发布及管理系统的功能模块之间的关系： 前台系统 后台系统新闻删改管理基本信息发布查看新闻新闻图片发布新闻类别管理 数据库图2-6 新闻发布及管理系统的功能模块图2.4 系统流程图开始 新闻系统首页类别管 理新闻发 布 管理员登录新闻修 改新闻删 除查看新 闻注册登 录退出图2-7 系统的基本流程图任何用户从浏览器输入地址进入本新闻发布系统后首先进入新闻主界面，即可进行新闻的查看，根据标题或关键字进行浏览自己喜欢的新闻。点击登录与注册，进入登录页面，未注册的用户能够选择注册，已注册的用户输入自己的用户名和密码可进入后台管理，有新闻的发布、新闻的管理、新闻的类别管理等。点击login out即可退出本新闻系统。第三章 数据库设计3.1概念设计新闻发布系统中，主要需要以下数据来保持相应的信息：1新闻信息表：用于保存新闻信息的基本信息。2管理员信息表：用于保存新闻发布系统管理员的信息。3新闻主题信息表：用于保存新闻主题信息。3.2逻辑设计本系统主要涉及四张表：新闻信息表（newsinfo）、管理员表（userinfo）、主题信息表（topic）。前面我们已给出他们的E-R图。上述四表的关系如下图所示：图3-1 逻辑关系图3.3物理设计 本系统主要涉及四张表：新闻信息表（newsinfo）、管理员表（userinfo）、主题信息表（topic）。我们采用了MySql数据库,在数据库中使用数据表来储存现有的新闻信息。1. 存储新闻信息的newsinfo表，其中表的结构如表3-1所示。表3-1 新闻信息表newsinfo名称字段数据类型主键非空新闻IDidInt(10)是是新闻标题titleVarchar(50)否是新闻发布人authorVarchar(30)否否新闻发布时间timeVarchar(20)否是新闻图片路径pic_pathVarchar(80)否否新闻内容contentVarchar(100)否是新闻摘要abstrateVarchar(50)否否2. 使用数据表userinfo来储存管理员的信息，表的结构如下表3-2所示。表3-2 管理员信息表userinfo名称字段数据类型主键非空管理员IDtidInt(11)是是管理员名称tnameVarchar(20)否是管理员密码tpassVarchar(30)否否 3. 使用数据表topic来储存新闻主题的信息，表的结构如下表3-4所示。 表3-4 新闻类别信息名称topic名称字段数据类型主键非空主题IDidInt(11)是是主题名称topic_nameVarchar(30)否是 第四章 详细设计与实现4.1前台界面和功能实现4.1.1主页功能介绍1在index.jsp页面有普通用户登录窗口，用户可以在主页面浏览新闻，和查看热点新闻列表和每条新闻的详情，用户点击“登录与注册”后在窗口输入账号密码后，登入成功，或者注册。 2主页面的名称为index.jsp 如下图图4-1 前台主页面图任何用户输入域名后直接进入到主页面，以上是从数据库加载的新闻列表和新闻话，题在主页实现的功能有：1.查看从数据库加载出来所有的新闻主题、新闻列表；2.用户可以点击右上角的“登录与注册”，跳转到后台登录界面。 3主页的主要实现代码<% page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><% page import="java.util.*"%><% page import="xw.XinwenBean"%><html ><head></head><body><div id="all"> <div class="banner"> <ul class="img"> <li><a href="#"><img src="images/banner1.png"></a></li> <li><a href="#"><img src="images/banner2.png"></a></li> <li><a href="#"><img src="images/banner3.png"></a></li> <li><a href="#"><img src="images/banner4.png" width="1188px"></a></li> </ul> <ul class="num"> </ul> <div class="btn btn_l"><</div> <div class="btn btn_r">></div> </div> <div class="heading"> <ul> <li><a>首页</a></li> <li class="fu"></li> <li><a>新闻</a></li> <li class="fu"></li> <li><a>图片</a></li> <li class="fu"></li> <li><a>视频</a></li> <li class="fu"></li> <li><a>娱乐</a></li> <li class="fu"></li> <li><a>时尚</a></li> <li class="fu"></li> <li><a>体育</a></li> <li class="fu"></li> <li><a>财经</a></li> <li class="fu"></li> <li><a>汽车</a></li> <li class="fu"></li> <li><a>房产</a></li> <li class="fu"></li> <li><a>购物</a></li> <li class="fu"></li> <li><a>博客</a></li> <li class="fu1"> <a href="login.jsp">登入与注册</a></li> </ul> </div> </div><div class="main"><div class="up"><%List<XinwenBean> list = (List<XinwenBean>) request.getAttribute("list");if (list = null | list.size() < 1) out.print("<ul><li bgcolor=#FFFFFF colspan=5>没有任何新闻信息！</li></ul>"); else %><ul><%for (XinwenBean xw : list) String str=xw.getTitle();if(str.length()>15)str=str.substring(0,15)+"."%><li><a href="Chakan.jsp?title=<%=xw.getTitle()%>"><%=str%></a></li> <% %> <% %></ul> <div width="98%" align="center" style="padding-top:10px;"><%=request.getAttribute("bar")%></div></div><div class="down"> <h2>天下要闻</h2> <p> 迷惘的人，是因为迷失在物欲纵横的世界里，无法自 拔，终日无所事事，庸庸碌碌过完一生，如行尸走肉；人不应作没有思 想的芦苇，随波逐流。有梦的人，无论身处何处，都会有梦想指引前行 ，一路不觉所累，前行的才会更远，变得更强。我一直拥有一个梦想， 因为“他”，即便沉舟侧畔，依旧千帆过。梦想与我一路逐波，我与梦 想一路相随。</p> </div></div> <div class="right"> <div class="up"></div> <div class="down"></div></div></div></body></html>4.2后台界面和功能实现4.2.1后台功能介绍后台的主要功分为三块：（1）后台管理员登录与注册。（2）新闻类别的添加、删除；（3）新闻的添加、删除、查询、修改；4.2.2登录与注册界面1后台登入界面如下图：图4-2 后台登录界面图 2后台注册界面如下图：图4-3 后台注册界面图3实现页面主要代码： <% page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><html><head> </head><body><img src="images/1.jpg" style="width:100%; height:100%; position:fixed; z-index:-1; top: 0px;right:0px;"></img><div class="main"><div class="head"><a href="#" onclick="ShowHideDiv1(login,register)">登录</a> | <a href="#" onclick="ShowHideDiv2(login,register)">注册</a></div> <div id=login style="width:100%;"> <form name="form1" method="post" action="checkuser.jsp"> <table> <tr><div class="a_main"> <input type="text" class="intext" name="UserName" placeholder="用户名"></div></tr> <tr><div class="b_main" > <input type="password" class="inpassword" name="PWD" placeholder="密码"></div></tr><tr><div class="c_main"><input name="Submit" type="button" value="登录" onClick="mycheck()"><input type="reset" class="submit1" value="重置"></div></tr></table> </form><div class="foot"><a href="#">忘记密码</a> |<a href="#">意见反馈</a> | <a href="findJServlet">返回首页</a></div> </div> <div id=register style="width:100%;display:none;"><form name="form2" method="post" action="ZCServlet" ><table width="500" height="400"><tr><td>账号: <input type="text" name="UserName" class="line"></td></tr><tr><td>密码: <input type="password" name="PWD" class="line"></td></tr><tr><td>性别: <input type="radio" name="Gender" value="男" checked>男 <input type="radio" value="女" name="Gender">女</td></tr><tr><td>邮箱: <input type="email" name="mailbox" class="line"></td></tr><tr><td><input type="checkbox"> 我已阅读并同意相关服务条款和隐私政策</td></tr><tr><td> <input type="submit" value="提交注册" class="btn" onClick="mycheck2()"></td></tr> </table> </form></div></div> </body></html>4后台主界面图4-4 后台主界面图主界面主要加载了当前管理员，登录状态，安全退出按钮，和导航栏的菜单功能及后台系统的功能介绍。4.2.3新闻操作功能 1对新闻操作界面如下图4-5 后台对新闻添加界面图图4-6 后台对新闻修改界面图1图4-7 后台对新闻修改界面图2图4-8 后台新闻列表和删除操作界面图2实现主要代码（1）新闻添加代码：<form action="AddServlet" method="post"> <p><label> 主题 </label> <select name="topic_name"><% List<topicBean> list = (List<topicBean>) request.getAttribute("list");if (list = null | list.size() < 1) out.print("<tr><td bgcolor=#FFFFFF colspan=5>没有任何主题信息！</td></tr>"); else for (topicBean td : list)%><option value="<%=td.getTopic_name()%>"> <%=td.getTopic_name()%></option><%><%></select> </p> <p> <label> 标题 </label> <input name="title" type="text" class="opt_input" /> </p> <p> <label> 作者 </label> <input name="author" type="text" class="opt_input" /> </p> <p> <label> 摘要 </label> <textarea name="abstrate" cols="40" rows="3"></textarea> </p> <p> <label> 内容 </label> <textarea name="content" cols="70" rows="10"></textarea> </p> <p> <label> 上传图片 </label> <input name="pic_path" type="file" class="opt_input" /> </p> <input type="submit" value="提交" class="opt_sub" /> <input type="reset" value="重置" class="opt_sub" /></form>（2）新闻修改代码： <div style="margin:0 auto;width:947px;"> <h1 id="opt_type"> 修改新闻： </h1> <table width="100%" border="2" align="center" cellpadding="0"cellspacing="1" bgcolor="#666666"><tr><th bgcolor="#FFFFFF">主题</th><th bgcolor="#FFFFFF">标题</th><th bgcolor="#FFFFFF">作者</th><th bgcolor="#FFFFFF">摘要</th><th bgcolor="#FFFFFF">内容</th><th bgcolor="#FFFFFF">上传时间</th><th bgcolor="#FFFFFF">图片上传路径</th><th bgcolor="#FFFFFF">修改</th></tr><%List<XinwenBean> list = (List<XinwenBean>) request.getAttribute("list");if (list = null | list.size() < 1) out.print("<tr><td bgcolor=#FFFFFF colspan=5>没有任何新闻信息！</td></tr>"); else for (XinwenBean xw : list) %><tr align="center"><td bgcolor="#FFFFFF" ><%=xw.getTopic()%></td><td bgcolor="#FFFFFF"><%=xw.getTitle()%></td><td bgcolor="#FFFFFF"><%=xw.getAuthor()%></td><td bgcolor="#FFFFFF"><%=xw.getAbstrate()%></td><td bgcolor="#FFFFFF"><%=xw.getContent()%></td><td bgcolor="#FFFFFF"><%=xw.getTime()%></td><td bgcolor="#FFFFFF"><%=xw.getPic_path()%></td> <td bgcolor="#FFFFFF"> <form action="Update1.jsp" method="post"> <input type="hidden" name="time" value="<%=xw.getTime()%>"> <input type="submit" value="修 改"></form> </td></tr><%><% %></table><div width="98%" align="center" style="padding-top:10px;"> <%=request.getAttribute("bar")%></div></div>（3）新闻查询代码：<div style="margin:0 auto;width:947px;"> <h1 id="opt_type"> 查询新闻： </h1> <div style="height:100px;margin-top:50px;"> <form action="time.jsp" method="post"> 按时间查询：<input type="text" name="time" placeholder="2016-07-01" size="20px"> <input type="submit" value="查询"> </form></div><div style="height:100px"> <form action="author.jsp" method="post"> 按作者查询：<input type="text" name="author" placeholder="新华社" size="20px"> <input type="submit" value="查询"> </form></div> <div style="height:100px"> <form action="topic.jsp" method="post"> 按主题查询：<input type="text" name="topic" placeholder="军事" size="20px"> <input type="submit" value="查询"> </form></div> </div>（4）新闻删除代码 <div style="margin:0 auto;width:947px;"> <h1 id="opt_type"> 删除新闻： </h1> <table width="100%" border="2" align="center" cellpadding="0"cellspacing="1" bgcolor="#666666"><tr><th bgcolor="#FFFFFF">主题</th><th bgcolor="#FFFFFF">标题</th><th bgcolor="#FFFFFF">作者</th><th bgcolor="#FFFFFF">摘要</th><th bgcolor="#FFFFFF">内容</th><th bgcolor="#FFFFFF">上传时间</th><th bgcolor="#FFFFFF">图片上传路径</th><th bgcolor="#FFFFFF">删除</th></tr><%List<XinwenBean> list = (List<XinwenBean>) request.getAttribute("list");if (list = null | list.size() < 1) out.print("<tr><td bgcolor=#FFFFFF colspan=5>没有任何新闻信息！</td></tr>"); else for (XinwenBean xw : list) %><tr align="center"><td bgcolor="#FFFFFF" ><%=xw.getTopic()%></td><td bgcolor="#FFFFFF"><%=xw.getTitle()%></td><td bgcolor="#FFFFFF"><%=xw.getAuthor()%></td><td bgcolor="#FFFFFF"><%=xw.getAbstrate()%></td><td bgcolor="#FFFFFF"><%=xw.getContent()%></td><td bgcolor="#FFFFFF"><%=xw.getTime()%></td><td bgcolor="#FFFFFF"><%=xw.getPic_path()%></td> <td bgcolor="#FFFFFF"> <form action="DelServlet" method="post"> <input type="hidden" name="time" value="<%=xw.getTime()%>"> <input
