《基于web的網(wǎng)上書屋系統(tǒng)的設(shè)計與實現(xiàn)》7300字（論文）

基于web的網(wǎng)上書屋系統(tǒng)的設(shè)計與實現(xiàn)摘要目前看來，伴隨著Internet的發(fā)展，21世紀主流的商業(yè)模式將會是電子商務(wù)這一行業(yè)。然而作為一種新型圖書在線閱讀、在線購買的線上書屋系統(tǒng)，它也是隨著這些網(wǎng)絡(luò)技術(shù)的普遍發(fā)展油然而生的，并且憑借著它的方便，快捷等一系列的優(yōu)點對傳統(tǒng)的圖書發(fā)行產(chǎn)業(yè)存在著巨大的沖擊力，這不但是一種機遇，也是一種巨大的挑戰(zhàn)。隨著經(jīng)濟的快速發(fā)展和通信技術(shù)的逐步提高，網(wǎng)絡(luò)越來越方便人們的生活，線上閱讀也成了大多數(shù)人的選擇。本論文以基于web的線上書屋系統(tǒng)的研究與設(shè)計為背景。利用線上閱讀系統(tǒng)，以此來方便廣大用戶線上閱讀書籍。該系統(tǒng)主要包括了書籍的分類模塊、在線閱讀模塊和收藏中心模塊。用戶可以無時無刻的在線上閱讀書籍，還可以將自己心儀的圖書添加到收藏中心，在下次閱讀時容易被找到。用戶還可以在線上留言對圖書進行評價，很好的提高了用戶閱讀的興趣[1]。該系統(tǒng)通過分析國內(nèi)外線上書屋的發(fā)展現(xiàn)狀，憑借著軟件工程的基礎(chǔ)步驟，采用超文本鏈接語言HTML、Vue、npm、webpack、路由、axios、es6等技術(shù)實現(xiàn)其相應(yīng)的功能。此系統(tǒng)還提供了圖書瀏覽、圖書查詢、在線閱讀和后臺數(shù)據(jù)管理等功能，這樣的話用戶使用起來會更方便，更快捷。關(guān)鍵詞：線上書屋；Vue；電子商務(wù)；在線閱讀目錄19316一、緒論 -7-28168（一）國內(nèi)外線上書屋的發(fā)展現(xiàn)狀 -7-759（二）課題研究的背景及意義 -7-31637（三）課題研究所應(yīng)用的原理與理論依據(jù) -8-9004二、關(guān)鍵技術(shù)介紹 -8-4356（一）HTML介紹 -8-3801（二）路由的介紹 -8-8114（三）Express的介紹 -8-27855三、系統(tǒng)的開發(fā)目標(biāo) -8-27246四、系統(tǒng)的需求分析 -9-22235（一）功能性需求分析 -9-25895（二）經(jīng)濟可行性分析 -9-30013（三）技術(shù)可行性分析 -9-13049（四）系統(tǒng)安全性分析 -9-4857（五）市場的可行性分析 -9-15824（六）數(shù)據(jù)的來源性分析 -10-22900五、系統(tǒng)的設(shè)計 -10-31738（一）系統(tǒng)功能模塊設(shè)計 -10-23384（二）系統(tǒng)的整體功能模塊設(shè)計 -10-17412（三）界面設(shè)計 -18-18194（四）數(shù)據(jù)設(shè)計 -19-6113六、系統(tǒng)的預(yù)計測試功能 -19-9213（一）軟件測試的概念 -19-7876（二）用戶登錄界面的測試 -19-16654（三）收藏圖書時數(shù)量修改的測試 -20-4740（四）整個系統(tǒng)的測試 -20-25747七、總結(jié) -21-3266參考文獻 -22-一、緒論隨著因特網(wǎng)Internet的普遍發(fā)展，線上閱讀行業(yè)市場的規(guī)模在逐漸的增大，在當(dāng)今世界，伴隨著人們生活水平的逐步提高，人們開始側(cè)重于對知識的探求，在閑暇時間閱讀書也逐漸成為了一種時髦的舉動。由此看來，我們的生活被計算機網(wǎng)絡(luò)技術(shù)的發(fā)展帶來了巨大的飛躍。在這個充滿信息的時代，線上書屋也變成啦重要的組成部分。由于每一種圖書的作者、說明、編著等信息皆不相同，并且隨時都需要被修改，如果只需要人工處理這些信息，將會需要消耗大量的時間。本文為了構(gòu)建一種便捷且減輕圖書管理者工作量的系統(tǒng)，線上書屋系統(tǒng)由此而生。國內(nèi)外線上書屋的發(fā)展現(xiàn)狀國外的線上書屋起步早，應(yīng)用的范圍也極其廣泛，而且根據(jù)數(shù)據(jù)統(tǒng)計，在1998年，國外的線上書屋就已經(jīng)是上千家了。在全球最大的線上書屋就出現(xiàn)在國外，是1994年在西雅圖成立的亞馬遜線上書屋，1998年的時候，亞馬遜線上書屋的顧客總數(shù)就已經(jīng)達到450萬，銷售額也已經(jīng)達到了6.1億美元，股票的市值更是越來越多[3]，這僅僅是美國線上書屋的發(fā)展，然而，英國和德國的線上書屋也在逐年增多。我國的線上書屋起步較晚，發(fā)展的數(shù)量較國外相比少之又少，由此看來，國內(nèi)線上書屋的發(fā)展是指日可待的。1、線上書屋面臨的困境線上書屋的發(fā)展前景雖然廣闊，但是也會出現(xiàn)一些困擾。如，訪問的人數(shù)較少，或者訪問的人數(shù)多啦，但是成交數(shù)量有限，營銷平淡，同時對于在頁面上展示的廣告，大多數(shù)的商家都不贊同。2、線上書屋的意義在中國，線上書屋既有發(fā)展的必要，也有發(fā)展的基礎(chǔ)。線上書屋的發(fā)展既方便了消費者又方便了讀者，如：讀者可以很輕松的找到自己喜愛的書籍，不需要再盲目的奔波各種書屋去尋找。線上書屋的經(jīng)營也不需要時間和空間的限制，隨時隨地的與消費者進行交流，還大大的降低了成本。（二）課題研究的背景及意義跟著計算機網(wǎng)絡(luò)和計算機技術(shù)的飛速發(fā)展和應(yīng)用范圍的擴充，越來越多的人選擇在線上閱讀書籍。線上書屋是一個基于Internet的線上圖書程序。用戶可以通過輸入用戶名與密碼登錄系統(tǒng)，瀏覽系統(tǒng)中的圖書信息。可以將線上書屋中引人注目的圖書加入到收藏中心中，方便下次查看，現(xiàn)在越來越多的人熱衷于線上閱讀。（三）課題研究所應(yīng)用的原理與理論依據(jù)本篇論文主要負責(zé)實現(xiàn)用戶登錄、圖書的多種條件查詢和模糊查詢、添加圖書與圖書信息、收藏架、在線閱讀，個人信息管理，反饋意見等功能。主要實現(xiàn)的界面有首頁即書城界面、圖書的新書上架、圖書分類、排行榜和推薦圖書界面以及用戶設(shè)置功能界面。而且線上書屋系統(tǒng)在構(gòu)建功能方面具有穩(wěn)定性和可靠性。二、關(guān)鍵技術(shù)介紹（一）HTML介紹HTML是用來描述網(wǎng)頁的一種標(biāo)記性語言，它是由不同的元素組成的，對于標(biāo)記語言簡單的來說它就是一套標(biāo)記標(biāo)簽，他可以運用標(biāo)記標(biāo)簽來描述網(wǎng)頁的信息。HTML語言編寫及其簡便，他都是由一些標(biāo)簽組成的，沒有那些復(fù)雜的語法，而且它還可以跨平臺，還可以使用在廣泛的平臺上[4]。（二）路由的介紹在web開發(fā)過程中，路由主要是指根據(jù)URL跳轉(zhuǎn)到不同的頁面之間的一種路徑，它分為兩種路由，一個是前端路由，另一個是后端路由，而前端路由是不需要與服務(wù)器相互交互的，因此不存在網(wǎng)絡(luò)延遲的問題，而后端路由則需要與服務(wù)器相交互，因為后端路由在訪問新頁面的過程中，需要向服務(wù)器發(fā)送一個請求，才可以訪問成功，所以后端路由存在網(wǎng)絡(luò)延遲的問題[4]。（三）Express的介紹Express是一個簡潔而靈活的node.jsWeb應(yīng)用框架,提供了一系列強大特性幫助你創(chuàng)建各種Web應(yīng)用，和豐富的HTTP工具。使用Express可以快速地搭建一個完整功能的網(wǎng)站。三、系統(tǒng)的開發(fā)目標(biāo)1、為用戶提供圖書瀏覽；2、用戶可以根據(jù)多種方式查詢自己喜愛的圖書；3、用戶可以把自己心儀的圖書添加到收藏中心；4、用戶可以對圖書進行評論。此系統(tǒng)設(shè)計能夠?qū)崿F(xiàn)首頁（商品展示頁面）、商品詳細信息頁面、收藏中心頁面、注冊維護個人資料頁面、使用幫助和注銷等功能。四、系統(tǒng)的需求分析（一）功能性需求分析該系統(tǒng)的設(shè)計主要是為了用戶能夠方便快捷的瀏覽書籍，也是為了用戶能夠更加方便迅速的查看圖書，并對圖書進行相應(yīng)的評價。本系統(tǒng)的具體需求如下所示：1.用戶的功能介紹：（1）用戶登錄：用戶根據(jù)系統(tǒng)的提示完成用戶登錄功能。（2）瀏覽圖書：用戶可以瀏覽系統(tǒng)中所具備的圖書，還可以查詢所需要的圖書。（3）收藏圖書：用戶對于自己心儀的圖書，可以加入收藏中心，方便下次閱讀。（4）收藏中心：用戶進入收藏中心界面，可對加入收藏中心的書籍進行移出功能。（5）圖書分類：用戶進入分類模塊，可以欣賞到根據(jù)不同種類分享的書籍。（7）在線閱讀圖書：用戶可以隨時在線閱讀自己喜愛的書籍。（8）圖書更新：對于上新的圖書，用戶可第一時間查看圖書發(fā)布的新消息。（二）經(jīng)濟可行性分析隨著經(jīng)濟的發(fā)展，人們在不斷地擴大對圖書的需求量，所以，圖書的發(fā)行量也在不斷的擴充。在大城市里，普通的書店隨著人們對圖書的需求也在不斷的增多，各種各樣的書店都發(fā)展了起來。相對而言，書店的規(guī)模也在不斷地擴充著，比如北京圖書大廈、北京海淀圖書城等等。除了這些國有的，國外的也在不斷的介入，比如貝塔斯曼[6]。由此看來，正因為有了這些情形的出現(xiàn)，線上書屋的發(fā)展也會將競爭變得更加的激烈，正因為如此線上書屋的優(yōu)勢才得以體現(xiàn)。（三）技術(shù)可行性分析線上書屋可實現(xiàn)用戶訪問并查找書籍信息，客戶還可以對于自己喜歡的書籍加入收藏中心并可在線閱讀，還可以做出相應(yīng)的評價。隨著圖書的不斷更新，用戶還可以查看圖書發(fā)布的新消息。該系統(tǒng)將使用現(xiàn)代流行的技術(shù)去實現(xiàn)每一項的功能，成熟且方便運用，因此該系統(tǒng)在技術(shù)方面是可行的。（四）系統(tǒng)安全性分析針對本系統(tǒng)存在的安全問題，此次設(shè)計做了充足的準備工作：第一，用戶所輸入的用戶名與密碼必須與系統(tǒng)中預(yù)留的用戶名與密碼一致，才可進入本系統(tǒng)。第二，在登陸過成中，用戶還需要輸入正確的驗證碼，如果用戶輸入的驗證碼與系統(tǒng)中的不一致，就不可以進入本系統(tǒng)。第三：用戶所輸入的用戶名、密碼和驗證碼全部正確，才可以進入到該系統(tǒng)，進行相關(guān)的操作。（五）市場的可行性分析通過調(diào)查研究發(fā)現(xiàn)，對于現(xiàn)在而言網(wǎng)絡(luò)上存在的這種系統(tǒng)有很多，但是對于成型的系統(tǒng)，他們所具備的功能并不完善，由此看來，線上書屋系統(tǒng)的開發(fā)空間和開發(fā)價值超級大，從而來彌補市場上的大面積空白[7]。并且對于我國的圖書管理的發(fā)展由他來激勵。正在此時，線上書屋還可以彌補圖書館所達不到的效果，例如：線上書屋系統(tǒng)可以源源不斷地引入新鮮的知識和加快技術(shù)的傳播與共享等等。由此看來，線上書屋有著一片美麗的反展前景。（六）數(shù)據(jù)的來源性分析該系統(tǒng)的數(shù)據(jù)主要來源于一個簡潔而靈活的node.jsWeb應(yīng)用框架-Express，它可以提供一組強大的功能給Web和移動應(yīng)用程序。在使用過程中選擇的各種HTTP實用工具和中間件，可以快速方便地創(chuàng)建強大的API，還提供精簡的基本W(wǎng)eb應(yīng)用程序功能，而不會隱藏您了解和青睞的Node.js功能，因此許多流行的開發(fā)框架都基于Express構(gòu)建[5]。五、系統(tǒng)的設(shè)計（一）系統(tǒng)功能模塊設(shè)計根據(jù)系統(tǒng)的需求分析，確定本系統(tǒng)主要有以下模塊。如圖1系統(tǒng)功能結(jié)構(gòu)所示。圖1系統(tǒng)功能結(jié)構(gòu)（二）系統(tǒng)的整體功能模塊設(shè)計1.登錄模塊系統(tǒng)進入登陸界面，用戶根據(jù)表單信息提示輸入用戶名、密碼與驗證碼，輸入完成后用戶點擊登錄按鈕完成登錄，進入本系統(tǒng)。在登陸過程中，如果用戶在輸入用戶名、密碼和驗證碼時與本系統(tǒng)中存儲的用戶名、密碼、驗證碼不一致，則系統(tǒng)會提示“請重新輸入”，如果用戶在輸入過程中，用戶名、密碼和驗證碼有一項輸入的內(nèi)容為空，系統(tǒng)則會提示，“不能為空”。用戶在輸入驗證碼的過程中，如果驗證碼不清晰，用戶可以切換驗證碼，直到驗證碼在界面中的顯示是清晰的，用戶所輸入的驗證碼與切換的驗證碼是統(tǒng)一的之后，點擊登錄按鈕，便可成功的進入本系統(tǒng)。如圖2所示。圖2登錄界面其核心代碼如下：圖書展示模塊用戶登陸成功進入該系統(tǒng)后，會看到以書城命名的圖書展示界面，界面上方有導(dǎo)航鍵，分別是推薦、女生、男生、圖書（新），用戶可以點擊這幾個導(dǎo)航鍵，進入到以點擊的頁面中，當(dāng)進入該系統(tǒng)時書城界面中展示的就是此系統(tǒng)推薦給用戶的圖書推薦頁面。用戶點擊女生導(dǎo)航鍵，則展示的就是此系統(tǒng)推薦給用戶適合女生閱讀的一些書籍，首先展示的是以四張圖書封面為背景的輪播圖，其次就是主編位用戶推薦的帶有人氣的一些書籍，還有未用戶推薦的評分為九分以上的書籍，即“九分神作”模塊，還有為用戶推薦的已完結(jié)的圖書，即“完結(jié)優(yōu)選”模塊，還有系統(tǒng)為用戶推薦的在本期的作品中的美文，即“本期佳作”模塊，最后是為用戶推薦的用戶會喜歡的圖書，即“猜你喜歡”模塊，這便是書城界面中導(dǎo)航鍵是女生的頁面展示。而男生頁面與女生的幾乎相同，唯一不同的就是，系統(tǒng)推薦的是適合男生閱讀的書籍?！皥D書（新）”模塊就是圖書上新模塊，會在圖書上新模塊中為大家介紹。展示效果如圖3所示。圖3圖書書城展示其核心代碼如下：3.圖書上新模塊用戶還是停留在書城界面中，用戶點擊上方的“圖書（新）”導(dǎo)航鍵，便會進入圖書上新模塊，再此模塊中，首先映入眼簾的是以四張圖書封面為背景的輪播圖，下面便是此系統(tǒng)為用戶推薦的精選之作，即“新時代精選”，再往下就是新上架的“文學(xué)之作”，接下來還有新上架的好書，以及一些經(jīng)典名著，最后一個模塊展示的便是大多數(shù)用戶都會喜歡的一些圖書。如圖4所示圖4圖書上新其核心代碼如下：4.圖書分類模塊用戶點擊分類，便會進入到圖書分類模塊，圖書分類模塊還是會按照女生，男生，圖書三個標(biāo)簽頁進行展示圖書不同的分類方式，標(biāo)簽頁的下方會有五個不同的按鈕，分別是熱門、題材、情節(jié)、角色和風(fēng)格，用戶點擊不同的按鈕，系統(tǒng)便會跳轉(zhuǎn)到以以點擊的按鈕的圖書分類方式。比如，用戶點擊題材按鈕，則就會跳到按題材分類的一些關(guān)鍵詞，為用戶帶來方便。由于界面的設(shè)計過于太長，用戶在使用過程中用起來不方便，系統(tǒng)還為用戶設(shè)計了一個返回頂部的按鈕，如果用戶想回到頂部，用戶就可以直接點擊右下角的向上的箭頭圖標(biāo)，系統(tǒng)就會識別直接跳轉(zhuǎn)到界面的頂部。而圖書的標(biāo)簽頁與女生，男生的標(biāo)簽頁的頁面設(shè)計不相同，圖書頁面展示的書籍分類是按照全部分類進行劃分的，而其余兩個是按照小模塊劃分的，這樣的設(shè)計會給用戶帶來多種選擇的方式，為用戶帶來便捷。如圖5所示。圖5系統(tǒng)功能結(jié)構(gòu)其核心代碼如下：5.收藏中心模塊用戶如果想查看已加入收藏中心的圖書或者已收藏的圖書，點擊書架按鈕，即收藏中新界面，進入界面后，便可查看用戶所加入的圖書，圖書的信息，圖書的數(shù)量。如果用戶想繼續(xù)選擇其他的圖書，點擊界面底部的以加號為封面的按鈕便會直接跳轉(zhuǎn)到書城界面，繼續(xù)選擇心儀的圖書。若用戶對于已經(jīng)加入收藏中心的圖書堿性管理，用戶可以點擊刪除按鈕，選中不喜歡的書籍，刪除即可。如果收藏中心內(nèi)沒有選中的圖書，那么收藏中心會顯示當(dāng)前收藏中心內(nèi)還沒有您喜歡的圖書哦。6.在線閱讀模塊用戶進入某一圖書信息詳情頁，點擊在線閱讀，便可瀏覽全書。如果該圖書是客戶心儀的，還可以加入收藏中心，方便下次閱讀。7.個人中心模塊用戶點擊我的，便會進入個人中心界面，界面上方展示的是頭像與用戶名，中間展示的是本系統(tǒng)的logo，下面就是留言板模塊、幫助與反饋和設(shè)置模塊。留言板模塊將會在下方進行仔細介紹，幫助與反饋模塊主要就是用戶在使用過程中如果對該系統(tǒng)有什么不了解的可以在這一模塊中尋求幫助。設(shè)置模塊中主要就是對該系統(tǒng)進行的一些設(shè)置，可以設(shè)置屏幕關(guān)閉的時間，在閱讀過程中進行音量鍵翻頁，點擊屏幕左側(cè)翻看下一頁，也可以進行全屏顯示內(nèi)容。如圖8所示。圖8個人中心8.留言板模塊用戶停留在我的界面，界面上顯示我的留言板欄目名稱，點擊就將進入到我的留言板界面，在留言板頁面中用戶可以輸入昵稱、E-mail、內(nèi)容、和主題，如果用戶想要推薦圖書，則可以選擇推薦圖書主題，如果用戶想要提出其他問題，用戶可以選擇其他問題主題，最后點擊發(fā)表提交，系統(tǒng)就會提示用戶提交成功。如圖9所示。圖9我的留言板其核心代碼如下：基本資料管理模塊用戶在我的界面中，點擊設(shè)置欄目，在設(shè)置頁面中點擊基本資料，系統(tǒng)將會進入到該頁面，在該頁面將會出現(xiàn)用戶的一些個人信息，用戶點擊修改按鈕，將會修改個人信息，修改后的個人信息將會更新到該頁面。（三）界面設(shè)計本系統(tǒng)界面樣式的設(shè)計主要運用了CSS這一編程語言，整個系統(tǒng)的設(shè)計模式是統(tǒng)一的布局，每一個頁面幾乎都由三部分構(gòu)成：頁面的頂部是標(biāo)題部分，中間是展示部分，底部便是導(dǎo)航部分。其中，該系統(tǒng)的首頁是整個平臺的展示窗口，其內(nèi)容主要包括書架，即收藏中心，書城、分類和個人中心頁面[8]。同時，點擊搜索按鈕還可以輸入關(guān)鍵字搜索系統(tǒng)中提供的圖書、查看分類的圖書和熱銷的圖書等。（四）數(shù)據(jù)設(shè)計該系統(tǒng)的部分數(shù)據(jù)如下所示：六、系統(tǒng)的預(yù)計測試功能軟件測試的概念軟件測試主要是測試人員通過手工或者工具對需要測試的內(nèi)容驚醒相應(yīng)的測試操作，以此來驗證實際內(nèi)容是否與預(yù)期的結(jié)果相匹配。軟件測試的作用主要是發(fā)現(xiàn)并修復(fù)系統(tǒng)或者軟件所出現(xiàn)的錯誤，從而提高用戶的使用信度。還可以記錄系統(tǒng)在運行過程中所展示的一些數(shù)據(jù)，以此來為決策提供有力的數(shù)據(jù)支持；除此之外，還可以降低相同類型的產(chǎn)品在開發(fā)過程中所遇到的問題的風(fēng)險。軟件測試工程主要是要求軟件在交付給用戶之前對軟件進行全面的嚴格的測試，盡量發(fā)現(xiàn)軟件中存在的錯誤，用來確保軟件使用的質(zhì)量[9]。用戶登錄界面的測試1.確保用戶在輸入用戶名、密碼和驗證碼輸入有誤時，相應(yīng)的報錯信息顯示，并要求用戶重新輸入。2.確保當(dāng)上面的所輸入的參數(shù)都正確時，用戶進入書城界面。3.若有任何一個為空時，在提交的同時，產(chǎn)生驗證，提示用戶輸入不能為空。收藏圖書時數(shù)量修改的測試1.確保默認收藏圖書的數(shù)量為1。2.當(dāng)用戶輸入的數(shù)量超出1時，提示用戶，“該書已收藏”。當(dāng)用戶輸入的數(shù)不為數(shù)字、或小于1時，提示出錯信息。3.確保所提交的數(shù)據(jù)在數(shù)據(jù)表中產(chǎn)生相應(yīng)的更新，書目表中的庫存數(shù)量，會隨著用戶收藏、修改、取消產(chǎn)生對應(yīng)的變化。整個系統(tǒng)的測試主頁：檢測頁面是否正常顯示，輸入、輸出功能是否一致。用戶登錄：檢測用戶輸入的用戶名與密碼是否與系統(tǒng)中錄入的信息一致。收藏中心：檢測收藏中心的放入、清空和取消收藏的輸入與輸出的功能，是否會造成差別。圖書查找：輸入圖書的信息是否能夠查找到搜索的書籍。用戶留言：檢測用戶可否在留言板留言。圖書管理：檢測用戶是否可以根據(jù)分類查看不同的書籍信息。用戶管理：檢測用戶對用戶資料的新建、刪除和修改是否與輸入、輸出功能一致。在線閱讀管理：檢測用戶是否可以瀏覽全書。七、總結(jié)隨著時代發(fā)展的進步，線上書屋也逐漸的流行起來。線上書屋系統(tǒng)不僅是一種引領(lǐng)圖書系統(tǒng)行業(yè)的楷模，還在功能配置上，可以產(chǎn)生積極的效果。再本次的設(shè)計中，用戶可以全面的瀏覽系統(tǒng)中存在的書籍，還可以在線閱讀書籍，還能夠瀏覽留言和評