第第頁(yè)共29頁(yè)基于JAVAEE的電子商務(wù)網(wǎng)站的設(shè)計(jì)與開(kāi)發(fā)摘要JavaEE技術(shù)無(wú)疑是當(dāng)今因特網(wǎng)大型應(yīng)用的最佳技術(shù)方案之一，圍繞JavaEE技術(shù)的應(yīng)用性，也產(chǎn)生了大量的Web開(kāi)發(fā)框架，它們極大地提升了JavaEE技術(shù)的易用性。本文描述了JavaEE的相關(guān)技術(shù)，比如說(shuō)Struts2，Hibernate，Spring等，以及一些前臺(tái)JS框架，如jQuery。并用這些技術(shù)完成一個(gè)基于Web的電子商務(wù)管理系統(tǒng)，并開(kāi)發(fā)并實(shí)現(xiàn)其中的全部功能模塊。電子商務(wù)管理系統(tǒng)是如今信息行業(yè)流行的，基于WEB技術(shù)的一套成熟的項(xiàng)目，本系統(tǒng)采用了更加實(shí)用和方便的B/S結(jié)構(gòu)。采用了JavaEE平臺(tái)下的JSP作為開(kāi)發(fā)平臺(tái)，數(shù)據(jù)庫(kù)采用MySQL，最終完成了程序的具體設(shè)計(jì)。本系統(tǒng)設(shè)計(jì)的目的是通過(guò)網(wǎng)頁(yè)使用戶(hù)實(shí)現(xiàn)購(gòu)物。關(guān)鍵詞互聯(lián)網(wǎng)電子商務(wù)JAVAWEBTOC\o"1-3"\h\u目錄TOC\o"1-1"\h\u285681引言2109112系統(tǒng)開(kāi)發(fā)背景3197833B/S架構(gòu)4110194系統(tǒng)需求分析54.1功能需求分析54.2性能需求分析64.3可行性分析74.4系統(tǒng)用例分析8157975網(wǎng)站的設(shè)計(jì)155.1界面顯示模塊設(shè)計(jì)155.2數(shù)據(jù)存儲(chǔ)模塊設(shè)計(jì)155.3第三方插件的使用介紹1692485.4版本管理工具的使用18191536系統(tǒng)實(shí)現(xiàn)及關(guān)鍵問(wèn)題206.1界面顯示模塊設(shè)計(jì)206.2數(shù)據(jù)操作模塊設(shè)計(jì)216.3網(wǎng)絡(luò)模塊設(shè)計(jì)24133467系統(tǒng)配置2623987總結(jié)27參考文獻(xiàn)29TOC\o"1-1"\h\u1引言在中國(guó)經(jīng)濟(jì)社會(huì)突飛猛進(jìn)的今天，各種行業(yè)和技術(shù)日新月異。在過(guò)去的一年，JAVA語(yǔ)言的依賴(lài)已更新到第12個(gè)版本了。各種編程語(yǔ)言也開(kāi)始流行，如Python、PHP等。各種技術(shù)也引起了人們的關(guān)注，如人工智能、混合現(xiàn)實(shí)技術(shù)、AR、VR技術(shù)、全息投影等。在互聯(lián)網(wǎng)+的風(fēng)口浪尖的時(shí)代，我們應(yīng)該不斷學(xué)習(xí)新的知識(shí)。我相信每個(gè)人都像我一樣對(duì)這些技術(shù)感興趣。興趣是學(xué)習(xí)的動(dòng)力。我嘗試學(xué)過(guò)python和c++,可惜時(shí)間與資源有限，只能學(xué)的很淺。不過(guò)當(dāng)我用python與c++運(yùn)行出我想要的程序時(shí)，我很興奮，更加喜歡這些技術(shù)。進(jìn)入正題，JAVA語(yǔ)言我認(rèn)為是一門(mén)偏后端的技術(shù)成果。因?yàn)殚T(mén)技術(shù)跟服務(wù)器這打交道，如mybatis，jdbc等技術(shù)。它經(jīng)常連接到關(guān)系數(shù)據(jù)庫(kù)MYSQL，是一些中小型企業(yè)的最佳選擇。隨著移動(dòng)互聯(lián)網(wǎng)技術(shù)的興起以及互聯(lián)網(wǎng)信息技術(shù)應(yīng)用的廣泛展開(kāi),電子商務(wù)管理技術(shù)的廣泛運(yùn)用已經(jīng)變成了一種現(xiàn)實(shí)。但當(dāng)前市場(chǎng)經(jīng)濟(jì)環(huán)境下優(yōu)秀的電子商務(wù)網(wǎng)站工程項(xiàng)目實(shí)施技術(shù)人員十分短缺,為了適應(yīng)行業(yè)的要求和對(duì)于社會(huì)所培養(yǎng)緊缺電子商務(wù)管理系統(tǒng)的開(kāi)發(fā)和項(xiàng)目建設(shè)力量,結(jié)合網(wǎng)絡(luò)互聯(lián)技術(shù)設(shè)計(jì)出了電子商務(wù)管理系統(tǒng),使程序與現(xiàn)實(shí)一體化。電子商務(wù)網(wǎng)站是一款模擬實(shí)際用戶(hù)在網(wǎng)上購(gòu)物狀況、覆蓋各種對(duì)商品的控制操作，用戶(hù)登錄、注冊(cè)、找回密碼、購(gòu)物主頁(yè)、購(gòu)買(mǎi)提交、我的購(gòu)物車(chē)等。電子商務(wù)系統(tǒng)可以方便用戶(hù)通過(guò)網(wǎng)頁(yè)操作他們想要購(gòu)買(mǎi)的產(chǎn)品。2系統(tǒng)開(kāi)發(fā)背景隨著移動(dòng)互聯(lián)網(wǎng)技術(shù)的興起以及互聯(lián)網(wǎng)信息技術(shù)應(yīng)用的廣泛展開(kāi),使得電子商務(wù)管理技術(shù)的廣泛應(yīng)用成為現(xiàn)實(shí)。但是當(dāng)前市場(chǎng)環(huán)境下關(guān)于電子商務(wù)管理的技術(shù)研發(fā)和項(xiàng)目工程實(shí)施的技術(shù)人員十分短缺,適應(yīng)了行業(yè)的發(fā)展需求我們B/S的架構(gòu)設(shè)計(jì)這套專(zhuān)門(mén)為社會(huì)培育緊缺網(wǎng)站開(kāi)發(fā)技術(shù)的系統(tǒng)。主要以專(zhuān)門(mén)針對(duì)行業(yè)真實(shí)運(yùn)用的系統(tǒng)層次實(shí)訓(xùn)教學(xué)環(huán)境為依托,培養(yǎng)大學(xué)生自身在互聯(lián)網(wǎng)技術(shù)應(yīng)用研究開(kāi)發(fā)過(guò)程中的軟硬相結(jié)合。3B/S架構(gòu)隨著社會(huì)的迅速發(fā)展,瀏覽器市場(chǎng)也得到迅速發(fā)展,人們對(duì)瀏覽器的要求也越來(lái)越高,每個(gè)人手機(jī)上都有一款可以用于瀏覽網(wǎng)頁(yè)。隨著互聯(lián)網(wǎng)技術(shù)的興起，C/S體系結(jié)構(gòu)的改變或改進(jìn)。在這種架構(gòu)下，用戶(hù)界面是通過(guò)WWW瀏覽器實(shí)現(xiàn)的，很少一部分事務(wù)邏輯可以在瀏覽器中實(shí)現(xiàn)，然而，主要的三層事務(wù)處理邏輯需要在服務(wù)器端實(shí)現(xiàn)三層，形成我們所說(shuō)的三層三層結(jié)構(gòu)。B/S網(wǎng)絡(luò)架構(gòu)設(shè)計(jì)是自從2000年web網(wǎng)絡(luò)技術(shù)開(kāi)始興起以來(lái)的一種新型網(wǎng)絡(luò)應(yīng)用架構(gòu)設(shè)計(jì)模型,web網(wǎng)絡(luò)瀏覽器已經(jīng)發(fā)展成為目前客戶(hù)端應(yīng)用最主流的網(wǎng)絡(luò)應(yīng)用程序。這種工作模式將整個(gè)服務(wù)器和系統(tǒng)客戶(hù)端完全直接統(tǒng)一，將系統(tǒng)的所有功能和能實(shí)現(xiàn)目標(biāo)的核心部件完全集中在一臺(tái)服務(wù)器上，簡(jiǎn)化整個(gè)系統(tǒng)的基本設(shè)計(jì)、維護(hù)和日常使用。只需在客戶(hù)端上重新安裝web瀏覽器，您就可以直接在線訪問(wèn)公司的網(wǎng)站。4系統(tǒng)需求分析4.1功能需求分析4.1.1用戶(hù)基本功能4.1.1用戶(hù)基本功能需求用戶(hù)登錄電子商務(wù)管理系統(tǒng)，基本功能應(yīng)該有用戶(hù)登錄、用戶(hù)注冊(cè)、找回密碼、購(gòu)物等基本功能。當(dāng)用戶(hù)進(jìn)入到主頁(yè)面時(shí)，用戶(hù)在不登錄的情況下可也查詢(xún)直接喜歡的商品以及瀏覽頁(yè)面上的所有物品，但是當(dāng)用戶(hù)想查看物品詳情以及購(gòu)買(mǎi)此商品時(shí)，頁(yè)面將會(huì)跳轉(zhuǎn)到用戶(hù)登錄。4.1.2用戶(hù)購(gòu)物需求管理當(dāng)用戶(hù)想購(gòu)買(mǎi)一件商品時(shí)，前提是用戶(hù)必須要是個(gè)登錄的狀態(tài)。用戶(hù)點(diǎn)擊購(gòu)買(mǎi)按鈕時(shí)，系統(tǒng)將會(huì)讓用戶(hù)填寫(xiě)一系列的信息，包括用戶(hù)名、手機(jī)號(hào)、地址、郵箱。填寫(xiě)完成后提交訂單，系統(tǒng)將會(huì)自動(dòng)生成一串訂單編號(hào)。此時(shí)用戶(hù)可以在首頁(yè)中我的訂單里面查看下單狀況，用戶(hù)可以根據(jù)自己的需求修改和取消訂單。用戶(hù)如果只想看看，可以將所選物品加入購(gòu)物車(chē)，以便于查看，用戶(hù)可以在首頁(yè)中我的購(gòu)物車(chē)中查看所添加的商品。4.1.2用戶(hù)購(gòu)物圖需求4.2性能需求分析1、安全保密性為了使網(wǎng)站安全，設(shè)置了URL攔截器與登錄攔截器，沒(méi)有用戶(hù)登錄時(shí)輸入跳轉(zhuǎn)（跳轉(zhuǎn)到購(gòu)物車(chē)、訂單、購(gòu)買(mǎi)）的URL是無(wú)效的。為了保證數(shù)據(jù)的安全性，用了MD5加密方式將用戶(hù)名與密碼加密。2、可操作性開(kāi)發(fā)時(shí)需要從后臺(tái)讀取數(shù)據(jù)、前臺(tái)接收到服務(wù)器的響應(yīng)并及時(shí)將響應(yīng)、數(shù)據(jù)顯示在界面上、操作沒(méi)有卡頓、界面要美觀、符合常規(guī)操作。3、運(yùn)行環(huán)境需求基于ARMCortex-A9內(nèi)核，ARMv7指令集、四核處理器，主頻1.5GHz、128/64位內(nèi)部總線結(jié)構(gòu)、32/32KB的數(shù)據(jù)/指令一級(jí)緩存、1024KB的二級(jí)緩存、高性能計(jì)算能力2000DMIPS（每秒20，000指令集）可實(shí)現(xiàn)。安裝的硬件配置推薦配置：4G以上內(nèi)存，Intel(R)Core(TM)i5-3230MCPU2.6HZWindows764位后臺(tái)需求后臺(tái)需要支持jdk-8u121-windows-x64JAVA開(kāi)發(fā)套件。后臺(tái)需要支持MYSQL數(shù)據(jù)庫(kù)。后臺(tái)需要支持SpringBoot自帶Tomcat9服務(wù)器。前臺(tái)請(qǐng)求后臺(tái)服務(wù)器時(shí)，后臺(tái)服務(wù)器必須在5秒之內(nèi)響應(yīng)URL的請(qǐng)求。4.3可行性分析可行性分析包括技術(shù)可行性分析、經(jīng)濟(jì)可行性分析和運(yùn)營(yíng)可行性分析。1.技術(shù)可行性技術(shù)可行性是針對(duì)所需要的軟件進(jìn)行一系列的分析，評(píng)估在當(dāng)下手中所擁有的條件下，軟件是否能夠得以設(shè)計(jì)并實(shí)現(xiàn)。在這里，這些條件包括手頭的所有軟件和硬件資源，以及可以借用和購(gòu)買(mǎi)的資源，以及設(shè)計(jì)和實(shí)施所需人員的水平和能力。此次編寫(xiě)的WEB系統(tǒng)是建立在MAVEN開(kāi)發(fā)環(huán)境下，此次設(shè)計(jì)前端主要運(yùn)用H5、CSS、JS、JQUERY等，后端使用JAVA語(yǔ)言編程與實(shí)現(xiàn)。在次開(kāi)發(fā)環(huán)境中是完全可行的。電子商務(wù)系統(tǒng)的設(shè)計(jì)主要基于頁(yè)面，URL是響應(yīng)的。通過(guò)B/S的結(jié)構(gòu)實(shí)現(xiàn)網(wǎng)站的搭建。電子商務(wù)系統(tǒng)可方便用戶(hù)通過(guò)瀏覽器端對(duì)自己喜歡的物品進(jìn)行購(gòu)買(mǎi)、查詢(xún)等操作。SpringBoot框架技術(shù)和Mybatis框架技術(shù)都是比較成熟的技術(shù)，JAVA語(yǔ)言是一種成熟的語(yǔ)言，這個(gè)程序的開(kāi)發(fā)沒(méi)有問(wèn)題，所以技術(shù)方面是可行的。2.經(jīng)濟(jì)可行性做項(xiàng)目是需要市場(chǎng)需求的，否則項(xiàng)目做的再精美也是徒勞。近幾年網(wǎng)上購(gòu)物是風(fēng)口浪尖的話(huà)題，所以這個(gè)項(xiàng)目是值得大力花費(fèi)經(jīng)濟(jì)的，很有前途的。3.操作可行性對(duì)于用戶(hù)來(lái)說(shuō)他使用系統(tǒng)，肯定是要操作簡(jiǎn)單易懂，符合大眾的，否則用戶(hù)不會(huì)使用這款系統(tǒng)，它就將回收不到收益。意義分析本項(xiàng)目旨在考察我們?cè)谄髽I(yè)真實(shí)項(xiàng)目環(huán)境下的工程實(shí)踐能力、設(shè)計(jì)能力和移動(dòng)應(yīng)用開(kāi)發(fā)的創(chuàng)新能力，以及團(tuán)隊(duì)合作、溝通能力、抗壓能力、職業(yè)水準(zhǔn)等職場(chǎng)素質(zhì)，展示我們移動(dòng)應(yīng)用程序開(kāi)發(fā)學(xué)生的技能和風(fēng)采，激發(fā)我們對(duì)知識(shí)的渴望和參與教學(xué)活動(dòng)的熱情;搭建校企合作平臺(tái)，引導(dǎo)更多行業(yè)企業(yè)參與校企合作，深化產(chǎn)教融合，推進(jìn)產(chǎn)教融合人才培養(yǎng)模式，使我們對(duì)行業(yè)的發(fā)展趨勢(shì)和行業(yè)對(duì)人才的需求有了更清晰的認(rèn)識(shí)，從而滿(mǎn)足國(guó)家互聯(lián)網(wǎng)戰(zhàn)略發(fā)展對(duì)軟件人才的迫切需求，引領(lǐng)移動(dòng)應(yīng)用開(kāi)發(fā)等相關(guān)專(zhuān)業(yè)的改革與發(fā)展，并適應(yīng)互聯(lián)網(wǎng)、移動(dòng)互聯(lián)網(wǎng)、大數(shù)據(jù)、智慧城市等新技術(shù)、新模式、新業(yè)態(tài)、新應(yīng)用的發(fā)展。4.4系統(tǒng)用例分析電子商務(wù)網(wǎng)站功能模塊描述：（1）用戶(hù)登錄模塊當(dāng)用戶(hù)在瀏覽器中輸入U(xiǎn)RL(localhost:8085/cxkh)時(shí)瀏覽器會(huì)進(jìn)入首頁(yè)頁(yè)面，當(dāng)用戶(hù)點(diǎn)擊左上角【登錄】標(biāo)簽時(shí)，頁(yè)面跳轉(zhuǎn)到登錄頁(yè)面中。用戶(hù)戶(hù)輸入賬號(hào)和密碼并點(diǎn)擊【登錄】按鈕后，后臺(tái)服務(wù)器會(huì)根據(jù)你輸入的賬號(hào)和密碼與數(shù)據(jù)庫(kù)中的數(shù)據(jù)進(jìn)行對(duì)比，a.如果賬號(hào)和密碼正確，則進(jìn)入下一個(gè)模塊。b.如果用戶(hù)名不存在或者密碼錯(cuò)服務(wù)器會(huì)給用戶(hù)登錄頁(yè)面?zhèn)鬟f錯(cuò)誤信息。進(jìn)入主頁(yè)面或返回登錄時(shí)錯(cuò)誤進(jìn)入主頁(yè)面或返回登錄時(shí)錯(cuò)誤服務(wù)器用戶(hù)輸入賬號(hào)與密碼服務(wù)器用戶(hù)輸入賬號(hào)與密碼圖4.4.1用戶(hù)登錄圖（2）用戶(hù)注冊(cè)模塊當(dāng)新用戶(hù)進(jìn)入系統(tǒng)時(shí)，沒(méi)有賬號(hào)即可點(diǎn)擊登錄頁(yè)面上的注冊(cè)鏈接，頁(yè)面就進(jìn)入注冊(cè)頁(yè)面，用戶(hù)填寫(xiě)頁(yè)面上所需要填寫(xiě)的信息正確無(wú)誤之后點(diǎn)擊【提交】按鈕。服務(wù)器會(huì)將用戶(hù)所輸入的信息中的用戶(hù)名與數(shù)據(jù)庫(kù)中的用戶(hù)名匹對(duì)，a.如果所提交的用戶(hù)名在數(shù)據(jù)庫(kù)中不存在，則服務(wù)器將向數(shù)據(jù)庫(kù)中插入一條信息，并返回注冊(cè)成功提示用戶(hù)。b.如果用戶(hù)所輸入的用戶(hù)名在數(shù)據(jù)庫(kù)中存在，則返回注冊(cè)不成功的字段提示用戶(hù)。成功數(shù)據(jù)庫(kù)服務(wù)器用戶(hù)提交自身信息成功數(shù)據(jù)庫(kù)服務(wù)器用戶(hù)提交自身信息不成功不成功返回注冊(cè)不成功的字段提示用戶(hù)返回注冊(cè)不成功的字段提示用戶(hù)圖4.4.2用戶(hù)注冊(cè)圖（3）找回密碼模塊當(dāng)用戶(hù)不記得密碼時(shí)，用戶(hù)點(diǎn)擊【忘記密碼？】標(biāo)簽，頁(yè)面隨即跳轉(zhuǎn)到找回密碼的頁(yè)面，用戶(hù)輸入所需要填寫(xiě)一些用于身份驗(yàn)證的信息，輸入新的密碼。當(dāng)所有內(nèi)容填寫(xiě)好時(shí)點(diǎn)擊【提交】按鈕，服務(wù)器將用戶(hù)所填的信息進(jìn)入數(shù)據(jù)庫(kù)中進(jìn)行匹配，a.如果所填的用戶(hù)名與注冊(cè)時(shí)的手機(jī)號(hào)一致時(shí)，數(shù)據(jù)庫(kù)中的信息將被修改。b.如果不一致時(shí)將會(huì)提示用戶(hù)。如果所填的用戶(hù)名與注冊(cè)時(shí)的手機(jī)號(hào)一致時(shí)，數(shù)據(jù)庫(kù)中的信息將被修改。如果不一致時(shí)將會(huì)提示用戶(hù)用戶(hù)輸入一些核對(duì)身份的內(nèi)容服務(wù)器如果所填的用戶(hù)名與注冊(cè)時(shí)的手機(jī)號(hào)一致時(shí)，數(shù)據(jù)庫(kù)中的信息將被修改。如果不一致時(shí)將會(huì)提示用戶(hù)用戶(hù)輸入一些核對(duì)身份的內(nèi)容服務(wù)器圖4.4.3用戶(hù)找回密碼圖（4）電子商務(wù)主模塊當(dāng)用戶(hù)在瀏覽器中輸入U(xiǎn)RL(localhost:8085/cxkh)時(shí)瀏覽器會(huì)進(jìn)入首頁(yè)頁(yè)面，用戶(hù)可以看見(jiàn)許多商品。用戶(hù)輸入U(xiǎn)RL(localhost:8085/cxkh)服務(wù)器用戶(hù)輸入U(xiǎn)RL(localhost:8085/cxkh)服務(wù)器跳轉(zhuǎn)到首頁(yè)頁(yè)面圖4.4.4電子商務(wù)首頁(yè)搜索所需物品：用戶(hù)在頁(yè)面上的搜索欄中搜索自己想要的商品，服務(wù)器會(huì)根據(jù)所輸入的內(nèi)容去匹對(duì)相應(yīng)的物品。點(diǎn)擊頁(yè)面上物品。用戶(hù)點(diǎn)擊頁(yè)面上看中的物品，頁(yè)面跳轉(zhuǎn)到該商品的詳細(xì)頁(yè)面中。用戶(hù)可以對(duì)該商品夠買(mǎi)或者放入購(gòu)物車(chē)操作。（5）購(gòu)物模塊當(dāng)用戶(hù)進(jìn)入到購(gòu)物模塊后，用戶(hù)可以看見(jiàn)該物品的詳細(xì)信息。用戶(hù)可對(duì)該物品購(gòu)買(mǎi)或者存入購(gòu)物車(chē)商品詳情頁(yè)面商品詳情頁(yè)面購(gòu)買(mǎi)存入購(gòu)買(mǎi)存入服務(wù)器服務(wù)器我的訂單購(gòu)物車(chē)我的訂單購(gòu)物車(chē)圖4.4.5頁(yè)面操作圖（6）購(gòu)物車(chē)模塊用戶(hù)點(diǎn)擊主頁(yè)面上的我的購(gòu)物車(chē)（用戶(hù)登錄后【我的購(gòu)物車(chē)】與【我的訂單】才可見(jiàn)），頁(yè)面跳轉(zhuǎn)到購(gòu)物車(chē)頁(yè)面上，服務(wù)器將該用戶(hù)所存入的商品返回給用戶(hù)頁(yè)面依次展開(kāi)。商品編號(hào)商品名商品類(lèi)型存放時(shí)間個(gè)數(shù)價(jià)格操作10086哇哈哈食品2021-4-0919：24210付款重新選購(gòu)刪除10052洗衣液生活用品2021-4-0919：24250付款重新選購(gòu)刪除圖4.4.6購(gòu)物車(chē)1、用戶(hù)點(diǎn)擊【購(gòu)買(mǎi)】按鈕時(shí)，會(huì)跳轉(zhuǎn)到填寫(xiě)信息界面上。2、用戶(hù)點(diǎn)擊【重新選購(gòu)】按鈕時(shí)，界面會(huì)返回到該商品的購(gòu)物模塊中，用戶(hù)可以重新選著該商品，選擇該商品的所有信息將會(huì)覆蓋原先的信息。購(gòu)物車(chē)購(gòu)物車(chē)重新選購(gòu)購(gòu)買(mǎi)重新選購(gòu)購(gòu)買(mǎi)刪除刪除服務(wù)器服務(wù)器數(shù)據(jù)庫(kù)（cx）數(shù)據(jù)庫(kù)（cx）頁(yè)面頁(yè)面頁(yè)面頁(yè)面圖4.4.7業(yè)務(wù)操作（7）購(gòu)買(mǎi)模塊用戶(hù)點(diǎn)擊【購(gòu)買(mǎi)】按鈕（包括直接購(gòu)買(mǎi)與添加到購(gòu)物車(chē)中后的購(gòu)買(mǎi)）頁(yè)面跳轉(zhuǎn)到購(gòu)買(mǎi)頁(yè)面中，系統(tǒng)默認(rèn)的把用戶(hù)名、手機(jī)號(hào)、郵箱添加到所填寫(xiě)的訂單中（用戶(hù)也可以自行更改），用戶(hù)只需填寫(xiě)地址即可。點(diǎn)擊【提交】按鈕后，所有數(shù)據(jù)將會(huì)提交到數(shù)據(jù)庫(kù)中，自動(dòng)生成訂單信息。購(gòu)買(mǎi)信息填寫(xiě)購(gòu)買(mǎi)信息填寫(xiě)郵箱地址手機(jī)號(hào)用戶(hù)姓名郵箱地址手機(jī)號(hào)用戶(hù)姓名提交提交數(shù)據(jù)庫(kù)DB（cx）數(shù)據(jù)庫(kù)DB（cx）圖4.4.8購(gòu)買(mǎi)模塊（8）訂單模塊用戶(hù)點(diǎn)擊主頁(yè)面上的我的訂單（用戶(hù)登錄后【我的購(gòu)物車(chē)】與【我的訂單】才可見(jiàn)），頁(yè)面跳轉(zhuǎn)到訂單頁(yè)面上，服務(wù)器將該用戶(hù)所購(gòu)買(mǎi)的商品返回給用戶(hù)頁(yè)面依次展開(kāi)。已完成訂單訂單編號(hào)用戶(hù)名商品編號(hào)購(gòu)買(mǎi)時(shí)間價(jià)格狀態(tài)操作CX523300118001100862021-4-0919：2410完成刪除訂單再次購(gòu)買(mǎi)CX533660218002100052021-4-0919：2450完成刪除訂單再次購(gòu)買(mǎi)圖4.4.9已完成訂單表未完成訂單表訂單編號(hào)用戶(hù)名商品編號(hào)購(gòu)買(mǎi)時(shí)間價(jià)格狀態(tài)操作CX523300118001100862021-4-0919：2410未完成取消訂單修改訂單CX533660218002100052021-4-0919：2450未完成取消訂單修改訂單圖4.4.10未完成訂單表5網(wǎng)站的設(shè)計(jì)本系統(tǒng)是由服務(wù)器和瀏覽器構(gòu)成。要求服務(wù)器在前端的響應(yīng)下完成系統(tǒng)的交互。系統(tǒng)架構(gòu)大致是通過(guò)Tomcat連接在后臺(tái)服務(wù)器和數(shù)據(jù)庫(kù)中的數(shù)據(jù)之間。該系統(tǒng)功能劃分為幾個(gè)模塊如下，（1）用戶(hù)登陸模塊，（2）用戶(hù)注冊(cè)模塊，（3）密碼檢索模塊（4）電子商務(wù)主模塊，（5）購(gòu)物模塊，（6）購(gòu)物車(chē)模塊（7）購(gòu)買(mǎi)模塊，（8）訂單模塊Html頁(yè)面（VIEW）5.1系統(tǒng)體制架構(gòu)Html頁(yè)面（VIEW）服務(wù)器服務(wù)器數(shù)據(jù)數(shù)據(jù)數(shù)據(jù)數(shù)據(jù)數(shù)據(jù)數(shù)據(jù)數(shù)據(jù)數(shù)據(jù)數(shù)據(jù)庫(kù)DB（cx）數(shù)據(jù)庫(kù)DB（cx）圖5.1系統(tǒng)架構(gòu)圖本系統(tǒng)要求前端頁(yè)面、后臺(tái)服務(wù)器、數(shù)據(jù)庫(kù)平臺(tái)連在同一平臺(tái)中連接中。后臺(tái)服務(wù)器從前臺(tái)獲取數(shù)據(jù)操作來(lái)對(duì)數(shù)據(jù)庫(kù)中的數(shù)據(jù)操作，再將數(shù)據(jù)庫(kù)獲取的數(shù)據(jù)裝入Model中返回給頁(yè)面。5.2系統(tǒng)總體流程圖5.2系統(tǒng)流程圖5.3第三方插件的使用介紹（一）

Postman是一個(gè)功能強(qiáng)大的Chrome插件，用于web調(diào)試和發(fā)送Http請(qǐng)求。用戶(hù)需要非常簡(jiǎn)單的情況下，需要調(diào)試開(kāi)發(fā)網(wǎng)絡(luò)應(yīng)用程序或使用B/S調(diào)試模式調(diào)試web應(yīng)用程序。調(diào)試方法工具用于跟蹤一個(gè)網(wǎng)頁(yè)的調(diào)試請(qǐng)求，用戶(hù)，即可以通過(guò)考慮來(lái)學(xué)習(xí)如何使用一些工具進(jìn)行網(wǎng)絡(luò)程序管理，例如世界著名的iis、firebug等web程序調(diào)試管理工具。今天我們給大家詳細(xì)而簡(jiǎn)單的介紹這個(gè)免費(fèi)的網(wǎng)頁(yè)設(shè)計(jì)調(diào)試開(kāi)發(fā)工具不僅可以讓你調(diào)試簡(jiǎn)單如css、html、腳本等簡(jiǎn)單的網(wǎng)頁(yè)設(shè)計(jì)基本操作信息，它還允許您甚至同時(shí)為幾乎所有網(wǎng)頁(yè)發(fā)送不同類(lèi)型的請(qǐng)求，例如http!postman使您能夠清楚地被公認(rèn)為我們基于chrome網(wǎng)絡(luò)插件http遞送請(qǐng)求文件發(fā)件人的類(lèi)似產(chǎn)品系列中最具國(guó)際代表性的插件產(chǎn)品之一。當(dāng)今的網(wǎng)絡(luò)網(wǎng)頁(yè)設(shè)計(jì)工程開(kāi)發(fā)者不僅需要同時(shí)檢查調(diào)試幾個(gè)不同網(wǎng)頁(yè)的系統(tǒng)是否正?；蛘哌\(yùn)行,并且也就不是簡(jiǎn)簡(jiǎn)單單地需要檢查和同時(shí)調(diào)試一個(gè)網(wǎng)頁(yè)的諸如html、css、java以及運(yùn)行腳本等一系列的基本信息系統(tǒng)是否正?；蛘哌\(yùn)行正常,更加重要的一點(diǎn)是那就是對(duì)于網(wǎng)頁(yè)設(shè)計(jì)可以同時(shí)做到正確的還是對(duì)于一個(gè)網(wǎng)頁(yè)需要進(jìn)行用戶(hù)http處理請(qǐng)求,畢竟這些對(duì)于網(wǎng)頁(yè)的用戶(hù)http處理請(qǐng)求對(duì)于一個(gè)網(wǎng)站和其他用戶(hù)之間的網(wǎng)站進(jìn)行交互來(lái)說(shuō)是非常重要的一種請(qǐng)求手段和處理方式,在在非常動(dòng)態(tài)的一個(gè)網(wǎng)站中,用戶(hù)的很多請(qǐng)求數(shù)據(jù)都可能是通過(guò)需要經(jīng)由網(wǎng)頁(yè)http進(jìn)行請(qǐng)求處理才能和網(wǎng)站服務(wù)器交互。郵遞員插件充當(dāng)了這種溝通和交流方式的“橋梁”。他們可以通過(guò)使用chrome插件將各種模擬用戶(hù)http請(qǐng)求的數(shù)據(jù)發(fā)送到客戶(hù)端服務(wù)器，以便開(kāi)發(fā)人員有效地做出正確的反饋和響應(yīng)，或者更重要的是，在產(chǎn)品推出之前處理發(fā)現(xiàn)錯(cuò)誤的信息，這有效地保證了網(wǎng)站上線后產(chǎn)品的穩(wěn)定性和安全性。在chrome中已經(jīng)安裝了postman插件以后,用戶(hù)只是需要在開(kāi)始調(diào)試一個(gè)網(wǎng)站的任何時(shí)候自己?jiǎn)?dòng)postman插件,然后來(lái)對(duì)其進(jìn)行幾項(xiàng)簡(jiǎn)易的配置就已經(jīng)可以輕松地實(shí)現(xiàn)對(duì)該網(wǎng)站的基礎(chǔ)信息進(jìn)行修改和分布式發(fā)送各種類(lèi)型的http到該網(wǎng)站中,用戶(hù)在開(kāi)始發(fā)送http數(shù)據(jù)的任何時(shí)候,也就是可以在開(kāi)始編輯網(wǎng)站的相關(guān)測(cè)試數(shù)據(jù)的任何時(shí)候添加輸入了一個(gè)必須量的參數(shù)信息,這樣才能使得測(cè)試的數(shù)據(jù)變得更為準(zhǔn)確,而這個(gè)postman也將會(huì)完好地得到支持。（二）Thymeleaf的使用Thymeleaf是一種專(zhuān)門(mén)基于用來(lái)制作渲染thxml/xhtml/html5內(nèi)容的文件模板渲染引擎。類(lèi)似于諸如jsp,velocity,freemaker等,它也是一種完全可以很簡(jiǎn)單地與如springmvc等其他web新型框架軟件集成使用起來(lái)的并做為適合web框架應(yīng)用的新型模板設(shè)計(jì)引擎。與其他的引擎模板網(wǎng)站搜索分析引擎操作系統(tǒng)軟件相比,thymeleaf最大的主要優(yōu)勢(shì)之處之一就是它使您能夠直接在您的瀏覽器中自動(dòng)打開(kāi)和正確地直接顯示該引擎模板的所有網(wǎng)站搜索頁(yè)面,而不必再遇到需要重新安裝啟動(dòng)整個(gè)web的應(yīng)用。Thymeleaf已經(jīng)支持springexpressionlanguage這種語(yǔ)言做為一種方言,即spel,在我們進(jìn)行學(xué)習(xí)jsp時(shí)我們都已經(jīng)對(duì)el表達(dá)式有一定的理解和認(rèn)識(shí)了,spel是一種可以廣泛應(yīng)用于spring中的一種el表達(dá)式。簡(jiǎn)而言之,與我們實(shí)際上所使用的jsp不同,thymeleaf主要是通過(guò)使用html的一個(gè)標(biāo)簽方法來(lái)直接完成對(duì)邏輯和數(shù)據(jù)的傳輸或者進(jìn)行渲染,而且不需要像jsp一樣將其作為一個(gè)servlet被重新編譯再制作生成。即便單獨(dú)的thymeleafhtml這個(gè)文件仍然可以正確地打開(kāi)并包含有少量(相對(duì))具有價(jià)值的資料,并且還是可以被瀏覽器直接打開(kāi)。5.4版本管理工具的使用版本管理工具軟件為您提供了完整的版本管理功能，用于存儲(chǔ)和跟蹤目錄(包括文件夾)和文件修改的歷史記錄，它是所有軟件研究人員以及所有軟件企業(yè)和公司的基礎(chǔ)設(shè)施的必備工具。版本控制軟件的最高宗旨,就是要有效地支持各種軟件企業(yè)和公司進(jìn)行配置、管理等活動(dòng),跟蹤各種版本的研究開(kāi)發(fā)和維護(hù)等等活動(dòng),及時(shí)地發(fā)布和更新軟件。簡(jiǎn)單地一點(diǎn)來(lái)說(shuō),你在進(jìn)行軟件開(kāi)發(fā)的過(guò)程中,會(huì)不斷地去發(fā)現(xiàn)新的需求,不斷地去發(fā)現(xiàn)bug,如果你沒(méi)有對(duì)自己的軟件進(jìn)行控制,或今天一個(gè)版本,明天再是一個(gè)版本。常見(jiàn)的版本管理工具有：VSS、CVS、SVN、GIT、MAVEN等。我的項(xiàng)目使用的是Maven工具來(lái)管理的MAVEN項(xiàng)目是一個(gè)用于構(gòu)建(打包)基礎(chǔ)項(xiàng)目、依靠資源管理(項(xiàng)目資源整合依靠)項(xiàng)目工具(管理基礎(chǔ)項(xiàng)目資源)、項(xiàng)目資源信息庫(kù)的聚合(主要還是應(yīng)用于管理整合項(xiàng)目資源)。maven除了以其應(yīng)用程序系統(tǒng)架構(gòu)和開(kāi)發(fā)能力具有優(yōu)勢(shì)的合作為其主要特色之外,還一直致力于為企業(yè)客戶(hù)和其他企業(yè)人員提供專(zhuān)門(mén)的專(zhuān)業(yè)項(xiàng)目資源管理和信息技術(shù)解決工具。因?yàn)槎嘈衜aven的開(kāi)發(fā)缺省和重復(fù)構(gòu)建腳本規(guī)則通常具備較高的開(kāi)發(fā)可用和重用性,所以往往只要你需要重復(fù)使用兩三行maven需要構(gòu)建的開(kāi)發(fā)腳本規(guī)則即可輕松構(gòu)建一個(gè)簡(jiǎn)易化的開(kāi)發(fā)項(xiàng)目。因?yàn)椴捎胢aven的發(fā)文是一個(gè)一種面向不同項(xiàng)目的發(fā)文方式,許多屬于apachejakarta類(lèi)的項(xiàng)目在每次進(jìn)行后期發(fā)文時(shí)都會(huì)固定使用一個(gè)maven,并且該項(xiàng)目公司的每個(gè)項(xiàng)目中由于采用的是maven的發(fā)文比率正在不斷的的上升。6系統(tǒng)實(shí)現(xiàn)及關(guān)鍵問(wèn)題6.1界面顯示模塊設(shè)計(jì)圖片循環(huán)可以說(shuō)是最常見(jiàn)的效果之一。在許多著名的應(yīng)用中，都有圖片循環(huán)效果。雖說(shuō)這個(gè)功能看上去很復(fù)雜的，不過(guò)我們可以很輕松的實(shí)現(xiàn)非?？犰诺膱D片循環(huán)播放效果。所謂的圖片循環(huán)播放就是將一些圖片放入一個(gè)文件夾下，將其重新命名，然后可以通過(guò)JS代碼閃現(xiàn)出來(lái)，這是個(gè)很好的動(dòng)畫(huà)效果。核心代碼如下：varcount=0;varmytime;functionshowImg(id){ count++; if(id>0){ clearInterval(mytime); count=id;} if(count>7){ count=1;} document.getElementById("pic").src="http://localhost:8080/king/img/ap"+count+".jpg";for(vari=1;i<=7;i++){ if(i==count){ document.getElementById("num"+i).style.backgroundColor="#F63"; }else{ document.getElementById("num"+i).style.backgroundColor="#CCC";}}} functionshowout(){ mytime=setInterval("showImg(0)",1000);} mytime=setInterval("showImg(0)",2000);6.2數(shù)據(jù)存儲(chǔ)模塊設(shè)計(jì)6.2.1將數(shù)據(jù)存儲(chǔ)到cx數(shù)據(jù)庫(kù)中cx是我給這個(gè)系統(tǒng)創(chuàng)建的一個(gè)數(shù)據(jù)庫(kù)，里面創(chuàng)建了三張表用來(lái)存儲(chǔ)用戶(hù)、產(chǎn)品、訂單，我們用Mybatis與數(shù)據(jù)庫(kù)連接，就可以實(shí)現(xiàn)對(duì)數(shù)據(jù)庫(kù)增、刪、改、查等一些的操作。代碼例如：數(shù)據(jù)存儲(chǔ)<insertid="AddUser"parameterType="com.example.shopping.entity.User">insertintocx_user(username,name,password,phone,email,sex)values(#{username},#{name},#{password},#{phone},#{email},#{sex})</insert>數(shù)據(jù)查找<selectid="GetUser"resultType="com.example.shopping.entity.User">select*fromcx_userwhereusername=#{username}</select>數(shù)據(jù)更改<updateid="UpdateUser"parameterType="com.example.shopping.entity.User">updatecx_usersetpassword=#{password}whereusername=#{username}</update>數(shù)據(jù)刪除<deleteid="DeleteOrder"parameterType="com.example.shopping.entity.Order">delete*fromcx_orderwhereorderid=#{orderid}</delete>6.2.2Mybatis對(duì)數(shù)據(jù)庫(kù)的操作Mybatis是一款優(yōu)秀的持久層存儲(chǔ)框架,它已經(jīng)能夠完全支持用戶(hù)定制和優(yōu)化的sql、存儲(chǔ)管理流程以及高級(jí)數(shù)據(jù)映射。Mybatis.它避免了幾乎所有使用jdbc執(zhí)行代碼的性能損失以及通過(guò)移除手動(dòng)程序設(shè)置的所有參數(shù)和值以獲得新的結(jié)果集。Mybatis系統(tǒng)人員可以通過(guò)利用簡(jiǎn)單的字符xml或者使用注解符的方式使用來(lái)對(duì)其進(jìn)行接口配置和直接映射其原生的接口信息,把這些接口與一個(gè)java的對(duì)象pojo(plainordinaryjavaobject,普通的是java中的對(duì)象)相互進(jìn)行映射后再組合起來(lái)成為整個(gè)應(yīng)用數(shù)據(jù)庫(kù)系統(tǒng)過(guò)程中的一份信息記錄。圖6.2Mybatis對(duì)數(shù)據(jù)庫(kù)操作流程SpringBoot配置數(shù)據(jù)庫(kù)datasource:username:rootpassword:123456url:jdbc:mysql://localhost:3306/cx?useUnicode=true&characterEncoding=utf-8&useSSL=true&serverTimezone=UTC

2、SpringBoot引用Mybatis映射文件mybatis:mapper-locations:classpath:mapping/*Mapper.xmltype-aliases-package:com.example.demo.entity3、Mybatis配置數(shù)據(jù)庫(kù)<?xmlversion="1.0"encoding="UTF-8"?><!DOCTYPEmapperPUBLIC"-////DTDMapper3.0//EN""/dtd/mybatis-3-mapper.dtd"><mappernamespace="com.example.shopping.Mapper.UserMapper"><resultMapid="User"type="com.example.shopping.entity.User"><resultcolumn="username"jdbcType="VARCHAR"property="username"/><resultcolumn="name"jdbcType="VARCHAR"property="name"/><resultcolumn="password"jdbcType="VARCHAR"property="password"/><resultcolumn="phone"jdbcType="VARCHAR"property="phone"/><resultcolumn="email"jdbcType="VARCHAR"property="email"/><resultcolumn="sex"jdbcType="VARCHAR"property="sex"/></resultMap></mapper>4、對(duì)數(shù)據(jù)的各種操作<insertid="AddUser"parameterType="com.example.shopping.entity.User">insertintocx_user(username,name,password,phone,email,sex)values(#{username},#{name},#{password},#{phone},#{email},#{sex})</insert><selectid="GetUser"resultType="com.example.shopping.entity.User">select*fromcx_userwhereusername=#{username}</select><updateid="UpdateUser"parameterType="com.example.shopping.entity.User">updatecx_usersetpassword=#{password}whereusername=#{username}</update><deleteid="DeleteOrder"parameterType="com.example.shopping.entity.Order">delete*fromcx_orderwhereorderid=#{orderid}</delete>6.3網(wǎng)絡(luò)模塊設(shè)計(jì)6.3.1Http協(xié)議Http網(wǎng)絡(luò)協(xié)議(也有人稱(chēng)之為超文本傳輸協(xié)議(它是音譯和文本直接傳輸網(wǎng)絡(luò)協(xié)議的縮寫(xiě))，它是指一種專(zhuān)門(mén)為從萬(wàn)維網(wǎng)直接傳輸超文本或超文本而開(kāi)發(fā)的文本傳輸網(wǎng)絡(luò)協(xié)議(www:worldwideb)web服務(wù)器到中國(guó)本地web瀏覽器。http協(xié)議是一種基于tcp的tcp/ip通信協(xié)議，用于通過(guò)搜索(通常包括html搜索文件，圖像搜索文檔，查詢(xún)搜索結(jié)果等)傳輸數(shù)據(jù)。圖6.3.1主要特點(diǎn)：1、簡(jiǎn)單快捷:當(dāng)一個(gè)客戶(hù)向服務(wù)器發(fā)出要求或者請(qǐng)求時(shí),只需要向其發(fā)送一種請(qǐng)求的方法與途徑。請(qǐng)求的常用方法有g(shù)et、HEAD和POST。每種方法都指定客戶(hù)端和服務(wù)器之間的互連類(lèi)型是否相同。由于http協(xié)議簡(jiǎn)單，因此http服務(wù)器的應(yīng)用程序體積和規(guī)模都很小，因此其通信速度非?？?。2.靈活性:http允許用戶(hù)傳輸任何類(lèi)型的數(shù)據(jù)對(duì)象。正在傳輸?shù)奈募?lèi)型用content-type標(biāo)記。3.無(wú)連接:所謂無(wú)連接是指將每個(gè)連接限制為只有一個(gè)請(qǐng)求。處理完客戶(hù)的提示信息后，服務(wù)器在收到相關(guān)客戶(hù)的響應(yīng)后立即斷開(kāi)連接。而且，該方法可以有效地節(jié)省傳輸時(shí)間。4，無(wú)狀態(tài):http網(wǎng)絡(luò)協(xié)議本身實(shí)際上是完全沒(méi)有狀態(tài)的網(wǎng)絡(luò)協(xié)議。無(wú)事件狀態(tài)性功能是一種指一個(gè)協(xié)議對(duì)于某個(gè)事件的狀態(tài)處理并沒(méi)有任何回憶性的能力。這種狀態(tài)的缺失可能意味著，如果它在隨后的數(shù)據(jù)處理中仍然需要先前的傳輸信息，則它必須重新傳輸它，這種很快有限的可