基于Node.js的網(wǎng)上書店設(shè)計與實現(xiàn)

王華威

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

0 引言

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

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

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

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

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

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

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

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

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

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

2.1 功能性需求分析

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

前臺包括用戶對網(wǎng)站的注冊、登錄、圖書詳細信息的瀏覽、按照圖書名搜索、添加地址和提交訂單等。

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

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

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

圖2 總體功能需求用例圖

2.2 非功能性需求

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

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

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

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

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

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

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

4 結(jié)語

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

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

圖3 前臺用戶用例分析圖

圖4 后臺管理員用例分析圖