【畢業(yè)學(xué)位論文】（Word原稿）基于HTML5的電子購物系統(tǒng)的開發(fā)與設(shè)計(jì)-軟件工程

中圖分類號(hào)： 學(xué)校代碼： 10055 密級(jí)： 公開 碩士專業(yè)學(xué)位論文 基于 of 要 I 摘要 移動(dòng)互聯(lián)網(wǎng)最近幾年正以不可阻擋的趨勢在發(fā)展，隨著蘋果和安卓等手機(jī)日新月異的發(fā)展，人們會(huì)更多的通過手機(jī)去訪問互聯(lián)網(wǎng)，所以互聯(lián)網(wǎng)公司研發(fā)其經(jīng)營業(yè)務(wù)的移動(dòng)版本已經(jīng)是大勢所趨的問題了。 社會(huì)開始進(jìn)入信息分享與共享的時(shí)代，可以很明顯得感覺到， 移動(dòng)端已經(jīng)成為了現(xiàn)在所有互聯(lián)網(wǎng)公司共同的戰(zhàn)場，無線互聯(lián)網(wǎng)這塊蛋糕，越早投入精力和資金，就越容易獲得產(chǎn)出和收益。 本文結(jié)合“延續(xù)現(xiàn)有業(yè)務(wù)至移動(dòng)端”的業(yè)務(wù)需求，通過進(jìn)行大量的數(shù)據(jù)分析與調(diào)研，進(jìn)行需求分析并確定系統(tǒng)的實(shí)現(xiàn)方案。依托本系統(tǒng)，用戶可以進(jìn)行查看商品、購買下單、查詢進(jìn)度、反饋評(píng)價(jià)等諸多特色性功能。針對(duì)確定的功能，細(xì)化形成功能模塊圖與各功能模塊之間的業(yè)務(wù)流程，為了極大程度的便于用戶的使用，引用移動(dòng)設(shè)計(jì)的思想與設(shè)計(jì)方式進(jìn)行相關(guān)的開發(fā)與設(shè)計(jì)工作，并在開發(fā)中進(jìn)行大量的用戶用例測試，匯總與分析反饋結(jié)果，進(jìn)行平臺(tái)的優(yōu) 化。產(chǎn)品基于 術(shù)開發(fā)。其中，由 制頁面結(jié)構(gòu)與布局， 制樣式，控制 本， 控制 本，與用戶交互。 開發(fā)實(shí)現(xiàn)的功能中，系統(tǒng)通過讀取不同的用戶權(quán)限展現(xiàn)不同的頁面效果，實(shí)現(xiàn)美觀與效果共存；商品展示頁給予商品極其豐富的展示空間；購買流程支持用戶從結(jié)算，到付費(fèi)完成的過程。以上內(nèi)容將使得平臺(tái)的維護(hù)與管理更加有序。在開發(fā)中本系統(tǒng)進(jìn)行了多手機(jī)端系統(tǒng)及屏幕尺寸兼容性調(diào)試，本系統(tǒng)在 主流手機(jī)系統(tǒng)上均可流暢運(yùn)行。 關(guān)鍵詞 ：移動(dòng)互聯(lián)網(wǎng)； 子商務(wù)； I n is an in of be to so o R & D of is of of of to a of In to is of of in a of is by to of by to to to In of be in to 錄 摘要 . I . 錄 . 一章緒論 . 1 第一節(jié)論文背景 . 1 第二節(jié)國內(nèi)外研究現(xiàn)狀 . 2 第三節(jié)本文主要研究內(nèi)容 . 3 第四 節(jié)本文組織結(jié)構(gòu) . 4 第二章系統(tǒng)需求分析 . 5 第一節(jié)功能需求 . 5 . 5 目設(shè)計(jì)原則 . 6 務(wù)需求內(nèi)容 . 6 第二節(jié)非功能需求 . 7 統(tǒng)安全性要求 . 7 構(gòu)要求 . 8 統(tǒng)兼容性要求 . 8 第三節(jié)系統(tǒng)用例 . 8 錄注冊(cè)用例 . 8 品購買用例 . 9 人中心用例 . 10 品瀏覽用例 . 11 目錄 訂單結(jié)算功能用例 . 12 價(jià)功能用例 . 12 第三章關(guān)鍵技術(shù) . 13 第一節(jié)本課題所運(yùn)用的技術(shù)概述 . 13 第二節(jié) . 13 第三節(jié)層疊樣式表（ 介 . 15 第四節(jié) . 17 第五節(jié)開發(fā)環(huán)境和工具 . 18 第四章系統(tǒng)總體設(shè)計(jì) . 19 第一節(jié)邏輯功能架構(gòu) . 19 第二節(jié)系統(tǒng)技術(shù)架構(gòu) . 20 品設(shè)計(jì)思路 . 21 發(fā)設(shè)計(jì)思路 . 23 第三節(jié)物理拓?fù)浼軜?gòu) . 23 第四節(jié)數(shù)據(jù)庫設(shè)計(jì) . 24 體關(guān)系圖 . 24 據(jù)字典 . 26 接池技術(shù) . 35 . 36 第五章系統(tǒng)詳細(xì)設(shè)計(jì) . 39 第一節(jié)用戶注冊(cè)系統(tǒng)詳細(xì)設(shè)計(jì) . 39 第二節(jié)用戶登錄系統(tǒng)詳細(xì)設(shè)計(jì) . 43 第三節(jié)商品搜索功能 . 46 第四節(jié)購物車系統(tǒng)詳細(xì)設(shè)計(jì) . 50 第五節(jié)訂單結(jié)算系統(tǒng)詳細(xì)設(shè)計(jì) . 52 第六節(jié)售后評(píng)價(jià)系統(tǒng)詳細(xì)設(shè)計(jì) . 54 目錄 V 第六章系統(tǒng)原型實(shí)現(xiàn) . 55 第一節(jié)系統(tǒng)開發(fā)及運(yùn)行環(huán)境 . 55 第二節(jié)系統(tǒng)運(yùn)營主頁面 . 55 子購物系統(tǒng)首頁 . 56 導(dǎo)航頁面 . 56 品列表頁面 . 57 第三節(jié)用戶注冊(cè)子系統(tǒng)實(shí)現(xiàn) . 59 第四節(jié)用戶登錄子系統(tǒng)實(shí)現(xiàn) . 61 第五節(jié)商品搜索子系統(tǒng)實(shí)現(xiàn) . 63 第六節(jié)購物車子系統(tǒng)實(shí)現(xiàn) . 64 第七節(jié)訂單結(jié)算子系統(tǒng)實(shí)現(xiàn) . 66 第八節(jié)售后評(píng)價(jià)子系統(tǒng)實(shí)現(xiàn) . 69 第九節(jié)核心技術(shù)實(shí)現(xiàn) . 70 第七章總結(jié)與展望 . 72 第一節(jié)本文總結(jié) . 72 第二節(jié)進(jìn)一步展望 . 72 參考文獻(xiàn) . 74 致謝 . 76 第一章緒論 1 第一章 緒論 第一節(jié) 論文背景 有人說誰掌握了移動(dòng)互聯(lián)網(wǎng)的先機(jī)，誰就掌握了未來，隨著近年來移動(dòng)互聯(lián)網(wǎng)的加速發(fā)展，越來越多的用戶選擇使用移動(dòng)終端訪問互聯(lián)網(wǎng)，據(jù) 聯(lián)網(wǎng)數(shù)據(jù)中心預(yù)計(jì)， 2012 年手機(jī)網(wǎng)民將達(dá) ，繼續(xù)保持 穩(wěn)步增長，并逐漸逼近 民規(guī)模。隨著 3G、 4G 等網(wǎng)絡(luò)覆蓋率的提高，移動(dòng)互聯(lián)網(wǎng)應(yīng)用的進(jìn)一步豐富，用戶體驗(yàn)得到了進(jìn)一步的提升，越來越多的移動(dòng)增值服務(wù)被用戶所使用。其中，移動(dòng)電子商務(wù)占據(jù)了很大一塊比例。 互聯(lián)網(wǎng)進(jìn)入了共享信息與分享信息的時(shí)代，同之前不一樣的是，人們之間掌握的信息量存在很大的差別，需要不停得交流和互換信息，現(xiàn)在這一部分內(nèi)容，可以通過網(wǎng)絡(luò)完美解決，新浪微博的轉(zhuǎn)發(fā)和評(píng)論即是此功能。這樣一來，人們彼此間也變得愈加透明，自然而然得再次進(jìn)入“孤立”的狀態(tài)去尋找興奮點(diǎn)的循環(huán)，畢竟，人與人之間的溝通和交流是需要尋找主題和尋找興奮點(diǎn)的。基于以上的深入思考，我們發(fā)現(xiàn)了互聯(lián)網(wǎng)面臨的新的問題，信息越是通暢、共享程度越高，人與人之間越容易陷入“孤立”的狀態(tài)，或者說，信息的高度透明導(dǎo)致信息接收者的同質(zhì)化現(xiàn)象越來越明顯。我相信，這絕非移動(dòng)互聯(lián)網(wǎng)發(fā)展的價(jià)值歸宿，因?yàn)椤肮铝ⅰ北厝粚?dǎo)致“瓦 解”，而我們要實(shí)現(xiàn)的恰恰是“融合”。 可以很明顯得感覺到，移動(dòng)端已經(jīng)成為了現(xiàn)在所有互聯(lián)網(wǎng)公司共同的戰(zhàn)場，任何一個(gè)公司如果想在這場沒有硝煙的戰(zhàn)爭中生存下去，就必須投入足夠的精力與財(cái)力，越來越多的手機(jī) 發(fā)公司注冊(cè)建立，同時(shí)傳統(tǒng)互聯(lián)網(wǎng)公司也紛紛成立相應(yīng)的無線部門。無線互聯(lián)網(wǎng)這塊蛋糕，越早投入精力和資金，就越容易獲得產(chǎn)出和收益。 國內(nèi)知名咨詢集團(tuán) 瑞咨詢于報(bào)告中指出（如圖 所示），2011 年中國移動(dòng)電子商務(wù)市場交易規(guī)模為 元，同比增長 預(yù)計(jì)2012 年中國移動(dòng)電子商 務(wù)市場規(guī)模將達(dá)到 元，到 2013 年將超過 1000億，達(dá)到 元可見，移動(dòng)電子商務(wù)的藍(lán)海已是電子商務(wù)未來幾年重點(diǎn)的發(fā)展方向了。 第一章緒論 2 圖 006第二節(jié) 國內(nèi)外研究現(xiàn)狀 每個(gè)人都很清楚的知道，發(fā)展得非常迅猛的互聯(lián)網(wǎng)技術(shù)，越來越廣泛得應(yīng)用于各個(gè)領(lǐng)域。隨之帶來的，電腦桌面程序已經(jīng)越來越缺少用戶和陣地，曾經(jīng)在普通電腦端使用的最多的瀏覽器，那些單純承載圖片和文字的頁面已經(jīng)無法滿足人們的需求，而現(xiàn)行的 準(zhǔn)又怎么可能滿足人們?cè)絹碓綇?qiáng)烈的視頻、動(dòng)畫等等多 媒體播放的需求 1。因此插件產(chǎn)生了，滿足了人們大多數(shù)的需求極大程度上，同時(shí)這些裝了插件的人們，計(jì)算機(jī)運(yùn)行越來越慢，越來越容易中毒等問題隨之產(chǎn)生。在這樣的大前提下， 案推出了，我們看到了未來瀏覽器本身也能完成這些使命 2。 1999 年 12 月份是 近一次升級(jí)的日子，版本是 那天以后發(fā)生了很多變革。開始的那些瀏覽器的戰(zhàn)爭已經(jīng)逐漸結(jié)束，但瀏覽器戰(zhàn)爭帶來的結(jié)果是 準(zhǔn)運(yùn)動(dòng)愈加的混亂，在基于 準(zhǔn)的 ，我們不得不依靠外來的插件來滿足人們播放商品、音頻以及最新 3D 繪圖技術(shù) 的需求，最著名的的當(dāng)然是 司的 司的 了他們，我們不得不在把他們裝在我們?cè)絹碓接纺[的瀏覽器上，運(yùn)行速度緩慢到無以復(fù)加的地步，研究 準(zhǔn)有利于從源頭上解決這問題。 2008 年 1 月 22日是 一份正式草案發(fā)布的日子。大多數(shù)的瀏覽器已經(jīng)可以支 持語言模式了，雖然其仍處于一個(gè)完善中的階段。 ，超文本標(biāo)記語言或超文本鏈接標(biāo)第一章緒論 3 示語言）隨著 事會(huì)或萬維網(wǎng)聯(lián)盟）一直在變化標(biāo)準(zhǔn)， 經(jīng)走過了 4 代的標(biāo)準(zhǔn)，自從 標(biāo)準(zhǔn)草案公布以來， 得了廣大開發(fā)者和大公司們的歡迎，就因?yàn)樗唵危泻唵蔚臉?biāo)簽元素，你要知道在這之前要非常復(fù)雜的 碼才能搞定這些。目前移動(dòng)開發(fā)只有兩種方法，分別是全部使用 法和僅使用原生語法。機(jī)應(yīng)用的最大優(yōu)勢就是可以在網(wǎng)頁上直接調(diào)試和修改。因此也有許多手機(jī)雜志客戶端是基于 準(zhǔn)，開發(fā)人員可以輕松調(diào)試修改。 因?yàn)?準(zhǔn)目前沒有全 球范圍推廣，只是出于研究草案階段，在國內(nèi)外也沒有太多的應(yīng)用，所以瀏覽器的支持并不全面。目前只能支持 盜灣，同時(shí) 其網(wǎng)站上實(shí)現(xiàn)了部分功能標(biāo)簽。而蘋果公司在其推出的機(jī)和 板電腦上則完全支持 準(zhǔn) 3。 第三節(jié) 本文主要研究內(nèi)容 本文通過上述的調(diào)研和分析，結(jié)合本公司特點(diǎn)，確定了手機(jī)移動(dòng)終端（ 實(shí)現(xiàn)方案。本課題設(shè)計(jì)的平臺(tái)采用基于 術(shù)開發(fā)。用戶通過下載 現(xiàn)服務(wù)器與服務(wù)器端數(shù)據(jù)庫的交互。本系統(tǒng)的采用 臺(tái)數(shù)據(jù)庫， 進(jìn)行樣式控制，分為 個(gè)版本。 結(jié)合開發(fā)系統(tǒng)的需求特點(diǎn)，確定了電子購物平臺(tái)系統(tǒng)功能模塊和運(yùn)轉(zhuǎn)，完成了系統(tǒng)總體功能設(shè)計(jì)和各子系統(tǒng)的詳細(xì)功能設(shè)計(jì)。 電子購物系統(tǒng)主要實(shí)現(xiàn)的子模塊有如下幾部分，其主旨為確保用戶的商品瀏覽、購買、收藏、評(píng)價(jià)等在平臺(tái)上實(shí)現(xiàn)： 商品列表和詳情展示 ，提供用戶瀑布流的瀏覽形式和各類篩選條件，及商品的部分信息，讓用戶根據(jù)各種條件來瀏覽自己想要看到的商品，并展示商品的詳細(xì)信息，包括庫存量，顏色，售價(jià)，真人穿戴樣式等。 登錄注冊(cè)系統(tǒng) ，實(shí)現(xiàn)賬戶的創(chuàng)立，基礎(chǔ)信息 的填寫，及賬號(hào)的登錄過程。 購物車系統(tǒng) ，用戶 可以輕松建立一個(gè)功能強(qiáng)大的 網(wǎng)絡(luò)訂單 ，實(shí)現(xiàn)用戶 下單 、在線定購、在線支付等電子商務(wù)功能 。 訂單管理系統(tǒng) ，用來管理用戶已經(jīng)完成或正在進(jìn)行中的訂單。 評(píng)價(jià)系統(tǒng) ， 幫助顧客 購買完成 之后，請(qǐng)顧客對(duì)服務(wù)人員的服務(wù)質(zhì)量 和商品質(zhì)量 進(jìn)行評(píng)價(jià) 。 第一章緒論 4 第四節(jié) 本文組織結(jié)構(gòu) 本文中，第一章中整體介紹電子購物系統(tǒng)產(chǎn)生的環(huán)境原因，包括：“論文背景”、“國內(nèi)外研究現(xiàn)狀”、“研究內(nèi)容”，分析了為什么要做這樣一個(gè)系統(tǒng)的同時(shí)，也描述了我們要做一個(gè)什么樣的系統(tǒng)； 第二章中，介紹了電子購物系統(tǒng)的系統(tǒng)需求分析，通 過對(duì)平臺(tái)搭建的目的和運(yùn)營方需求，構(gòu)架了具體的功能，為系統(tǒng)的設(shè)計(jì)及實(shí)現(xiàn)打下一個(gè)良好的基礎(chǔ)； 第三章中，羅列了開發(fā)本系統(tǒng)所用的關(guān)鍵性的技術(shù)。 第四章中，從整體上介紹了系統(tǒng)的功能設(shè)計(jì)，也就是設(shè)計(jì)系統(tǒng)總的處理方案，又稱系統(tǒng)概要設(shè)計(jì)。 第五章中，詳細(xì)介紹系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)。根據(jù)系統(tǒng)設(shè)計(jì)的原則，依照系統(tǒng)的需求分析，將系統(tǒng)的功能從整體到局部進(jìn)行模塊化，并按照子系統(tǒng)功能模塊開發(fā)實(shí)現(xiàn)了各個(gè)子模塊的具體功能。 第六章中，結(jié)合相關(guān)技術(shù)及具體實(shí)現(xiàn)方案對(duì)系統(tǒng)整體進(jìn)行了描述。 在本文的最后一章，說明了本課題研究中的所得與不足，并對(duì)本課題 的前景進(jìn)行了展望。第二章系統(tǒng)需求分析 5 第二章 系統(tǒng)需求分析 第一節(jié) 功能需求 統(tǒng)總體目標(biāo) 本電子商務(wù)購物系統(tǒng)需要達(dá)到的目標(biāo)是：累積用戶、讓用戶看到感興趣的商品、最新的商品信息、商品評(píng)價(jià)、本公司的歷史和現(xiàn)狀、人員招聘等，從而擴(kuò)大公司知名度，開拓更廣闊的市場。 基本策略：產(chǎn)品策略，價(jià)格策略，促銷策略。 規(guī)劃和設(shè)計(jì)原則： 1）實(shí)施商務(wù)流程再造原則：支付營銷，零庫存， 24 7服務(wù)； 2）實(shí)施原則：用盡可能少的成本為客戶創(chuàng)造盡可能多的服務(wù)和優(yōu)惠。 采用 上零售系統(tǒng)，即商家對(duì)個(gè)人客戶的電子商務(wù)。 塊是面向網(wǎng)上零售商 的模式，結(jié)合傳統(tǒng)交易習(xí)慣，改善客戶購物流程，增進(jìn)網(wǎng)上零售商與客戶間的交流與溝通。通過一系列個(gè)性化服務(wù)成功實(shí)現(xiàn)網(wǎng)上零售商對(duì)客戶的一對(duì)一互動(dòng)式管理，具體功能如圖 示 6。 圖 統(tǒng)目標(biāo)流示例圖 第二章系統(tǒng)需求分析 6 目設(shè)計(jì)原則 由于我們的電子購物系統(tǒng)將會(huì)把目標(biāo)用戶設(shè)定在整個(gè)的亞太地區(qū)，因此，系統(tǒng)的設(shè)計(jì)準(zhǔn)則中，應(yīng)該加入可復(fù)用、可延展、便于維護(hù)、使用靈活的特性。而且，在整個(gè)的研發(fā)的階段里，需要注意那些大規(guī)模反復(fù)的功能開發(fā)，多去使用第三方成熟的控件。同時(shí)，還要注意以下的原則： 便于維護(hù)的系統(tǒng)是避免系統(tǒng)升級(jí)維 護(hù)等問題造成的對(duì)整個(gè)普通使用者的影響，應(yīng)該是易于維護(hù)、安裝和升級(jí)的。 高度的時(shí)效原則，是指需要系統(tǒng)盡量得高效能和緊湊，因?yàn)橄到y(tǒng)隨時(shí)隨地都會(huì)有必須去完成的并行發(fā)送的業(yè)務(wù)訴求，這樣會(huì)適當(dāng)加速每次訴求的反應(yīng)時(shí)長，不會(huì)出現(xiàn)讓用戶去等著系統(tǒng)進(jìn)行數(shù)據(jù)加工的情況。 可延展性是指，系統(tǒng)要擁有高效的可延展性和靈敏性，要盡量顧及之后的運(yùn)營變化情況和網(wǎng)站的發(fā)展情況，可以依據(jù)需求的變化而迅速改變和增加功能需求，而滿足業(yè)務(wù)的發(fā)展。不會(huì)讓程序開發(fā)成為制約業(yè)務(wù)發(fā)展的條件，從而能順利發(fā)展公司的業(yè)務(wù)。 具有一致的標(biāo)準(zhǔn)，包括：數(shù)據(jù)庫標(biāo)準(zhǔn)、技術(shù) 標(biāo)準(zhǔn)、設(shè)計(jì)規(guī)范、代碼規(guī)范、及其他有關(guān)的規(guī)范內(nèi)容。 平穩(wěn)性原則是指，用戶對(duì)網(wǎng)站的訪問過程中，能夠平穩(wěn)有效得進(jìn)行，不會(huì)因?yàn)樵L問量過大等情況，出現(xiàn)宕機(jī)。 易用性原則，只不違背互聯(lián)網(wǎng)用戶的使用習(xí)慣，可以簡單上手，不需要用戶有很高的學(xué)習(xí)成本。 還需要有很高的安全性，指網(wǎng)站的所有數(shù)據(jù)都要非常嚴(yán)謹(jǐn)?shù)谋Ｃ?，任何?nèi)容的丟失和泄露都會(huì)是無法彌補(bǔ)的經(jīng)濟(jì)損失，所以程序在開發(fā)商要盡一切可能考慮安全和防泄漏的規(guī)則，保證信息不會(huì)丟失、泄露。 需要和互聯(lián)網(wǎng)先進(jìn)的技術(shù)接軌，保證程序和前端設(shè)計(jì)上與時(shí)俱進(jìn)，也使得用戶在使用上更加流暢。 務(wù)需求內(nèi)容 注冊(cè)功能：外部用戶需要使用郵箱或者手機(jī)號(hào)注冊(cè)，填寫昵稱和密碼。需要保持手機(jī)號(hào)、郵箱、昵稱三者的唯一性，并且同一個(gè) 一個(gè)時(shí)間段內(nèi)注冊(cè)第二章系統(tǒng)需求分析 7 賬號(hào)數(shù)量要有所限制。 登錄功能：已經(jīng)注冊(cè)過的用戶，可以通過輸入郵箱（或手機(jī)號(hào)）登錄網(wǎng)站，并且持續(xù)保有之前的購買和收藏夾記錄。同時(shí)，一個(gè) 一個(gè) 用戶，在一定時(shí)間段內(nèi)登錄錯(cuò)誤的次數(shù)要有所限制。 商品展示功能：需要能按照每個(gè)商品單獨(dú)的頁面的形式，展現(xiàn)不同的商品，同時(shí)用戶可以購買到任意有效期間的商品，且該商品下架的時(shí)候會(huì)提示下架，而非刪除掉。 商品 篩選及排序功能：用戶可以通過顏色、分類、價(jià)格區(qū)間、品牌等篩選出想要的商品，且可以按照價(jià)格、人氣、上架時(shí)間等進(jìn)行商品排序。 商品搜索功能：可以通過關(guān)鍵詞的輸入搜索到相關(guān)的商品，包括搜索聯(lián)想和錯(cuò)詞匹配功能。 購物車功能：可以完成商品下單到購買的過程，并且實(shí)現(xiàn)銀聯(lián)和支付寶兩種支付方式。 評(píng)價(jià)功能：實(shí)現(xiàn)購買完商品的用戶，對(duì)其購買的商品進(jìn)行評(píng)價(jià)，未購買商品的用戶不能參與評(píng)價(jià)的過程。 第二節(jié) 非功能需求 統(tǒng)安全性要求 對(duì)于該方面的需求，安全考慮上應(yīng)包括：超時(shí) 護(hù)、口令傳輸單項(xiàng)不可逆加密、驗(yàn)證 身份、不同用戶的不同權(quán)限管理，結(jié)構(gòu)代碼必須安全，而且架構(gòu)上要能承受住黑客的攻擊行為。 超時(shí) 護(hù) 。對(duì) 定一個(gè)超時(shí)的時(shí)間，如果長時(shí)間不進(jìn)行任何操作，即視為超時(shí)，必須要重新登錄才可以。 口令傳輸單項(xiàng)不可逆加密 。為了防止黑客的惡意攻擊和木馬嗅探的方式，口令的傳輸需要用以上的方式進(jìn)行加密。 驗(yàn)證身份 。無論是管理員在后臺(tái)登錄，還是前臺(tái)普通用戶登錄網(wǎng)站，都應(yīng)該有驗(yàn)證碼來驗(yàn)證身份。 不同用戶的不同權(quán)限管理 。后臺(tái)的各個(gè)模塊應(yīng)該能夠根據(jù)不同的用戶設(shè)置第二章系統(tǒng)需求分析 8 不同的權(quán)限，基于角色來設(shè)定訪問的功能點(diǎn)，同時(shí)這些權(quán) 限又是可以變化和調(diào)節(jié)的。另外，要求綁定用戶的 進(jìn)一步增加安全性，某個(gè)賬號(hào)只能在這個(gè) 碼安全控制。 同時(shí)，要做到以下的需求，防止黑客從代碼角度進(jìn)行攻擊：防止 止 入、腳本注入、 入型的攻擊；防止頻繁試錯(cuò)和強(qiáng)行破壞方式的攻擊；防止其他站點(diǎn)跨站的欺騙請(qǐng)求和腳本攻擊；防止劫持和被修改 8。 構(gòu)要求 所有的 求采用外部引用的方式，不要直接在頁面中編寫 碼。按不同的模塊需要的 寫多個(gè) 件，按需引用。 采用 式來進(jìn)行日志、審計(jì)、錯(cuò)誤處理等的控制，增加系統(tǒng)的柔性。 統(tǒng)兼容性要求 系統(tǒng)要求良好的瀏覽器兼容性，要求在 卓 以上版本、不同的手機(jī)操作系統(tǒng)中可以正常的顯示和處理。在各種瀏覽器中保持頁面展示的一致性，不會(huì)發(fā)生頁面變形或 理錯(cuò)誤 4。 第三節(jié) 系統(tǒng)用例 錄注冊(cè)用例 用戶注冊(cè)部分，當(dāng)用戶填寫完相應(yīng)資料之后，即可在網(wǎng)站注冊(cè)一個(gè)屬于自己的賬號(hào)，之后也可以通過本次填寫的信息再次登錄，同時(shí)，擴(kuò)展關(guān)系允許用戶自主邀請(qǐng)好友注冊(cè)應(yīng)用。 用戶登錄 部分，分為手機(jī)號(hào)登錄和郵箱登錄兩部分，根據(jù)用戶注冊(cè)時(shí)填寫信息的不同，登錄可使用的方式也不同，屬于泛化關(guān)系。 用戶信息修改部分，包含登錄密碼修改和基礎(chǔ)信息修改兩部分，修改密碼之后，原密碼將無法再使用，基礎(chǔ)信息修改之后，部分會(huì)顯示該信息的區(qū)域會(huì)第二章系統(tǒng)需求分析 9 隨之跟著更新。登錄注冊(cè)功能的用例圖，如圖 示。 圖 錄注冊(cè)功能用例圖 品購買用例 商品購買分為 購物車 和 訂單結(jié)算 兩個(gè)子功能，因?yàn)閮?nèi)容關(guān)聯(lián)性較強(qiáng)，在功能需求部分合并為一個(gè)用例單元展示。 在購物車的功能中，分為購物車維護(hù)、生成訂單和登錄三個(gè)部分的用 例。 其中，購物車維護(hù)具有 3 個(gè)功能，分別是添加商品、移除商品和更新商品數(shù)量。添加商品即將用戶中意的商品加入其購物車中，刪除商品是將不想購買的商品從購物車中刪除，更新商品數(shù)量是更新用戶的購物車，將其中失效的商品臨時(shí)去掉。 登錄功能是直接調(diào)用 中寫到的登錄系統(tǒng)，此處不再復(fù)述。 訂單結(jié)算包含填寫收貨方式、選擇支付方式、使用代金券、使用余額、訂單提交支付 5 個(gè)部分。填寫收貨方式時(shí)，用戶填寫其收貨人等詳細(xì)信息，后續(xù)會(huì)發(fā)給快遞公司寄送商品；選擇支付方式，可選銀聯(lián)支付和支付寶支付；使用代金券，即用戶可以使用其通過 活動(dòng)等方式收到的各種代金券，可抵免一部分現(xiàn)金；使用余額即用戶可以使用其之前購買后在網(wǎng)站所剩的余額；訂單提交支第二章系統(tǒng)需求分析 10 付即最后步驟，訂單提交到網(wǎng)站中。商品購買流程的用例圖，如圖 示。 圖 品購買功能用例圖 人中心用例 個(gè)人中心分為 5 個(gè)功能部分，分別是查看更新個(gè)人信息、修改密碼、購物車維護(hù)、訂單瀏覽維護(hù)、退出登錄。 查看更新個(gè)人信息即更新該用戶的個(gè)人信息，更新后部分顯示該信息的地方也會(huì)隨著更新；修改密碼即修改用戶登錄密碼，不再復(fù)述；購物車維護(hù)即維護(hù)購物車信息，不再復(fù)述；訂單瀏覽維護(hù)，是瀏覽 已經(jīng)完成和過程中的訂單，分為 3 部分，訂單列表瀏覽、訂單詳情擦看、訂單狀態(tài)修改，其中“訂單狀態(tài)修改“部分是完成之前未完成的訂單的功能；退出登錄即把自己的用戶狀態(tài)從登錄用戶變?yōu)橛慰蜖顟B(tài)。用戶個(gè)人中心用例圖，如圖 示。 第二章系統(tǒng)需求分析 11 圖 人中心功能用例圖 品瀏覽用例 商品瀏覽的情況分為兩部分，商品列表頁查看和商品詳情頁查看。 商品列表頁查看的時(shí)候，可以通過關(guān)鍵字搜索找到商品，也可以通過各種條件的篩選找到商品，找到商品以后可以通過一些條件進(jìn)行結(jié)果的排序。 商品詳情頁查看的過程中，可以添加商品到購物車 和到收藏夾。用戶商品瀏覽功能的用例圖，如圖 示。 第二章系統(tǒng)需求分析 12 圖 品瀏覽用例圖 價(jià)功能用例 評(píng)價(jià)系統(tǒng)包括文字評(píng)價(jià)和打分兩個(gè)部分，只有購買過商品的用戶才能進(jìn)行評(píng)價(jià)，并且文字評(píng)價(jià)和打分兩項(xiàng)均非必填，用戶可以填寫任意一項(xiàng)，或者均不填寫。評(píng)價(jià)功能的用例圖，如圖 示。 圖 價(jià)功能用例圖 第三章關(guān)鍵 技術(shù) 13 第三章 關(guān)鍵技術(shù) 第一節(jié) 本課題所運(yùn)用的技術(shù)概述 在本系統(tǒng)的設(shè)計(jì)中，主要涉及到了如下的技術(shù)： 基于 術(shù)開發(fā)。其中，由 制頁面結(jié)構(gòu)與布局， 制樣式，控制 本， 控制 本，與用戶交互 5。 基礎(chǔ)類庫 本主要開發(fā)語言為 本開發(fā)語言為 靠 為主要基礎(chǔ)類庫，并加載由 發(fā)的 術(shù)，實(shí)現(xiàn)對(duì)用戶操作的快速響應(yīng)，并兼容 臺(tái)瀏覽器。 框架 移動(dòng)版的框架是在充分吸取 大典型框架的技術(shù)優(yōu)點(diǎn)之后，重構(gòu)完成，已經(jīng)形成獨(dú)立框架。新框架以 構(gòu)為基礎(chǔ)，支持對(duì)象事件驅(qū)動(dòng)，并將 行綁定，將應(yīng)用模塊化，實(shí)現(xiàn)頁面切換。 數(shù)據(jù)交互與存儲(chǔ) 移動(dòng)版的與后臺(tái)的數(shù)據(jù)交互通過標(biāo)準(zhǔn) 議進(jìn)行，主要數(shù)據(jù)格式為以瀏覽器原生支持的 式，并充分利用 本地存儲(chǔ) 現(xiàn)在最短時(shí)間向用戶展示網(wǎng)站內(nèi)容。 用戶行為統(tǒng)計(jì) 為提升用戶體驗(yàn)，提升銷售業(yè)績，通過基因后臺(tái)及 供的接口，記錄用戶行為 9。 第二節(jié) 紹 為了替代 1999 年版本的 其同年制定的 在大多數(shù)的瀏覽器已經(jīng) 可以支持 語言模式了，雖然其仍處于一個(gè)完善中的階段。 2 個(gè)非常明顯的特征：第一，加強(qiáng)了 術(shù) 14 頁面的功能。第二，添加了本地?cái)?shù)據(jù)庫的網(wǎng)頁端應(yīng)用的性能。整體上說到 往是指 整合在一起的完整技術(shù)。他們致力于減小瀏覽器需要的控件網(wǎng)絡(luò)應(yīng)用服務(wù)，包括 ，而且希望能夠增加強(qiáng)化網(wǎng)絡(luò)使用的標(biāo)準(zhǔn)化的集合。 由于缺乏 后的網(wǎng)絡(luò)標(biāo)準(zhǔn)， 1999 年 12 月 之后就沒有任何的更新了，為了改變這一現(xiàn)狀，增強(qiáng) 式化的發(fā)展，很多的公司一起行動(dòng)起來，成立了一個(gè)叫 團(tuán)體（ 含義是（ 語言文本開發(fā)程序項(xiàng)目組），其希望改善 用程序和菜單，在 2006 年， 維網(wǎng)聯(lián)盟， 行融合，希望能開發(fā)出一個(gè)全新的 準(zhǔn)。 在 2004 年， 互聯(lián)網(wǎng)界公布了一個(gè)新的 案 前身是 三年后的 2007 年，與 并，簡歷了新的服務(wù)于 項(xiàng)目團(tuán)隊(duì)。 2008 年 1 月 22 日，他們向人們公布了第一份正式的 草案?，F(xiàn)在大多數(shù)的瀏覽器已經(jīng)可以支持 語言模式了，雖然其仍處于一個(gè)完善中的階段。 維網(wǎng)聯(lián)盟）在 2012 年 12 月 17 日，發(fā)言宣布了 規(guī)范正式版本，向世界宣稱： 開放的 絡(luò)平臺(tái)的奠基石。 在一年后的 5 月 6 日， 正式版本對(duì)外宣布。首次要修改萬維網(wǎng)的核心代碼： 超文本標(biāo)記語言。這個(gè)經(jīng)歷了 5 次重大版本的新版本里，為致力增強(qiáng)元素的互動(dòng)性，提出了很多心的功能。 從同年（ 2012 年）的 12 月 27 日開始，即本版本的發(fā)布時(shí)，進(jìn)行的修改大致近百項(xiàng)，涵蓋相關(guān)的接口、 標(biāo)簽、 標(biāo)簽等，另外 進(jìn)行了調(diào)整，還有 圖片 理性能，全部由了質(zhì)的飛躍。 能夠支撐 瀏覽器有如下的幾個(gè)： 其更高版本， 內(nèi)瀏覽器包括：傲游瀏覽器， 360 瀏覽器、搜狗瀏覽器、 覽 器、獵豹瀏覽器等。 移動(dòng)端如果要開發(fā)基于 有兩種路子可選，用全部引擎，和用全部 語法。 基于全部使用 手機(jī) 運(yùn)行非常慢，而且錯(cuò)誤很多，不過在第三章關(guān)鍵 技術(shù) 15 整體效果的改善后會(huì)變得好一些。不過卻沒有多少人愿意做這樣費(fèi)力不討好的改善。 方法雖然很復(fù)雜，但其預(yù)設(shè)了一個(gè) 包去用，使手機(jī)上的網(wǎng)頁游戲成為了現(xiàn)實(shí)。 手機(jī) 好處在于可以直接在頁面上 初的 發(fā)者可能需要用非常大的代碼量才能完成 樣式效果 ，要不停得去調(diào)試、修改代碼和測試運(yùn)行。所以呢，也有很多的手機(jī)雜志 用 標(biāo)準(zhǔn)，開發(fā)者的調(diào)試變得很簡單。圖 示了 際標(biāo)準(zhǔn)規(guī)定的圖標(biāo)樣式。 圖 際標(biāo)準(zhǔn)圖標(biāo) 第三節(jié) 層疊樣式表（ 介 也被稱為層疊樣式表。它的作用是定義如何顯示 素，同時(shí)控制 面的外觀。樣式存儲(chǔ)在樣式表中，通常放在 部分（內(nèi)部樣式表）或存儲(chǔ)在外部 件（外部樣式表）里。實(shí)際應(yīng)用中，設(shè)計(jì)者可以通過修改樣式表的定義 方式使頁面展現(xiàn)出完全不同的外觀，當(dāng)網(wǎng)站擁有大量，如幾十，上百的頁面時(shí)，通過修改頁面鏈接的樣式表文件即可修改頁面的外觀，而不用修改每一個(gè)頁面，從而大量的減少工作量。相較于傳統(tǒng)的表格布局方式而言，層疊樣式表具有便于網(wǎng)頁修改、便于網(wǎng)頁的統(tǒng)一、減少網(wǎng)頁體積等特點(diǎn)。圖 際標(biāo)準(zhǔn)中定義的圖標(biāo)。 第三章關(guān)鍵 技術(shù) 16 圖 際標(biāo)準(zhǔn)圖標(biāo) 1996 年 12 月定版發(fā)布第一個(gè)版本，一經(jīng)發(fā)布，其構(gòu)思和方法即吸引各方的注意。 1997 年初， 維網(wǎng)聯(lián)盟）成立了專門的 作組，并于 1998 年 5 月出版第二版，即為 這當(dāng)中，新增了諸如通用、相鄰?fù)⒆舆x擇器等多種高級(jí)選擇器，也添加了諸如浮動(dòng)和定位等高級(jí)概念，令能變得更加得全面，應(yīng)用起來也更加得方便。 版本（草案版本）出現(xiàn)在 2009 年，與之前相比較，模塊化的開發(fā)方式被加入到 開發(fā)框架中。其中，分解成用很多小的模塊用以代替原有的大模塊，又研發(fā)了很多新模塊，諸如：多欄布局、超級(jí)鏈接的方式、背景、邊框、列表模式、文字特效等。頁面布局中，設(shè)計(jì)者通過對(duì)層疊樣式表（ 靈活使用，克服了一個(gè)在之前開發(fā)中一直很難解決的普遍問題： 起初的設(shè)計(jì)中 標(biāo)簽是用作被定義文檔的內(nèi)容。原先，我們標(biāo)記“段落”、“表格”、“標(biāo)題”等會(huì)使用諸如 、 、 等類型的標(biāo)簽，瀏覽器則負(fù)責(zé)完成對(duì)文檔布局的功能，并不涉及到任何格式化形式的標(biāo)簽。目前的主要的瀏覽器形式（ 斷往 規(guī)范中添加了很多新的諸如字體標(biāo)簽和顏色的屬性和新的 簽，將一件事情變得越來越困難，那就是創(chuàng)建一個(gè)清晰的文檔，用于文檔的表現(xiàn)層。 萬維網(wǎng)聯(lián)盟，創(chuàng)造出了新的樣式且高于現(xiàn)在的 本，為了去解決以上提到的這個(gè)問題，那么差不多所有的瀏覽器， 都會(huì)支持這種層疊樣式表（ 在不斷的應(yīng)用與凝練中，設(shè)計(jì)者們通過使用 術(shù)有效地提高了工作效率，通過運(yùn)用外部樣式表，使開發(fā)者可以同時(shí)改變網(wǎng)站中所有頁面的布局與外觀。通過對(duì) 件進(jìn)行修改，網(wǎng)站中的所有元素均會(huì)自動(dòng)進(jìn)行更新，從而實(shí)現(xiàn)全局更新的目的。 第三章關(guān)鍵 技術(shù) 17 第四節(jié) 術(shù) 在網(wǎng)頁開發(fā)過程中，除了對(duì)頁面進(jìn)行布局以外，經(jīng)常需要在頁面上實(shí)現(xiàn)諸多的特殊效果，使自己的網(wǎng)站具有出眾的視覺沖擊和表現(xiàn)張力。為了實(shí)現(xiàn)特殊效果，開發(fā)者經(jīng)常會(huì)采用 表現(xiàn)，誠然 網(wǎng)頁表現(xiàn)力上具有非常優(yōu)秀的效果，但是大量 的 入將會(huì)嚴(yán)重拖緩頁面的讀取速度，對(duì)于用戶的使用而言，不能稱之為一種好的辦法。 為了解決這種問題，更多的開發(fā)者使用 代替 實(shí)現(xiàn)特效，但是傳統(tǒng)意義的 表現(xiàn)力明顯不能令用戶與資方滿意， 的出現(xiàn)和應(yīng)用改變了這一狀況，使頁面在加載速度和表現(xiàn)力上獲得了一個(gè)出色的平衡點(diǎn)。由頂尖 發(fā)人員組成的核心團(tuán)隊(duì)開發(fā)出的 一個(gè)強(qiáng)大的 。開發(fā)者可以運(yùn)用其中的方法來增強(qiáng)自己的網(wǎng)站。 一個(gè)緊湊的文件中提供 了豐富多樣的特性、簡單易學(xué)的語法和穩(wěn)健的跨平臺(tái)兼容性。此外，百余種為擴(kuò)展 能而開發(fā)的插件，更使得它幾乎成為適用于各類客戶端腳本編程的必備工具。 為 本編程提供了通用的抽象層，它容易擴(kuò)展而且不斷有新插件面世來對(duì)其功能進(jìn)行增強(qiáng)，使得它幾乎適用于任何腳本編程的情形。 以實(shí)現(xiàn)以下的這些需求： 找到某個(gè)頁面里邊的元素點(diǎn)。 了精準(zhǔn)地找到急需查詢和控制的文檔里的元素點(diǎn)，貢獻(xiàn)了非常迅捷和靠譜的機(jī)制 到以上這點(diǎn)，在不考慮 庫的情況下，不用他去遍尋文檔對(duì)象模型樹，一定要敲非常多的程序代碼，去找尋 檔類目里的一些特定的部分。 改變網(wǎng)頁的外形。使用 要寫很少的程序代碼，就可以完成修改文本、重新排序列表、轉(zhuǎn)動(dòng)和插入圖像，因?yàn)槊媾R瀏覽器不能完美支持同樣的準(zhǔn)的時(shí)候，雖然 這方面給出了非常大的支持的手段，但仍就顯得力不從心。但 過給出跨瀏覽器的解決方法的方式，完美得解決了這一點(diǎn)。而且，就算頁面已經(jīng)完成并呈現(xiàn)給了用戶， 是可以修改頁面中的某個(gè)部分的樣式的屬性。 配合訪問者的對(duì)于頁 面的操作。 供了截取形形色色的頁面事件的適當(dāng)方式，而不需要使用事件處理程序搞亂 碼。此外，它的事件處理消除了經(jīng)常困擾 發(fā)人員的瀏覽器不一致性。 第三章關(guān)鍵 技術(shù) 18 添加了很多動(dòng)態(tài)效果到頁面里。 內(nèi)置了大量的淡入、擦除、縮放、彈出、過度的效果，為開發(fā)者所用，進(jìn)而增加其頁面增加表現(xiàn)力。 圖 際標(biāo)準(zhǔn)圖標(biāo) 第五節(jié) 開發(fā)環(huán)境和工具 發(fā) 要一個(gè)開發(fā)框架和編譯環(huán)境， 我們 選擇 的是 開源的 平臺(tái) 一個(gè)開源的開發(fā)框架，使用 構(gòu)建跨平臺(tái)的的移動(dòng)應(yīng)用程序。它使開發(fā)者能夠利用 能手機(jī)的核心功能 包括地理定位，加速器，聯(lián)系人，聲音和振動(dòng)等，此外 有豐富的插件，可以以此擴(kuò)展無限的功能。 圖 示了 國際標(biāo)準(zhǔn)圖