軟件架構(gòu)小組實驗報告13

1、中南大學(xué)軟件開發(fā)架構(gòu)平臺技術(shù)實驗報告姓 名：學(xué) 號：班 級：指導(dǎo)老師：完成時間：2014-05 實驗一 基于mvc的jpetstore開發(fā)一、完成項目的過程和時間安排完成過程：實驗由我們小組三人合作完成，考慮到我們對這個實驗相關(guān)的知識都還比較陌生，我們商量后決定每個人做自己的，遇到問題互相討論，最終我們小組成員也都先后完成實驗，達(dá)到實驗預(yù)期的目標(biāo)，完成了基于mvc的jpetstore的開發(fā)。時間安排：我們小組利用三天時間完成實驗，事先對相關(guān)知識的熟悉大概花費(fèi)了1天的時間，大部分的時間都用來編碼和調(diào)試。二、遇到的問題和解決方法 簡單的說一下做的過程中遇到的幾個問題，有些問題雖然看著很簡單，但是在

2、實驗過程中確實經(jīng)常因為一些很簡單的問題卡很久。問題1. 商品展示部分product只能顯示一條內(nèi)容解決方法：一開始是以為jsp頁面顯示出了問題，但是沒有檢查出結(jié)果，后來發(fā)現(xiàn)頁面顯示出的全都是每一個類型的第一條內(nèi)容，后來我開始在servlet方面查錯，通過一層層的調(diào)用system.out.println();方法，最終發(fā)現(xiàn)我在dao層的impl實現(xiàn)類中把while寫成了if，問題的原因也就顯而易見了。問題2. 在商品展示模塊，所有的圖片都無法正常顯示解決方法：經(jīng)過檢查jsp頁面內(nèi)容都沒有出錯，后來發(fā)現(xiàn)由于組織工程的文件夾內(nèi)容不同，在數(shù)據(jù)庫中的路徑寫的不一致，他用的是絕對路徑，我改成了相對路徑后問

3、題解決。問題3. 在編寫orderdaoimpl的過程中出現(xiàn)了時間類型不匹配的情況解決方法：一直報類型轉(zhuǎn)換錯誤的異常，我很奇怪異常中寫道必須為date類，可是確實用的date類的對象。后來通過上網(wǎng)查找問題發(fā)現(xiàn)這是由于pstatement.setdate 需要一個java.sql.date類的對象。而我傳給它的參數(shù)是一個java.util.date類的對象，于是我用這個的語句解決了這個問題：pstatement.setdate(3,new java.sql.date(order.getorderdate().gettime();問題4. 如何讀取checkbox中是否勾選信息解決方法：一開始我認(rèn)

4、為checkbox返回的是boolean類型的值，后來通過上網(wǎng)查資料發(fā)現(xiàn)，如果不勾選時checkbox所對應(yīng)屬性的值為null，于是我用了這樣的語句判斷是否勾選。boolean ship = request.getparameter(shippingaddressrequired)=null;account.setlistoption(request.getparameter(account.listoption).equals(true) ? true : false);問題5. 沒有找到例子中的合適的檢測是否登錄的方法解決方法：由于給的例子用了框架等方法，沒有找到可以用的檢測是否在登錄狀態(tài)

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;三、小組成員分工組長：張先凱小組三人均獨(dú)立完成實驗要求內(nèi)容實驗二 用ajax改進(jìn)用戶體驗一、 項目應(yīng)用了ajax技術(shù)的功能模塊以及有無使用框架。運(yùn)用了ajax技術(shù)的功能模塊：1. 賬號管理模塊。在新建賬號和修改賬號信息頁面上用ajax技術(shù)進(jìn)行表單驗證。包括密碼與二次輸入密碼是否一致，用戶名是否重復(fù)等等。2.商品查詢模塊。在首頁右上角的查詢商品中增加了自動補(bǔ)全功能，并可以用鼠標(biāo)和鍵盤上線移動選中高亮部分，輸入框的內(nèi)容也會隨著鼠標(biāo)鍵盤的移動而移動。3. 主頁商品展示模塊。在首頁展示商品的圖片上添加了ajax效果，即當(dāng)鼠標(biāo)移到某個商品圖片上時，用懸浮窗動態(tài)加載該類型商品的

8、信息。三個模塊中均未使用框架技術(shù)。二、 說明應(yīng)用ajax技術(shù)的理由、具體實現(xiàn)方法和核心源代碼。理由：將整個頁面刷新轉(zhuǎn)化為局部刷新功能，改進(jìn)響應(yīng)效果，增強(qiáng)用戶體驗。具體實現(xiàn)方法：1. 點(diǎn)擊按鈕或者鼠標(biāo)失焦等操作觸發(fā)ajax操作。2. 在js接收傳來的值，并利用json對象與服務(wù)器異步交互。在沒有接收到服務(wù)器的響應(yīng)之前，jsp頁面做出響應(yīng)的等待的響應(yīng)的反應(yīng)。3. 得到響應(yīng)后刷新相應(yīng)的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這里是響應(yīng)事件的function 其中包括獲取頁面search模塊中所有的標(biāo)簽并進(jìn)行了篩選，其中通過key的值屏蔽了除了字母之外其余輸入內(nèi)容的合法性，而且對于方向鍵的向上和向下進(jìn)行了處理，使得使用鍵盤時也可以獲取提示框中的內(nèi)容，對重復(fù)的代碼也進(jìn)行了封裝，封裝代碼在下面。上面的函數(shù)是對鍵盤處理功能中重復(fù)代碼的封裝處理，下面則是在搜選出應(yīng)修改內(nèi)容后對標(biāo)簽樣式的修改。這里是鼠標(biāo)處理，使用了和鍵盤處理相同的全局變量使得使用中視覺效果的同步。實驗效果圖：只輸入a：鼠標(biāo)或者鍵盤移動下去：模塊三：主頁商品展示模塊核心代碼：原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;/以下為鼠標(biāo)事件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;效果圖:上圖為鼠標(biāo)放在空白處時初始的界面。上圖為鼠標(biāo)放在鳥圖案時右下角出現(xiàn)的關(guān)于鳥的一些信息。其余圖案也有相同的效果。3、 小組成員分工及實驗體會小組成員分工：這次試驗中，第一個用戶登錄相關(guān)模塊由于比較簡單，三個人都做出一份結(jié)果。第二個搜索模塊由張先

30、凱獨(dú)立完成，第三個用戶商品展示模塊由胡濤和李靜濤合作完成。心得體會：通過實驗，我們了解到前端的內(nèi)容比較瑣碎，需要更加認(rèn)真仔細(xì)，由于我們基本不開設(shè)前端課程內(nèi)容，而它又是web開發(fā)中重要的一部分，需要我們在平時自學(xué)完成。實驗三 用struts 2重構(gòu)jpetstore1、 實驗結(jié)果（1） 在用struts 2重構(gòu)jpetstore之后主要有以下一些變化1.如下圖所示，原來的jsp頁面中的標(biāo)簽已經(jīng)被struts2自帶的標(biāo)簽所代替，方便以后添加輸入驗證等功能。2. web.xml文件中改為struts的默認(rèn)攔截器3. 原來web文件夾中的servlet已經(jīng)被action類代替。catalogactio

31、n.java 4.struts.xml配置文件中內(nèi)容 /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