基于Python+Flask+MySQL的知寶問(wèn)答系統(tǒng)

范路橋，段班祥，高 潔，劉小強(qiáng)

（廣東科學(xué)技術(shù)職業(yè)學(xué)院計(jì)算機(jī)工程技術(shù)學(xué)院，廣州 510640）

0 引言

近年來(lái)，以Internet 為核心的網(wǎng)絡(luò)技術(shù)和通信技術(shù)得到了飛速的發(fā)展和廣泛的應(yīng)用，隨著廣大網(wǎng)民對(duì)知識(shí)的獲取需要和主動(dòng)學(xué)習(xí)意愿增強(qiáng)，傳統(tǒng)的信息資源的獲取及服務(wù)方式已無(wú)法滿足人們?nèi)找鏀U(kuò)大化和多元化的信息需求。多元化的網(wǎng)絡(luò)傳播媒介豐富了人們獲取信息的來(lái)源，各種網(wǎng)絡(luò)交流與互動(dòng)工具應(yīng)運(yùn)而生［1］，知識(shí)社區(qū)問(wèn)答新興網(wǎng)絡(luò)平臺(tái)快速發(fā)展，特別是知識(shí)社區(qū)深受網(wǎng)民歡迎［2］。

利用HTML、CSS、JavaScript 搭建展示頁(yè)面和處理前端請(qǐng)求，通過(guò)Bootstrap響應(yīng)式布局，使用MySQL 存取系統(tǒng)數(shù)據(jù)，結(jié)合Flask 編寫后端業(yè)務(wù)邏輯并對(duì)MySQL 數(shù)據(jù)庫(kù)中的數(shù)據(jù)做出相應(yīng)操作［3］，設(shè)計(jì)和開(kāi)發(fā)了一個(gè)集網(wǎng)絡(luò)社區(qū)、普及百科、資訊平臺(tái)于一體的知識(shí)社區(qū)平臺(tái)，滿足了網(wǎng)民獲取知識(shí)、展示自我、掌握資訊的需求［4］。

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

1.1 系統(tǒng)總體目標(biāo)

（1）本項(xiàng)目為知寶問(wèn)答系統(tǒng)，分為知寶百科、知寶問(wèn)答和最新資訊三個(gè)板塊。

（2）知寶百科板塊是對(duì)技術(shù)、事件、事物等各種百科詞條知識(shí)的普及記載。

（3）知寶問(wèn)答板塊向社區(qū)全員展示，每個(gè)人都可以在其中提出自己的疑問(wèn)、分享自己的觀點(diǎn)。

（4）最新資訊板塊是全球突發(fā)事件、全球疫情、全球股市、全球軍事、全球科技的7*24 小時(shí)內(nèi)的最新消息。

知寶問(wèn)答系統(tǒng)的系統(tǒng)功能如圖1所示。

圖1 系統(tǒng)功能圖

1.2 系統(tǒng)功能需求

本系統(tǒng)為知寶問(wèn)答系統(tǒng)，主要為用戶網(wǎng)絡(luò)交流、知識(shí)交互、知識(shí)獲取、資訊掌握功能。根據(jù)這些需求，要設(shè)計(jì)出頁(yè)面美觀而且操作良好的系統(tǒng)，并且需要對(duì)數(shù)據(jù)庫(kù)的設(shè)計(jì)進(jìn)行優(yōu)化，此外Flask后端需要提高穩(wěn)定性和運(yùn)行速度。

（1）用戶注冊(cè)賬號(hào)，并在登錄后才能使用本系統(tǒng)。

（2）用戶登錄后將跳轉(zhuǎn)到首頁(yè)，首頁(yè)是系統(tǒng)的展示以及介紹，并提供退出登錄功能。

（3）知寶百科

“知寶百科”首頁(yè)隨機(jī)展示六個(gè)百科詞條，每個(gè)百科詞條都可通過(guò)用戶點(diǎn)擊詳情供用戶查閱。用戶可點(diǎn)擊按鈕，更換主頁(yè)展示的百科詞條。用戶編輯的詞條通過(guò)審核后，可上傳到社區(qū)。

（4）知寶問(wèn)答

“知寶問(wèn)答”首頁(yè)展示社區(qū)用戶的提問(wèn)，以及對(duì)應(yīng)的其他用戶的觀點(diǎn)分享與解答。每個(gè)用戶都可提問(wèn)或分享自己的觀點(diǎn)。用戶可以查詢問(wèn)題，找到與自己相符合的疑問(wèn)內(nèi)容。用戶可以收藏問(wèn)答，并且在用戶主頁(yè)中找到自己收藏的問(wèn)答。

（5）最新資訊

“最新資訊”的首頁(yè)默認(rèn)展示全球突發(fā)事件，用戶可以切換其他模塊：全球疫情、全球股市、全球軍事、全球科技。用戶也可以在每個(gè)資訊下分享自己的觀點(diǎn)，與他人交流。

（6）我的主頁(yè)

“我的主頁(yè)”頁(yè)面展示用戶個(gè)人提出的問(wèn)題以及用戶收藏的問(wèn)答。

知寶問(wèn)答系統(tǒng)架構(gòu)圖如圖2所示。

圖2 系統(tǒng)架構(gòu)圖

2 數(shù)據(jù)表設(shè)計(jì)

本系統(tǒng)有三大板塊，需要大量的數(shù)據(jù)支撐，數(shù)據(jù)量多，業(yè)務(wù)關(guān)系也比較復(fù)雜，這要求數(shù)據(jù)存儲(chǔ)方面及數(shù)據(jù)管理系統(tǒng)有良好的設(shè)計(jì)。系統(tǒng)共設(shè)計(jì)了用戶表、百科表、問(wèn)題表、問(wèn)答答案表、資訊表、用戶評(píng)論表、收藏表共七個(gè)數(shù)據(jù)表。為節(jié)省篇幅，給出前兩個(gè)數(shù)據(jù)表的具體設(shè)計(jì)，見(jiàn)表1和表2。

表1 用戶表（user）

表2 百科表（baike）

3 系統(tǒng)實(shí)現(xiàn)

本系統(tǒng)基于B/S架構(gòu)構(gòu)建，借助Python中的Request、Scrapy等庫(kù)完成數(shù)據(jù)的采集工作，并使用Pandas程序庫(kù)進(jìn)行數(shù)據(jù)的分析和計(jì)算工作，處理以后的數(shù)據(jù)被推送至MySQL數(shù)據(jù)庫(kù)中。后臺(tái)采用Flask 框架實(shí)現(xiàn)數(shù)據(jù)接口功能，并將MySQL 數(shù)據(jù)庫(kù)中數(shù)據(jù)推送至前端頁(yè)面。前端主要采用HTML、JavaScript、CSS 相結(jié)合，用戶登錄后可以點(diǎn)擊各個(gè)模塊使用，每個(gè)環(huán)節(jié)通過(guò)Flask 與MySQL進(jìn)行交互［5］，并可在前端展示數(shù)據(jù)。

3.1 首頁(yè)與注冊(cè)登錄模塊實(shí)現(xiàn)

用戶在使用本系統(tǒng)前，要求先登錄首頁(yè)。系統(tǒng)除首頁(yè)外的每個(gè)頁(yè)面都使用裝飾器添加了“判斷用戶是否已經(jīng)登錄”的功能，如果用戶未登錄，會(huì)被強(qiáng)制重定向到注冊(cè)登錄頁(yè)面。

3.1.1 首頁(yè)實(shí)現(xiàn)

首頁(yè)涉及文件index.html和main.py。系統(tǒng)首頁(yè)為index.html。當(dāng)用戶未登錄時(shí)，會(huì)顯示“登錄/注冊(cè)”按鈕。當(dāng)用戶登錄后，顯示“歡迎您：xxx”與“注銷”按鈕。利用后端Flask增加用戶的Cookie 和Session 實(shí)現(xiàn)。用戶未登錄時(shí)及用戶未登錄后的具體效果圖如圖3、圖4所示。

圖3 用戶未登錄時(shí)的首頁(yè)

圖4 用戶登錄后的首頁(yè)

判斷用戶能否正常登錄的核心代碼如下。

3.1.2 注冊(cè)頁(yè)面實(shí)現(xiàn)

注冊(cè)頁(yè)面涉及文件：regist.html 和main.py。注冊(cè)頁(yè)面為regist.html，該模板文件采用了Java-Script 和CSS 進(jìn)行頁(yè)面的特效制作，會(huì)自動(dòng)跟隨鼠標(biāo)移動(dòng)，展示星星連線特效（如圖5輸入框左側(cè)的星星連線）。用戶如果已經(jīng)擁有賬號(hào)，也可點(diǎn)擊“已有賬號(hào)”按鈕，直接跳轉(zhuǎn)到登錄頁(yè)面。注冊(cè)頁(yè)面效果如圖5所示。

圖5 注冊(cè)頁(yè)面

用戶輸入手機(jī)號(hào)碼、用戶名、密碼，點(diǎn)擊“注冊(cè)”按鈕后，會(huì)跳轉(zhuǎn)到后端main.py 中的視圖函數(shù)regist。視圖函數(shù)會(huì)判斷手機(jī)號(hào)是否已經(jīng)被注冊(cè)以及兩次輸入的密碼是否相同。如果判斷失敗，則會(huì)不通過(guò)注冊(cè)；如果判斷成功，則將信息寫入數(shù)據(jù)庫(kù)中，并跳轉(zhuǎn)到登錄頁(yè)面。注冊(cè)頁(yè)面的核心代碼如下。

3.1.3 登錄頁(yè)面實(shí)現(xiàn)

登錄頁(yè)面涉及文件login.html、error.html、main.py。其中登錄頁(yè)面為login.html，登錄頁(yè)面效果如圖6所示。用戶輸入賬號(hào)和密碼，點(diǎn)擊“登錄”按鈕后，會(huì)跳轉(zhuǎn)到后端main.py 中的視圖函數(shù)login中，視圖函數(shù)中會(huì)連接數(shù)據(jù)庫(kù)判斷用戶輸入的賬號(hào)和密碼是否正確。如果正確，則跳轉(zhuǎn)到首頁(yè)；否則跳轉(zhuǎn)到登錄失敗頁(yè)面error.html。登錄頁(yè)面的核心代碼如下。

圖6 登錄頁(yè)面

登錄失敗頁(yè)面為error.html，如果用戶輸入的賬號(hào)或密碼錯(cuò)誤，將跳轉(zhuǎn)到登錄失敗頁(yè)面。主要是使用JavaScript 制作頁(yè)面彈窗，登錄失敗彈窗如圖7所示。

圖7 登錄失敗彈窗

3.1.4 注銷功能實(shí)現(xiàn)

注銷功能涉及文件main.py。當(dāng)用戶登錄后，在首頁(yè)中點(diǎn)擊“注銷”按鈕時(shí)，用戶退出登錄，并重新跳轉(zhuǎn)到登錄頁(yè)面。用戶點(diǎn)擊“注銷”按鈕后，將跳轉(zhuǎn)到main.py 中的logout 函數(shù)，該函數(shù)將此用戶的cookie 和session 刪除，然后重定向到登錄頁(yè)面。注銷功能的核心代碼如下。

3.2 知寶百科模塊實(shí)現(xiàn)

3.2.1 知寶百科首頁(yè)

知寶百科首頁(yè)涉及文件baike.html。完成展示模塊介紹信息，顯示“用戶自己編輯百科”按鈕，以及提供導(dǎo)航欄使得可跳轉(zhuǎn)到其他頁(yè)面。知寶百科首頁(yè)如圖8所示。

圖8 知寶百科首頁(yè)

3.2.2 百科概要數(shù)據(jù)展示區(qū)域

百科概要數(shù)據(jù)展示涉及文件baike.html 和main.py。主要完成展示簡(jiǎn)要的百科數(shù)據(jù)，供用戶瀏覽并且可以點(diǎn)擊查看詳細(xì)的百科內(nèi)容，用戶想換一批百科內(nèi)容時(shí)可點(diǎn)擊“換一批”按鈕。具體效果如圖9所示。

圖9 知寶百科展示頁(yè)面

當(dāng)用戶需要查看百科概要數(shù)據(jù)時(shí)，將跳轉(zhuǎn)到main.py 中的百科函數(shù)。該函數(shù)將使用隨機(jī)數(shù)充當(dāng)百科id，從數(shù)據(jù)庫(kù)中隨機(jī)讀取6 個(gè)百科數(shù)據(jù)，傳遞到前端將數(shù)據(jù)展示。百科概要數(shù)據(jù)展示的核心代碼如下所示。

3.3 知寶問(wèn)答模塊實(shí)現(xiàn)

3.3.1 導(dǎo)航欄及封面

導(dǎo)航欄及封面涉及文件wenda.html。完成展示模塊介紹信息，顯示“我也要提問(wèn)”按鈕，以及提供導(dǎo)航欄使得可以跳轉(zhuǎn)到其他頁(yè)面。效果如圖10所示。

圖10 知寶問(wèn)答首頁(yè)

3.3.2 問(wèn)題概要數(shù)據(jù)展示區(qū)域

問(wèn)題概要數(shù)據(jù)展示涉及文件wenda.html 和main.py。主要完成展示簡(jiǎn)要的問(wèn)題數(shù)據(jù)，供用戶瀏覽，并且可以點(diǎn)擊查看詳細(xì)的問(wèn)答內(nèi)容，用戶還可以輸入內(nèi)容后點(diǎn)擊“查找”按鈕，查詢自己關(guān)心的話題。效果如圖11所示，核心代碼如下。

圖11 知寶問(wèn)答展示頁(yè)面

3.3.3 詳細(xì)問(wèn)答展示

詳細(xì)問(wèn)答展示涉及文件wendadesc.html 和main.py。當(dāng)用戶點(diǎn)擊某個(gè)問(wèn)題希望瀏覽其具體觀點(diǎn)時(shí)，展示詳細(xì)數(shù)據(jù)供用戶閱讀。用戶可對(duì)這個(gè)問(wèn)題發(fā)表自己的觀點(diǎn)、收藏此問(wèn)答。效果如圖12所示，詳細(xì)問(wèn)答展示的核心代碼如下。

圖12 知寶問(wèn)答詳情展示頁(yè)面

3.3.4 用戶新增回答

圖13 用戶新增回答頁(yè)面

用戶點(diǎn)擊“立即回答”按鈕后，F(xiàn)lask的addAnswer 函數(shù)將收集用戶信息、問(wèn)題信息、用戶的回答內(nèi)容及回答時(shí)間并保存到數(shù)據(jù)庫(kù)中，用戶新增回答的核心代碼如下所示。

3.4 最新資訊模塊實(shí)現(xiàn)

3.4.1 導(dǎo)航欄及封面

導(dǎo)航欄及封面涉及文件zixun.html。完成展示模塊介紹信息、顯示歡迎信息以及退出登錄按鈕，并且提供導(dǎo)航欄使得可以跳轉(zhuǎn)到其他頁(yè)面。最新資訊首頁(yè)的效果如圖14所示。

圖14 最新資訊首頁(yè)

3.4.2 資訊概要數(shù)據(jù)展示區(qū)域

資訊概要數(shù)據(jù)展示涉及文件zixun.html 和main.py。展示簡(jiǎn)要的資訊數(shù)據(jù)，供用戶瀏覽并且可點(diǎn)擊查看詳細(xì)的資訊內(nèi)容。分為五個(gè)模塊：國(guó)際、疫情、宏觀、股市、科技。后端會(huì)根據(jù)用戶點(diǎn)擊不同的模塊，從數(shù)據(jù)庫(kù)中讀取不同模塊的資訊數(shù)據(jù)進(jìn)行展示。股市最新資訊展示頁(yè)面的具體效果如圖15所示，其它數(shù)據(jù)展示頁(yè)面類似。

圖15 股市最新資訊展示頁(yè)面

由于版面限制，其它頁(yè)面及代碼沒(méi)有詳細(xì)介紹。

4 結(jié)語(yǔ)

本文采用HTML、CSS、JavaScript 搭建展示頁(yè)面和處理前端請(qǐng)求，通過(guò)Bootstrap 響應(yīng)式布局，使用MySQL 存取系統(tǒng)數(shù)據(jù)，結(jié)合Flask 編寫后端業(yè)務(wù)邏輯并對(duì)MySQL 數(shù)據(jù)庫(kù)中的數(shù)據(jù)做出相應(yīng)操作，設(shè)計(jì)并實(shí)現(xiàn)了一個(gè)集網(wǎng)絡(luò)社區(qū)、普及百科、資訊平臺(tái)為一體的知寶問(wèn)答系統(tǒng)，系統(tǒng)具有知寶百科、知寶問(wèn)答和最新資訊等三個(gè)板塊，其強(qiáng)大的功能、良好的互動(dòng)性、最新的資訊，在很大程度上滿足了廣大網(wǎng)民的展示自我、獲取知識(shí)、掌握最新資訊的迫切需求。