javaweb 电子相册 报告.doc

河 北 科 技 大 学信息科学与工程学院实 训 报 告学生姓名： 王 伟 学 号： 08L0705219 专业班级： 软 件 工 程 L082 实训地点： 信息楼A303 实训时间： 2011.12.5 -2012.01.13 指导教师： 张 晓 明 2 012 年 1 月实训成绩评定表学生姓名王伟学 号08L0705219成绩专业班级软件L082起止时间2011.12.05-2012.01.13实训地点信息楼A303指导教师评语 指导教师： 年 月 日目录一、实训目的4二、实训任务与要求4三、实训过程与内容41、需求分析41.1总体需求41.2功能需求51.3 系统用例图52、Java Web 应用程序工程制作流程62.1开发环境搭建62.2 系统设计63、实现过程93.1 JDBC连接数据库93.2 创建数据库的连接93.3创建一个Statement103.4 执行SQL语句103.5JavaBean与DAO模式113.6文件上传114、关键问题与实现结果12四、实训总结与心得体会13五、参考文献14一、实训目的本实训课程是在学生具备了Java 程序设计知识与面向对象技术的基础上，为进一步提高项目实践能力、开拓创新能力而设置的实践性环节课程。目的掌握使用JSP应用程序设计的基本技能，熟练使用MyEclipse进行Web应用程序的编写、调试，详细说明Java Web软件项目的整个开发过程，在项目开发过程中逐步熟悉知识点，掌握Java B/S结构程序的运行原理和应用技能，最后完成一个完整的软件开发项目二、实训任务与要求掌握Java集成开发环境（IDE）Eclipse的使用和调试方法，利用JSP+Servlet+JavaBean实现Web应用开发，掌握分层体系结构开发的技巧，完成教师指定的开发任务，本实训课程是围绕一个完整的Java项目而展开的，虽然每部分内容相对独立，但通过几次迭代开发后，最后形成一个完整的软件系统。任务：通过实训课程结合实际案例独立完成web电子相册前台、后台的设计制作，并编码实现。三、实训过程与内容1、需求分析1.1 总体需求该设计系统要具有实用性，功能完善，界面良好。设计该系统的流程如图1所示。功能需要流程设计： 程序设计：开始程序初始化页面设计条件数据库设计代码操作代码设计图1 程序设计流程图1.2 功能需求本系统应该具有登录验证、修改密码、创建相册、浏览相片、上传相片、删除相册或相片、发表留言等功能，详见图2。电子相册系统退出登录添加评论删除相册相片添加图片查看图片创建相册修改密码登录验证图2 电子相册系统功能结构图1.3 系统用例图1.3.1 用户用例普通用户登录系统后，可以点击缩略图的图片名称或者图片进而浏览大图，并在此基础上为此大图添加评论，同样，用户也可以在查看大图的同时，查看其他用户对该图片的评论，如图3所示图3.普通用户用例图1.3.2 管理员用例管理员需要验证登录密码登录后台，当然可以修改管理员密码，然后，管理员可以创建、删除、修改图片分类，进而可以在每个分类目录下上传自己喜欢的图片，其中，管理员还有权删除游客对所上传照片的负面评论，如图4 所示。图4管理员用例图2、Java Web 应用程序工程制作流程2.1开发环境搭建在MyEclipse中配置好Tomcat服务器，配置好MySQL数据库在MyEclipse中利用jdbc驱动访问MySQL数据库，利用MyEclipse部署Web应用程序，在MySQL创建用户表。MySQL的数据库编码设置为UTF-8，这样有利于Web项目开发时，中文编码的一致性。MyEclipse中Tomcat服务器的设置时，要将JVM设置为本机的JDK安装路径，而非JRE的路径，使用navicate lite创建用户表。2.2 系统设计该项目页面设计上，采用了“障眼法”，在用户点击导航栏上的相应链接时，页面会跳转到各个相应模块，但是用户感觉只是其中一部分变化而已，实则不然，在页面布局设计上，应用jsp 的include功能，预先做出页面头，导航，以及尾部的jsp文件，并include进所有的jsp文件，在用户点击导航条时，其实各个页面的头，导航，尾部也被该页面内include的头，导航，尾部所替代，只是在用户感官上没有差异而已。2.2.1 登录验证登录页面是电子相册的首页，这是对浏览该电子相册的用户的筛选一个步骤，用户只有提供正确的密码才能进入相册主页进行其他操作。流程描述在URL栏里输入http：/localhost/ephoto/login.html便可进入“登录页面”，如果在密码框内输入密码，系统会把其与之前给密码赋的值进行比对，相匹配则登录成功，跳转至相册主页；否则返回登录页面。流程、代码及运行结果详见图5、图6、图7所示。 输入正确输入密码进入相册主页YESNO登录页面开始登录登录结束 图 5 登录验证图图 6 验证登录用户名密码代码图 7 电子相册登录页面2.2.2 相册主页相册主页是用户展示相片的页面，对该系统的相册和相片一览无余。同时它也是电子相册的“导航”，可以链接到上传照片、创建相册、修改密码、发表留言、返回主页、退出登录等功能。在“登录页面”输入正确的密码后方可进入“相册主页”，如图8所示。用户可直接或用打开相册的方式浏览主页上的照片和相册里的照片，如图9所示。点击主页左方的各种链接可以进入相应的操作，进入其他功能界面。图8 管理员进入相册主页图 9 用户（游客）进入相册主页2.2.3 修改密码用户可以根据自己的需要来修改自己的登录密码。通过“相册主页”左侧的链接点击“修改密码”进入到“修改密码页面”，根据提示输入修改后的密码，选择提交，则显示“密码修改成功！”。修改密码完成后，可选择界面上方的“返回主页”和“退出登录”执行相关的操作。操作代码及运行结果如图10、图11所示。图10 管理员修改密码代码图11 修改密码页面2.2.4创建相册用户可以根据自己的需要来创建新的相册，把照片分类。通过“相册主页”左侧的链接点击“创建相册”进入到“创建目录页面”，根据提示输入新创建的相册名称，选择创建，则新建相册成功，转到新建的相册里。创建相册完成后，可选择界面上方的“返回主页”和“退出登录”执行相关的操作。操作代码及运行结果如图12、图13所示。图12 添加分类 代码图13添加分类页面2.2.5 上传照片用户可以根据自己的需要上传照片。通过“相册主页”左侧的链接点击“上传照片”进入到“上传照片页面”，根据提示输入选择上传方式。如果从本地上传，选择“浏览”在本地打开一张照片，点击“上传”则上传照片成功，否则提示“上传文件出错”。上传照片完成后，返回到相册主页或某相册。如果使用URL方式上传，输入网址选择“传送”则上传照片成功，否则提示“文件出错”。创建相册完成后，可选择界面上方的“返回主页”和“退出登录”执行相关的操作。操作代码及运行结果如图14、图15所示。图14 上传图片代码图15 添加图片页面2.2.6 删除相册、照片用户可以根据自己的需要删除相册或照片。每个相册和每张照片后面都有“删除”的字样，点击后会出现提示“是否删除”，选择确认则删除成功，返回相册主页；选择取消则无变化，返回相册主页。图片操作代码及运行界面如图16、图17所示。图 16删除图片代码图17 图片操作页面2.2.7 退出登录用户可以根据自己的需要退出登录。用户只要点击“退出登录”，就返回到“登入页面”。2.2.8 数据库设计本系统的数据库MySQL是链接到留言板的功能，创建表、编写代码、链接数据库是DAO类实现的。只要输入正确的口令、进入“相册主页”，就可通过“相册主页”左侧的链接点击“发表留言”进入到“我的留言板”，根据界面上的提示，可选择“发表留言”、“浏览留言”、“返回主页”、“退出登录”中的任一项进行相应的操作。选择界面上方的“发表留言”后会出现用户、标题、内容提示框，填写内容后提交留言，成功则出现“浏览留言页面”，否则则提示错误。选择“浏览留言”，直接转至“浏览留言页面”，可浏览所有的留言，点击“下一页”则跳转至第二页的留言内容，同样还可选择“上一页”、“首页”、“尾页”，执行相应的操作。选择“返回主页”和“退出登录”也分别对应着相关的操作。数据库表如下表所示表1类别表表2 图片表表3 用户表表4 评论表3、实现过程3.1 JDBC连接数据库 创建一个以JDBC连接数据库的程序，包含7个步骤：加载JDBC驱动程序：在连接数据库之前，首先要加载想要连接的数据库的驱动到JVM（Java虚拟机）,这通过java.lang.Class类的静态方法forName(String className)实现。例如：try /加载MySql的驱动类Class.forName(com.mysql.jdbc.Driver); catch(ClassNotFoundExceptione) System.out.println(找不到驱动程序类，加载驱动失败！); e.printStackTrace(); 成功加载后，会将Driver类的实例注册到DriverManager类中。提供JDBC连接的URL 连接URL定义了连接数据库时的协议、子协议、数据源标识。书写形式：协议：子协议：数据源标识 。协议：在JDBC中总是以jdbc开始 。子协议：是桥连接的驱动程序或是数据库管理系统名称。数据源标识：标记找到数据库来源的地址与连接端口。例如：（MySql的连接URL） jdbc:mysql:/localhost:3306/test?useUnicode=true&characterEncoding=gbk;useUnicode=true：表示使用Unicode字符集。如果characterEncoding设置为gb2312或GBK，本参数必须设置为true。characterEncoding=gbk：字符编码方式。3.2 创建数据库的连接要连接数据库，需要向java.sql.DriverManager请求并获得Connection对象， 该对象就代表一个数据库的连接。使用DriverManager的getConnectin(Stringurl,Stringusername,Stringpassword)方法传入指定的欲连接的数据库的路径、数据库的用户名和密码来获得。例如：/连接MySql数据库，用户名和密码都是rootStringurl=jdbc:mysql:/localhost:3306/test;Stringusername=root; Stringpassword=root;try Connectioncon=DriverManager.getConnection(url,username,password); catch(SQLExceptionse) System.out.println(数据库连接失败！); se.printStackTrace(); 3.3创建一个Statement要执行SQL语句，必须获得java.sql.Statement实例，Statement实例分为以下3种类型：（1）、执行静态SQL语句。通常通过Statement实例实现。（2）、执行动态SQL语句。通常通过PreparedStatement实例实现。（3）、执行数据库存储过程。通常通过CallableStatement实例实现。具体的实现方式：Statementstmt=con.createStatement(); PreparedStatementpstmt=con.prepareStatement(sql); CallableStatementcstmt=con.prepareCall(CALLdemoSp(?,?)3.4 执行SQL语句Statement接口提供了三种执行SQL语句的方法：executeQuery、executeUpdate 和execute（1）、ResultSetexecuteQuery(StringsqlString)：执行查询数据库的SQL语句 ，返回一个结果集（ResultSet）对象。（2）、intexecuteUpdate(StringsqlString)：用于执行INSERT、UPDATE或 DELETE语句以及SQLDDL语句，如：CREATETABLE和DROPTABLE等 。（3）、execute(sqlString):用于执行返回多个结果集、多个更新计数或二者组合的 语句。 3.5JavaBean与DAO模式JavaBean是数据的承载体，负责把一组有逻辑的数据从一个层传到另一个层。 DAO的出现是对持久层的变动的一个解决方案。对于不同的持久介质(RDBMS、XML、ODBMS等)、不同的提供厂商(Oracle、Mysql等)提供的产品，进行持久化操作时，对于业务逻辑层应该是统一的，于是DAO模式就出现了。对于同一个业务操作，例如添加一个用户，请求到达业务层，只需调用DAO层的addUser()即可。而到底是怎么添加的、以及添加到哪里，是业务层不用关心的，也是不要关心的。于是，持久层将利用业务层传递来的请求数据，即封装了要添加的用户信息JavaBean，添加到持久层：Oracle就要取序列，Mysql会自动增长，XML就要手动控制了。这些实现细节对业务逻辑层是一样的效果。但是DAO模式中也会有一些数据承载体，不过它们承载的不是业务数据，而是持久化操作的相关对象，例如DAO对象，DAO工厂，连接对象等。表面上看，这些也承载数据，但它实际是包含了内在的逻辑和操作。例如连接对象的打开和关闭，事务的回滚和提交等。所以，严格意义上来说，它们不是纯粹的JavaBean。纯粹的JavaBean是只包含属性和这些属性对应的getter和setter。3.6文件上传这部分比较不容易实现，需要非常的有耐心和毅力，计算用户上传的原图和缩放后的小图，并把图片改成jpeg的编码。现在将关键代码附上：new_w = Math.round(old_w / tempdouble);new_h = Math.round(old_h / tempdouble);/计算新图长宽BufferedImage tag = new BufferedImage(new_w, new_h,BufferedImage.TYPE_INT_RGB);tag.getGraphics().drawImage(src, 0, 0, new_w, new_h,null); /绘制缩小后的图FileOutputStream newimage = new FileOutputStream(saveurl+newfilename_min ); JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(newimage);encoder.encode(tag); /近JPEG编码下面代码是将取得的文件重新以上传时间命名，并用原图的扩展名加载取得的时间后面形成新文件的名称，同时在文件夹内生成缩略图，String filedName=item.getFieldName();String fileName=item.getName();File f=new File(fileName);String ext =fileName.substring(fileName.lastIndexOf(.);String contentType=item.getContentType();boolean isInMemory=item.isInMemory();long sizeInBytes=item.getSize();PhotoDAO photoDAO=new PhotoDAO();String saveurl=request.getSession().getServletContext().getRealPath(/)+uploadimage;String newfilenamewithext=newphotoname + ext;4、关键问题与实现结果在servlet中，一般跳转都发生在doGet, doPost等方法里面。redirect 方式：response.sendRedirect(/a.jsp)，页面的路径是相对路径。sendRedirect可以将页面跳转到任何页面，不一定局限于本web应用中跳转后浏览器地址栏变化。这种方式要传值出去的话，只能在url中带parameter或者放在session中，无法使用request.setAttribute来传递。Forward 方式，RequestDispatcher dispatcher =request.getRequestDispatcher(“a.jsp”);dispatcher .forward(request, response)，页面的路径是相对路径。forward方式只能跳转到本web应用中的页面上。跳转后浏览器地址栏不会变化。使用这种方式跳转，传值可以使用三种方法：url中带parameter，session，request.setAttribute。本次项目的关键问题在于图片上传以及通过图片管理显示图片的缩略图，图片上传后会在对应文件夹内生成两张一上传时间为名称的图片，其中一张是后缀有_min的，这就是缩略图，另外一张则是管理员上传的大图，通过点击缩略图或其名称打开，用户可以查看大图，并针对相应的图片添加评论，其次，在分类管理中，管理员可以对分类的名称和分类的说明进行修改删除等操作，特别需要注意的是，在用户点击删除分类时，程序会将该分类下所有图片一并删除，这也是该程序的缺点所在。该程序所实现的结果是管理员通过管理员登录，成功登录系统后，添加分类、说明，并在该分类中成功添加、删除图片，并可进入相应的分类内管理图片，可对图片进行编辑，删除评论等操作。游客进入系统，可以查看自己喜欢的图片，并可点击查看大图，在大图中添加自己的评论，同时游客也可注册用户名，进而登录系统，创建自己的分类，上传自己的图片等完成管理员的所有操作。实现结果如图18、图19所示。图18 实现用户浏览图片图19用户评论图片页面四、实训总结与心得体会通过这一个月的实训，虽然倍感纠结，但是却收获颇丰，我不仅有了学习上的成果的喜悦，而且自己也日渐成熟，较之参加实训之前，有种说不出的成就感。当我正式准备接受java web 的实训课程时，让我倍感兴奋，虽然平时也学java编程，但是那些都是学的皮毛而已，没有真正应用到实际例子中，也很难发现自己的不足，这次实训，老师先教我们配置JAVA的编程工具和运行环境，然后教我们学JSP，在此期间，我们自学了JAVA，又学了Tomcat的使用及MySql和HTML语言，当我们JSP入门后，教我们学会了Javaweb的使用。老师的细心辅导下，我们有了很大的进步，知识得到了扩充，认识得到了加深，也使得我们的自学能力得到了很大的提高，在此，我向老师表示由衷地感谢。开始的学习让我感到任务的艰巨，遇到了平时学习未遇到过的困难，有时冥思苦想也无济于事，通过请教老师和其他同学，我顺利攻破一道道难关。特别是对于文件上传的代码，由于老师给的参考文件与自己所做的项目文件差别很大，所以在上传文件时，错误总是层出不穷，让我深受打击，好在在老师的帮助下，终于发现原来是图片的扩展名不匹配造成。这次学习让我对java web