基于Node.js的網上書店設計與實現

王華威

（天津科技大學，天津 300222）

0 引言

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

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

1 相關技術介紹

1.1 開發涉及的重要語言介紹

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

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

1.2 B/S結構介紹

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

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

2 系統需求分析

2.1 功能性需求分析

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

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

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

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

圖1 B/S 三層體系結構示意圖

圖2 總體功能需求用例圖

2.2 非功能性需求

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

3 系統設計

3.1 系統功能設計

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

3.2 數據庫設計

數據庫結構設計的好壞直接對系統的效率及實現的效果產生影響，合理的數據庫設計可以提高數據存儲和檢索的效率，保證數據的完整性和一致性[4]。該系統涉及的5 個實體分別對應5 張表，具體設計見表1。

表1 網上書店數據庫設計及其功能

4 結語

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

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

圖3 前臺用戶用例分析圖

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