王華威

（天津科技大學(xué)，天津 300222）

0 引言

近年來，互聯(lián)網(wǎng)技術(shù)的飛速發(fā)展使人們?cè)谏畹母鱾€(gè)方面感受到科技進(jìn)步日新月異。隨之興起的電子商務(wù)革新了傳統(tǒng)的購物方式，開啟了網(wǎng)絡(luò)購物的新紀(jì)元，越來越多的傳統(tǒng)行業(yè)為順應(yīng)時(shí)代潮流開始轉(zhuǎn)變或發(fā)展電商業(yè)務(wù)。有了互聯(lián)網(wǎng)信息技術(shù)的支持，完備的電子商務(wù)系統(tǒng)以友好的平臺(tái)正逐漸被越來越多的人所接受，甚至成了多數(shù)人購物時(shí)的首選。近幾年，備受青睞的淘寶網(wǎng)、天貓商城和京東等都是綜合型電商購物平臺(tái)，也有當(dāng)當(dāng)網(wǎng)、蘇寧易購等專注于某特定領(lǐng)域的電商購物平臺(tái)。

網(wǎng)上書店正是目前電子商務(wù)系統(tǒng)應(yīng)用最為廣泛、最為成功的具體表現(xiàn)形式之一。相比于傳統(tǒng)書店，網(wǎng)上書店是一種質(zhì)量高且方便快捷的購書方式，網(wǎng)站式的書店相較于實(shí)體書店運(yùn)用了更多信息化的科技手段，可以更加合理地對(duì)圖書進(jìn)行管理。

1 相關(guān)技術(shù)介紹

1.1 開發(fā)涉及的重要語言介紹

Node.js 是一個(gè)基于Google 的V8 引擎的事件驅(qū)動(dòng)I/O 的服務(wù)端JavaScript 環(huán)境，V8 引擎執(zhí)行JavaScript 的性能非常好，速度相當(dāng)快[1]。非阻塞I/O 模型具有輕量、高效的特點(diǎn)，Node.js 十分適用于搭建響應(yīng)速度快、易于拓展的網(wǎng)絡(luò)應(yīng)用?？偟膩碚f，Node.js 就是運(yùn)行在服務(wù)器端的JavaScript，它是由事件驅(qū)動(dòng)的I/O 服務(wù)器端環(huán)境，適用于數(shù)據(jù)密集的分布式實(shí)時(shí)應(yīng)用系統(tǒng)的開發(fā)。在有大量的Ajax 請(qǐng)求時(shí)，如在網(wǎng)站搜索商品的情景，每個(gè)用戶可能看到的是不同的頁面，緩存失效或在頁面加載時(shí)需要發(fā)起Ajax 請(qǐng)求，這時(shí)Node.js 能輕松的響應(yīng)大量的并發(fā)請(qǐng)求。使用Node.js 不僅開發(fā)成本低、效率高，還可以有效地降低開發(fā)的復(fù)雜度。

Vue.js 是近年來最熱門的前端框架技術(shù)之一。它提供了一個(gè)可組合的組件系統(tǒng)，可以用于構(gòu)建交互式的Web 界面庫；其采用了自底向上增量開發(fā)的設(shè)計(jì)，提供了MVVM 數(shù)據(jù)綁定和簡(jiǎn)單易于理解、靈活的API。MVVM 模式是由MVC（Model View Controller）經(jīng)典設(shè)計(jì)框架衍生出來的，全稱是Model View ViewModel，它主要側(cè)重于事件驅(qū)動(dòng)的UI 平臺(tái)的開發(fā)。MVVM 的本質(zhì)是通過數(shù)據(jù)綁定鏈接View 和Model，使數(shù)據(jù)的變化自動(dòng)映射為視圖的更新[2]。Vue.js 提供基于HTML的模板，Vue.js 實(shí)例數(shù)據(jù)與DOM 綁定在一起，虛擬的DOM渲染函數(shù)由模板編譯而來。Vue.js 最大的優(yōu)勢(shì)之一就是體積小，使用它在總體上會(huì)節(jié)約更多成本。

1.2 B/S結(jié)構(gòu)介紹

B/S 即瀏覽器/服務(wù)器模式，由于其可將核心功能都集中在服務(wù)器上的優(yōu)勢(shì)，為系統(tǒng)后期的維護(hù)及使用提供了極大的便利。該結(jié)構(gòu)為三層架構(gòu)，分層式結(jié)構(gòu)在軟件體系架構(gòu)設(shè)計(jì)中占據(jù)了舉足輕重的地位。第一層為表現(xiàn)層（UI），即用戶在使用系統(tǒng)時(shí)所看到的界面；業(yè)務(wù)邏輯層（BLL）為第二層，該層主要是對(duì)數(shù)據(jù)層進(jìn)行操作；第三層為數(shù)據(jù)訪問層（DAL），該層所做事務(wù)直接操作數(shù)據(jù)庫，針對(duì)數(shù)據(jù)的增添、刪除、修改、更新、查找等[3]。其三層體系結(jié)構(gòu)示意圖如圖1 所示。

B/S 結(jié)構(gòu)諸多優(yōu)點(diǎn)中最顯著的一點(diǎn)是實(shí)現(xiàn)了客戶端的零維護(hù)，可有效減輕服務(wù)器的負(fù)擔(dān)。目前，軟件系統(tǒng)的改進(jìn)和升級(jí)越來越頻繁，使用B/S 簡(jiǎn)化了維護(hù)和升級(jí)方式的同時(shí)，在增加交互性和進(jìn)行局部實(shí)時(shí)刷新方面也頗有助益。該模式基于網(wǎng)頁語言的特點(diǎn)賦予了其跨平臺(tái)的優(yōu)勢(shì)，發(fā)展前景十分可觀。

2 系統(tǒng)需求分析

2.1 功能性需求分析

根據(jù)網(wǎng)上書店使用群體的意愿及功能要求分析，將網(wǎng)上書店劃分為前臺(tái)和后臺(tái)相關(guān)信息管理2 個(gè)部分。前臺(tái)主要是接受來自全國(guó)各地的用戶的網(wǎng)上訪問；系統(tǒng)管理員主要負(fù)責(zé)使用網(wǎng)上書店的后臺(tái)來完成管理工作。

前臺(tái)包括用戶對(duì)網(wǎng)站的注冊(cè)、登錄、圖書詳細(xì)信息的瀏覽、按照?qǐng)D書名搜索、添加地址和提交訂單等。

后臺(tái)包括管理員上、下架圖書、添加修改圖書分類和修改訂單狀態(tài)等。

根據(jù)以上需求描述，在此分為2 類網(wǎng)站用戶，根據(jù)用戶身份提供不同的功能。以下對(duì)功能描述進(jìn)行詳細(xì)的劃分，并進(jìn)行角色分析，將主要業(yè)務(wù)用例進(jìn)行建模描述，其總體功能需求用例圖如圖2 所示。前臺(tái)頁面主要供用戶身份使用，繪制成用例圖展示如圖3 所示。后臺(tái)頁面供管理員身份用戶使用，管理員不需要注冊(cè)直接登錄使用，管理員也相當(dāng)于是一種特殊身份類型的用戶，可以操作使用前臺(tái)功能，但是主要是對(duì)平臺(tái)進(jìn)行管理操作，管理員與普通用戶之間存在泛化關(guān)系，后臺(tái)管理員用例圖展示如圖4 所示。

圖1 B/S 三層體系結(jié)構(gòu)示意圖

圖2 總體功能需求用例圖

2.2 非功能性需求

用戶體驗(yàn)是系統(tǒng)的一個(gè)重要指標(biāo)，為了確保前端框架的良好用戶體驗(yàn)，需要考慮以下非功能性需求：1）網(wǎng)頁深度盡量降低、避免內(nèi)容繁雜。2）網(wǎng)頁主題明確，重點(diǎn)突出；頁面設(shè)計(jì)簡(jiǎn)潔、人性化，易于用戶操作；網(wǎng)頁風(fēng)格設(shè)計(jì)統(tǒng)一，布局美觀大方，參照扁平化風(fēng)格設(shè)計(jì)。3）合理使用CSS 樣式和HTML 標(biāo)簽，優(yōu)化頁面性能。4）提高響應(yīng)速度，降低故障發(fā)生的概率。5）利用模塊化思想設(shè)計(jì)，提高可擴(kuò)展性，降低耦合度。

3 系統(tǒng)設(shè)計(jì)

3.1 系統(tǒng)功能設(shè)計(jì)

為了使各項(xiàng)業(yè)務(wù)功能完成起來更加方便、靈活，需要將系統(tǒng)劃分為若干個(gè)部分，對(duì)各部分的功能進(jìn)行詳細(xì)科學(xué)的設(shè)計(jì)規(guī)劃，這樣做不僅可以讓程序更加清晰易讀還能使程序改動(dòng)起來更加便捷。網(wǎng)上書店分為用戶和管理員2 個(gè)模塊，用戶及管理員權(quán)限具體功能描述如圖5 所示。

3.2 數(shù)據(jù)庫設(shè)計(jì)

數(shù)據(jù)庫結(jié)構(gòu)設(shè)計(jì)的好壞直接對(duì)系統(tǒng)的效率及實(shí)現(xiàn)的效果產(chǎn)生影響，合理的數(shù)據(jù)庫設(shè)計(jì)可以提高數(shù)據(jù)存儲(chǔ)和檢索的效率，保證數(shù)據(jù)的完整性和一致性[4]。該系統(tǒng)涉及的5 個(gè)實(shí)體分別對(duì)應(yīng)5 張表，具體設(shè)計(jì)見表1。

表1 網(wǎng)上書店數(shù)據(jù)庫設(shè)計(jì)及其功能

4 結(jié)語

該次開發(fā)使用了近幾年最為流行的前端開發(fā)技術(shù)，構(gòu)建了基于JavaScript 配合Vue 框架和Element-UI 相關(guān)組件以及MySQL 數(shù)據(jù)庫的網(wǎng)上書店網(wǎng)站。采用前后端分離的設(shè)計(jì)，對(duì)于用戶實(shí)現(xiàn)了注冊(cè)、登錄、查看商品詳情、搜索圖書、快速購書、地址管理等功能；對(duì)于管理員實(shí)現(xiàn)了分類管理、商品管理以及訂單管理等功能。

該系統(tǒng)是典型的網(wǎng)上書店系統(tǒng)，從國(guó)內(nèi)外網(wǎng)上書店的發(fā)展來看，開發(fā)前景非常好，暗藏著市場(chǎng)的巨大潛力。主要集中于技術(shù)和服務(wù)的網(wǎng)上書店，將是圖書市場(chǎng)的革新者和領(lǐng)導(dǎo)者。該課題研究旨在書店和消費(fèi)者之間建立高速便利的在線信息橋梁，為用戶節(jié)約時(shí)間、簡(jiǎn)潔便利、方便易用，集眾多優(yōu)點(diǎn)于一身，具有廣闊的市場(chǎng)前景。

圖3 前臺(tái)用戶用例分析圖

圖4 后臺(tái)管理員用例分析圖