软件架构小组实验报告13

1、中南大学软件开发架构平台技术实验报告姓 名：学 号：班 级：指导老师：完成时间：2014-05 实验一 基于mvc的jpetstore开发一、完成项目的过程和时间安排完成过程：实验由我们小组三人合作完成，考虑到我们对这个实验相关的知识都还比较陌生，我们商量后决定每个人做自己的，遇到问题互相讨论，最终我们小组成员也都先后完成实验，达到实验预期的目标，完成了基于mvc的jpetstore的开发。时间安排：我们小组利用三天时间完成实验，事先对相关知识的熟悉大概花费了1天的时间，大部分的时间都用来编码和调试。二、遇到的问题和解决方法 简单的说一下做的过程中遇到的几个问题，有些问题虽然看着很简单，但是在

2、实验过程中确实经常因为一些很简单的问题卡很久。问题1. 商品展示部分product只能显示一条内容解决方法：一开始是以为jsp页面显示出了问题，但是没有检查出结果，后来发现页面显示出的全都是每一个类型的第一条内容，后来我开始在servlet方面查错，通过一层层的调用system.out.println();方法，最终发现我在dao层的impl实现类中把while写成了if，问题的原因也就显而易见了。问题2. 在商品展示模块，所有的图片都无法正常显示解决方法：经过检查jsp页面内容都没有出错，后来发现由于组织工程的文件夹内容不同，在数据库中的路径写的不一致，他用的是绝对路径，我改成了相对路径后问

3、题解决。问题3. 在编写orderdaoimpl的过程中出现了时间类型不匹配的情况解决方法：一直报类型转换错误的异常，我很奇怪异常中写道必须为date类，可是确实用的date类的对象。后来通过上网查找问题发现这是由于pstatement.setdate 需要一个java.sql.date类的对象。而我传给它的参数是一个java.util.date类的对象，于是我用这个的语句解决了这个问题：pstatement.setdate(3,new java.sql.date(order.getorderdate().gettime();问题4. 如何读取checkbox中是否勾选信息解决方法：一开始我认

4、为checkbox返回的是boolean类型的值，后来通过上网查资料发现，如果不勾选时checkbox所对应属性的值为null，于是我用了这样的语句判断是否勾选。boolean ship = request.getparameter(shippingaddressrequired)=null;account.setlistoption(request.getparameter(account.listoption).equals(true) ? true : false);问题5. 没有找到例子中的合适的检测是否登录的方法解决方法：由于给的例子用了框架等方法，没有找到可以用的检测是否在登录状态

5、的类，于是我自己写了一个方法。public boolean getaccountbyusernameandpasswordonly(account account) boolean selectresult = false;connection connection = dbutil.getconnection();try preparedstatement pstatement = connection.preparestatement(getaccountbyusernameandpasswordonlysql);pstatement.setstring(1, account.getuse

6、rname();pstatement.setstring(2, account.getpassword();resultset resultset = pstatement.executequery();if (resultset.next() selectresult = true;dbutil.closeresultset(resultset);dbutil.closepreparedstatement(pstatement);dbutil.closeconnection(connection); catch (exception e) e.printstacktrace();return

7、 selectresult;三、小组成员分工组长：张先凯小组三人均独立完成实验要求内容实验二 用ajax改进用户体验一、 项目应用了ajax技术的功能模块以及有无使用框架。运用了ajax技术的功能模块：1. 账号管理模块。在新建账号和修改账号信息页面上用ajax技术进行表单验证。包括密码与二次输入密码是否一致，用户名是否重复等等。2.商品查询模块。在首页右上角的查询商品中增加了自动补全功能，并可以用鼠标和键盘上线移动选中高亮部分，输入框的内容也会随着鼠标键盘的移动而移动。3. 主页商品展示模块。在首页展示商品的图片上添加了ajax效果，即当鼠标移到某个商品图片上时，用悬浮窗动态加载该类型商品的

8、信息。三个模块中均未使用框架技术。二、 说明应用ajax技术的理由、具体实现方法和核心源代码。理由：将整个页面刷新转化为局部刷新功能，改进响应效果，增强用户体验。具体实现方法：1. 点击按钮或者鼠标失焦等操作触发ajax操作。2. 在js接收传来的值，并利用json对象与服务器异步交互。在没有接收到服务器的响应之前，jsp页面做出响应的等待的响应的反应。3. 得到响应后刷新相应的div或者控件或者显示加载失败。核心源代码：模块一：账号管理模块newaccount.jspjs代码：var xmlhttprequest;function createxmlhttprequest()if (wind

9、ow.xmlhttprequest) /非ie浏览器xmlhttprequest = new xmlhttprequest();else if (window.activeobject)/ie6以上版本的ie浏览器xmlhttprequest = new activeobject(msxml2.xmlhttp);else /ie6及以下版本ie浏览器xmlhttprequest = new activeobject(microsoft.xmlhttp);function usernameisexist() var username = document.registerform.usernam

10、e.value;sendrequest(usernameisexist?username= + username);function sendrequest(url) createxmlhttprequest();xmlhttprequest.open(get, url, true);xmlhttprequest.onreadystatechange = processresponse;xmlhttprequest.send(null);function processresponse() if (xmlhttprequest.readystate = 4) if (xmlhttpreques

11、t.status = 200) var responseinfo = xmlhttprequest.responsexml.getelementsbytagname(msg)0.firstchild.data;var div1 = document.getelementbyid(usernamemsg);if (responseinfo = exist) div1.innerhtml = username is unavailable.; else div1.innerhtml = available username;/以下是我自己写的function passwordiscorrect()

12、 var password = document.registerform.password.value;var repeatedpassword = document.registerform.repeatedpassword.value;createxmlhttprequest();xmlhttprequest.open(get, samepassword?password= + password + &repeatedpassword= + repeatedpassword, true);xmlhttprequest.onreadystatechange = processrespons

13、e1;xmlhttprequest.send(null);function processresponse1() if (xmlhttprequest.readystate = 4) if (xmlhttprequest.status = 200) var responseinfo = xmlhttprequest.responsexml.getelementsbytagname(msg)0.firstchild.data;var div2 = document.getelementbyid(passwordmsg);if (responseinfo = yes) div2.innerhtml

14、 = the two passwords are same.; else div2.innerhtml = the two passwords are not the same.;原jsp页面修改：user id:$sessionscope.account.usernamenew password:repeat password:servlet：usernameisexistservlet.javapackage org.csu.myjpetstore.web;import java.io.ioexception;import java.io.printwriter;import javax.

15、servlet.servletexception;import javax.servlet.http.httpservlet;import javax.servlet.http.httpservletrequest;import javax.servlet.http.httpservletresponse;import org.csu.myjpetstore.domain.account;import org.csu.myjpetstore.service.accountservice;public class usernameisexistservlet extends httpservle

16、t public usernameisexistservlet() super();public void doget(httpservletrequest request, httpservletresponse response)throws servletexception, ioexception dopost(request,response);public void dopost(httpservletrequest request, httpservletresponse response)throws servletexception, ioexception string u

17、sername = request.getparameter(username);account account = new account();account.setusername(username);accountservice service = new accountservice();response.setcontenttype(text/xml;charset=utf-8);printwriter out = response.getwriter();if(service.usernameisexist(account)out.println(exist);else out.p

18、rintln(notexist);out.flush();out.close();public void init() throws servletexception public void destroy() super.destroy();samepasswordservlet.javapackage org.csu.myjpetstore.web.ajax;import java.io.ioexception;import java.io.printwriter;import javax.servlet.servletexception;import javax.servlet.http

19、.httpservlet;import javax.servlet.http.httpservletrequest;import javax.servlet.http.httpservletresponse;public class samepasswordservlet extends httpservlet public samepasswordservlet() super();public void doget(httpservletrequest request, httpservletresponse response)throws servletexception, ioexce

20、ption dopost(request,response);public void dopost(httpservletrequest request, httpservletresponse response)throws servletexception, ioexception string password = request.getparameter(password);string repeatedpassword = request.getparameter(repeatedpassword);system.out.println(password+repeatedpasswo

21、rd);response.setcontenttype(text/xml;charset=utf-8);printwriter out = response.getwriter();if(repeatedpassword.equals(password)out.println(yes);else out.println(no);out.flush();out.close();public void init() throws servletexception public void destroy() super.destroy(); 效果截图：模块二：商品查询模块核心代码：原jsp页面修改

22、includetop.jsp:页面中的js代码:声明全局变量和xrl这里是响应事件的function 其中包括获取页面search模块中所有的标签并进行了筛选，其中通过key的值屏蔽了除了字母之外其余输入内容的合法性，而且对于方向键的向上和向下进行了处理，使得使用键盘时也可以获取提示框中的内容，对重复的代码也进行了封装，封装代码在下面。上面的函数是对键盘处理功能中重复代码的封装处理，下面则是在搜选出应修改内容后对标签样式的修改。这里是鼠标处理，使用了和键盘处理相同的全局变量使得使用中视觉效果的同步。实验效果图：只输入a：鼠标或者键盘移动下去：模块三：主页商品展示模块核心代码：原jsp页面修改

23、main.jsp js代码:* .b margin:0px; padding:0px; overflow:auto; .line0 line-height:20px; background-color:orange; padding:0px 15px; .line1 line-height:18px; background-color:orange; padding:0px 10px; .w display:none;position:absolute; right:10px; bottom:10px; width:160px; height:240px; overflow:hidden; b

24、order:2px groove #281; cursor:default; -moz-user-select:none; .t line-height:20px; height:20px; width:160px; overflow:hidden; background-color:orange; color:white; font-weight:bold; border-bottom:1px outset blue; text-align:center; .winbody height:218px; width:160px; overflow-x:hidden; overflow-y:au

25、to; border-top:1px inset blue; padding:10px; text-indent:10px; background-color:white; .seletcted background-color:gray;/以下为鼠标事件function birdshow()var str11 = ;str11 += aboutbirds;str11 += av-cb-01:amazon parrot av-sb-02: finch;document.getelementbyid(div2).innerhtml = str11;document.getelementbyid(

26、div2).style.display = block;function birdshowoff() var str12 = ; document.getelementbyid(div2).innerhtml = str12;document.getelementbyid(div2).style.display = none;function fishshow()var str21 = ;str21 += aboutfish;str21 += fi-fw-01:koi fi-fw-02:goldfish fi-sw-01:angelfish fi-sw-02:tiger shark;docum

27、ent.getelementbyid(div2).innerhtml = str21;document.getelementbyid(div2).style.display = block;function dogshow()var str31 = ;str31 += aboutdogs;str31 += k9-bd-01:bulldog k9-cw-01:chihuahua k9-dl-01:dalmation k9-po-02:poodle k9-rt-01:golden retriever k9-rt-02:labrador retriever;document.getelementby

28、id(div2).innerhtml = str31;document.getelementbyid(div2).style.display = block;function reptileshow()var str41 = ;str41 += aboutreptiles;str41 += rp-li-02:iguana rp-sn-01:rattlesnake;document.getelementbyid(div2).innerhtml = str41;document.getelementbyid(div2).style.display = block;function catshow(

29、)var str51 = ;str51 += aboutcats;str51 += fl-dlh-02:persian fl-dsh-01:manx;document.getelementbyid(div2).innerhtml = str51;document.getelementbyid(div2).style.display = block;效果图:上图为鼠标放在空白处时初始的界面。上图为鼠标放在鸟图案时右下角出现的关于鸟的一些信息。其余图案也有相同的效果。3、 小组成员分工及实验体会小组成员分工：这次试验中，第一个用户登录相关模块由于比较简单，三个人都做出一份结果。第二个搜索模块由张先

30、凯独立完成，第三个用户商品展示模块由胡涛和李静涛合作完成。心得体会：通过实验，我们了解到前端的内容比较琐碎，需要更加认真仔细，由于我们基本不开设前端课程内容，而它又是web开发中重要的一部分，需要我们在平时自学完成。实验三 用struts 2重构jpetstore1、 实验结果（1） 在用struts 2重构jpetstore之后主要有以下一些变化1.如下图所示，原来的jsp页面中的标签已经被struts2自带的标签所代替，方便以后添加输入验证等功能。2. web.xml文件中改为struts的默认拦截器3. 原来web文件夹中的servlet已经被action类代替。catalogactio

31、n.java 4.struts.xml配置文件中内容 /web-inf/jsp/catalog/main.jsp/web-inf/jsp/catalog/category.jsp/web-inf/jsp/catalog/product.jsp/web-inf/jsp/catalog/item.jsp/web-inf/jsp/catalog/searchproducts.jsp/web-inf/jsp/account/signon.jsp/web-inf/jsp/catalog/main.jsp/web-inf/jsp/catalog/main.jsp/web-inf/jsp/account/signon.jsp/help.html/web-inf/jsp/account/editaccount.jsp/web-inf/jsp/catalog/main.jsp/web-inf/jsp/account/newaccount.jsp/web-inf/jsp/catalog/main.jsp/web-inf/jsp/cart/cart.jsp/web-inf/jsp/cart/cart.jsp/web-inf/jsp/cart/cart.jsp/web-inf/jsp/cart/cart.jsp/web-inf/jsp/order/ne