一個電子族譜網(wǎng)站平臺的設(shè)計(jì)與實(shí)現(xiàn)

張雨浩 李權(quán) 柳汛 朱曉君 肖斌

摘要：家風(fēng)文化不僅是中華傳統(tǒng)文化的重要組成部分，更是傳承傳統(tǒng)文化最有力的載體。通過分析市場調(diào)研結(jié)果，建設(shè)一個以中老年用戶為主體，可以在線進(jìn)行族譜修繕、族內(nèi)消息展示的電子族譜網(wǎng)站平臺，具有廣闊的發(fā)展空間。該文基于B/S架構(gòu)，使用HTML、CSS、JavaScript、Java等語言和Bootstrap、jQuery等技術(shù)框架，逐步完成了電子族譜網(wǎng)站平臺的設(shè)計(jì)與實(shí)現(xiàn)。

關(guān)鍵詞：電子族譜;家風(fēng)文化;B/S架構(gòu)

中圖分類號：TP311? ? ? 文獻(xiàn)標(biāo)識碼：A

文章編號：1009-3044（2022）11-0069-03

1 引言

族譜是記載姓氏家族、重要人物及其主要事跡的史籍資料，是記述血緣集團(tuán)世系的載體[1]，反映出社會與文化的祖先崇拜、血緣意識文化與社會組織結(jié)構(gòu)[2]。傳統(tǒng)的紙質(zhì)族譜只能查閱先祖姓名及遷徙情況，記載不了先祖的豐功偉績和先祖對后世的期望，后世也就無法深刻領(lǐng)略家族的家風(fēng)、家訓(xùn)。因此，建立一個集族譜修繕、族內(nèi)動態(tài)展示等功能于一體的電子族譜網(wǎng)站平臺是十分必要的。

本文基于B/S架構(gòu)，使用HTML、CSS、JavaScript、Java等語言和Bootstrap、jQuery等技術(shù)框架設(shè)計(jì)了一款電子家族譜網(wǎng)站平臺，解決了族譜修繕困難的問題。

2 市場需求

通過對筆者在網(wǎng)絡(luò)上發(fā)放的問卷進(jìn)行整理和分析，繪制出了數(shù)據(jù)圖。數(shù)據(jù)顯示，有78%的人可以接受通過網(wǎng)絡(luò)平臺進(jìn)行族譜修繕。有51%的人因沒有合適的平臺而沒有使用電子族譜進(jìn)行族譜修繕。由此可見，建立一個以族譜修繕、族內(nèi)消息展示為主要功能的電子族譜網(wǎng)站平臺具有廣闊的發(fā)展空間。

3 開發(fā)原理

網(wǎng)站基于B/S架構(gòu)，使用HTML、CSS、JavaScript、Java等語言和Bootstrap、jQuery 等技術(shù)框架進(jìn)行開發(fā)。B/S結(jié)構(gòu)的網(wǎng)站設(shè)計(jì)不需要進(jìn)行一系列的邏輯處理和系統(tǒng)界面的展現(xiàn)，可以大大節(jié)約開發(fā)成本，也為管理者后期對網(wǎng)站的維護(hù)和升級提供便捷。HTML是所謂的“超文本標(biāo)記語言”，是一種標(biāo)記語言，而不是一種編程語言[3]。CSS 語言又稱之為層疊樣式表，一般搭配 HTML 進(jìn)行使用，其作用就是用來渲染 HTML框架的樣式，同時也可以為 XML 語言增添樣式的一種語言。CSS 幾乎支持所有的字體樣式，對網(wǎng)頁對象模型和網(wǎng)頁的模型樣式有編輯修改能力[4]。JavaScript 是一種具備動態(tài)類型、弱引用類型、且基于原型的腳本的語言，其內(nèi)部包含各種支持類型[5]。jQuery主要的作用就是使用戶能更方便地處理 HTML、從而簡便地使頁面具備動畫效果[6]。Bootstrap就是一個封裝了大量 HTML和CSS為組件的前端框架[7]。

4 設(shè)計(jì)方案

4.1 總體設(shè)計(jì)

網(wǎng)站的總體設(shè)計(jì)如圖3所示，包含了UI頁面、業(yè)務(wù)層、持久層及數(shù)據(jù)庫的設(shè)計(jì)。UI頁面主要包括注冊登錄頁面、首頁頁面、家族碼生成和獲取頁面、族譜展示頁面、族譜信息錄入頁面。業(yè)務(wù)層主要包括用戶信息校驗(yàn)、家族碼生成和查詢、族譜信息的存儲、家族信息的展示等功能。持久層是與用戶信息和家族信息相關(guān)的一系列增刪改查操作。

4.2 詳細(xì)設(shè)計(jì)

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

通過對網(wǎng)站的功能進(jìn)行分析，設(shè)計(jì)的數(shù)據(jù)庫結(jié)構(gòu)由用戶表和家庭成員表共兩張表組成。用戶表用于存儲用戶的賬號、密碼、姓名、電話等信息，家庭成員表用于存放家族成員的節(jié)點(diǎn)ID、姓名、性別、頭像地址、人物介紹等信息。兩張表的關(guān)聯(lián)是 fid字段，通過fid字段可以將兩張表的信息拼接起來，避免數(shù)據(jù)大量重復(fù)的問題。用戶表和家庭成員表的結(jié)構(gòu)分別如表1、表2所示。

4.2.2 基本功能模塊

電子族譜的基本功能模塊包括用戶模塊、族譜管理模塊、家族碼生成模塊和族譜修繕模塊。各模塊之間相互交融與配合，共同支撐起平臺各項(xiàng)功能。

網(wǎng)站的基本功能模塊主要為用戶模塊和族譜管理模塊。模塊之間的相互配合使族譜網(wǎng)站得以穩(wěn)定運(yùn)行。用戶模塊貫穿整個平臺，主要包括用戶的注冊與登錄，用戶的家族信息等內(nèi)容。族譜管理模塊是平臺功能模塊，主要包括家族碼的生成、家族碼的查詢、族譜修繕、族內(nèi)消息展示等內(nèi)容。

用戶模塊是用戶使用網(wǎng)站的前提，用戶需要先注冊賬號才能使用網(wǎng)站功能。注冊時用戶在前端注冊頁面填寫好注冊信息后提交到服務(wù)器，通過查詢數(shù)據(jù)庫驗(yàn)證用戶ID是否已經(jīng)存在，未存在的用戶ID才可注冊成功。用戶注冊成功后會自動跳轉(zhuǎn)到登錄頁面，用戶輸入對應(yīng)的信息進(jìn)行登錄。登錄時系統(tǒng)會先進(jìn)行表單的驗(yàn)證，判斷用戶輸入的信息是否符合規(guī)范，如果符合規(guī)范去數(shù)據(jù)庫中查詢對應(yīng)的用戶ID進(jìn)行賬戶和密碼的匹配，匹配成功則跳轉(zhuǎn)到首頁，并且將數(shù)據(jù)存入Session中。如果表單校驗(yàn)不成功則在對應(yīng)的輸入框提示錯誤信息。如果輸入的密碼或用戶ID與數(shù)據(jù)庫中的數(shù)據(jù)不匹配，則在表單提示用戶ID或密碼錯誤等信息。注冊頁面如圖4（a） 所示。

家族碼生成模塊是用戶開始族譜創(chuàng)建的基礎(chǔ)，用戶可以通過該模塊獲得對應(yīng)的家族碼。通過家族碼，用戶可以進(jìn)入到對應(yīng)的家族譜系中，并且可以對該譜系進(jìn)行修改。家族碼是用來唯一標(biāo)志族譜的標(biāo)志， 每個家族譜都對應(yīng)著不同的家族碼。用戶在進(jìn)入獲取家族碼的頁面時，請求就會被攔截器所攔截，攔截器會判斷Session中是否存在用戶信息。如果發(fā)現(xiàn)用戶沒有登錄信息，則觸發(fā)轉(zhuǎn)發(fā)請求跳轉(zhuǎn)到登錄頁面，此時要求用戶必須進(jìn)行登錄后才能繼續(xù)后面的操作。根據(jù)存入Session域中的用戶信息，可以判斷用戶是否存在家族碼，如果存在則顯示如圖4（b） 所示的家族碼查詢界面，如果不存在則為用戶創(chuàng)建家族碼并且保存到用戶的信息中。

族譜修繕模塊是電子族譜的功能模塊，族譜修繕板塊主要功能是將用戶輸入的族譜信息存入數(shù)據(jù)庫，同時根據(jù)用戶的信息判斷用戶在家族中的位置，同時展示家族成員對應(yīng)的稱呼。族譜修繕的邏輯如圖5所示。在進(jìn)入族譜修繕板塊之前，操作會被攔截器所攔截，判斷用戶是否處于登錄狀態(tài)，如果處于登錄狀態(tài)，則通過用戶的登錄信息判斷用戶處于哪個族譜內(nèi)。同時展示對應(yīng)的族譜。此時用戶可以對族內(nèi)信息進(jìn)行編輯，用戶編輯后可以將信息存入到數(shù)據(jù)庫中。此時還會根據(jù)用戶的身份信息判斷族譜中存在的成員與用戶之間的關(guān)系，并且展示給用戶，對應(yīng)成員的稱呼。

在族譜修繕界面，用戶可以通過對應(yīng)的成員節(jié)點(diǎn)對成員信息進(jìn)行修改。如圖4（c） 所示，點(diǎn)擊頭像時，系統(tǒng)會查詢數(shù)據(jù)庫中是否有該節(jié)點(diǎn)的信息，如果有則在信息輸入框展示已經(jīng)錄入的成員信息，修改完對應(yīng)的信息后保存到數(shù)據(jù)庫。如對應(yīng)節(jié)點(diǎn)沒有信息，則顯示如圖4（d） 所示的空輸入模板，用戶填寫完成后點(diǎn)擊提交按鈕將節(jié)點(diǎn)信息插入到數(shù)據(jù)庫中。

4.2.3 數(shù)據(jù)傳輸與驗(yàn)證

后臺與前端之間的交互采用的是 Ajax進(jìn)行交互，交互的數(shù)據(jù)形式是 Json格式。用戶產(chǎn)生的所有HTTP請求經(jīng)過參數(shù)驗(yàn)證、用戶身份認(rèn)證等一系列檢查后進(jìn)入業(yè)務(wù)流程，業(yè)務(wù)模型負(fù)責(zé)處理業(yè)務(wù)數(shù)據(jù)并與數(shù)據(jù)庫進(jìn)行交互，并將業(yè)務(wù)處理結(jié)果通過指定的JSON格式返回給終端，實(shí)現(xiàn)客戶端與接口系統(tǒng)的通信[8]。

4.2.4 系統(tǒng)部署與運(yùn)行

電子族譜網(wǎng)站平臺搭載Tomcat 服務(wù)器運(yùn)行，部署于阿里云 ECS 服務(wù)器，用戶通過瀏覽器可以直接訪問到網(wǎng)站部署在的服務(wù)器上[9]。Tomcat 的默認(rèn)端口號是8080，通過 Tomcat 服務(wù)器，電子族譜網(wǎng)站可以正常地運(yùn)行，通過瀏覽器訪問阿里云的地址加上端口號可以直接對網(wǎng)頁進(jìn)行訪問。用戶對網(wǎng)頁操作的數(shù)據(jù)將保存在MySQL數(shù)據(jù)庫中。

5 難點(diǎn)攻堅(jiān)

在項(xiàng)目中，電子族譜網(wǎng)站平臺只考慮了單機(jī)情況下的運(yùn)行結(jié)果，并沒有進(jìn)行壓力測試，不能保證系統(tǒng)在高并發(fā)的情況下還能繼續(xù)運(yùn)行。同時由于用戶基數(shù)少，系統(tǒng)的數(shù)據(jù)庫在設(shè)計(jì)之初沒有設(shè)計(jì)對應(yīng)的索引。沒有考慮用戶基數(shù)大的情況下的訪問速度等。所以后續(xù)需要對數(shù)據(jù)庫進(jìn)行重新設(shè)計(jì)，修改表的結(jié)構(gòu)和表與表之間的關(guān)系。同時還需要添加數(shù)據(jù)庫的索引，保證訪問的快捷性。此外，為了保證系統(tǒng)可以在高并發(fā)的情況下保證正常的運(yùn)行，在簡單的冒煙測試下，必須還得保證每個接口在大數(shù)據(jù)量的情況下可以被訪問。

出于對接口的健壯性考慮，接口除了可以在大數(shù)據(jù)量的情況下進(jìn)行正常的運(yùn)行，還需要防止接口的惡意訪問。必須在可能會出現(xiàn)問題的接口上添加攔截驗(yàn)證，不能讓接口被無限制地訪問。同時為了保證接口調(diào)用數(shù)據(jù)庫時的安全性，需要在接口與數(shù)據(jù)庫之間添加一層緩存層。使用戶不能頻繁地訪問數(shù)據(jù)庫，從而對數(shù)據(jù)庫產(chǎn)生巨大的壓力。為了一個更加穩(wěn)健，更加安全的系統(tǒng)，我們需要不斷地去掌握更新的技術(shù)，不斷地對代碼進(jìn)行優(yōu)化。

6 結(jié)束語

電子家族譜網(wǎng)站平臺的設(shè)計(jì)與開發(fā)項(xiàng)目整體使用B/S模式架構(gòu)，開發(fā)過程主要使用的開發(fā)工具為IntelliJ IDEA。主要用到的技術(shù)有HTML、CSS、JavaScript、Java、Bootstrap、jQuery。開發(fā)更加高效信息化的電子族譜有利于推動中國傳統(tǒng)文化的發(fā)展和傳播，并且對社會學(xué)和經(jīng)濟(jì)學(xué)等方面的研究也有著不可替代的獨(dú)特功能。項(xiàng)目經(jīng)過測試達(dá)到預(yù)期效果，有一定發(fā)展前景，但仍存在許多不足，需不斷地努力完善與維護(hù)。

參考文獻(xiàn)：

[1] 王鶴鳴.中國家譜通論[M].上海：上海古籍出版社，2010：4.

[2] 常建華.中國族譜資料的整理、研究和數(shù)字化建設(shè)[J].安徽大學(xué)學(xué)報(bào)（哲學(xué)社會科學(xué)版），2014，38（1）：95-105.

[3] 夏立新，方志，劉啟強(qiáng).XML在信息組織中的應(yīng)用初探[J].情報(bào)科學(xué)，2006，24（6）：859-863.

[4] 朱杰.淺談電子商務(wù)網(wǎng)站web前端網(wǎng)頁制作[J].商情，2018（15）：161.

[5] 項(xiàng)可旺.基于Django框架的載體管理系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[D].沈陽：東北大學(xué)，2016.

[6] 陳霏.基于Web Service的網(wǎng)頁元素評價(jià)系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[D].上海：復(fù)旦大學(xué)，2012.

[7] 陳樂天.基于HTML5視頻控制技術(shù)的在線學(xué)習(xí)平臺視頻模塊設(shè)計(jì)與實(shí)現(xiàn)[D].天津：天津師范大學(xué)，2017.

[8] 李沛熹，朱曉君，姜建，等.基于微信小程序的校園二手書籍交易平臺設(shè)計(jì)與實(shí)現(xiàn)[J].電腦知識與技術(shù)，2021，17（23）：57-59，67.

[9] 趙紀(jì)偉.基于云平臺的視頻監(jiān)控和存儲系統(tǒng)研究與實(shí)現(xiàn)[D].呼和浩特：內(nèi)蒙古大學(xué)，2017.

收稿日期：2022-02-25

基金項(xiàng)目：江西省高校人文社會科學(xué)研究項(xiàng)目（項(xiàng)目編號：JC20204） ;江西省大學(xué)生創(chuàng)新創(chuàng)業(yè)訓(xùn)練項(xiàng)目（項(xiàng)目編號：S202010407046）

作者簡介：張雨浩（1998—） ，男，河南周口人，本科在讀，研究方向?yàn)檐浖こ?李權(quán)（1989—） ，男，湖北鄂州人，講師，博士，研究方向?yàn)樾畔⒓夹g(shù);柳汛（2001—） ，女，江西贛州人，本科在讀，研究方向?yàn)檐浖こ?朱曉君（1990—） ，女，福建南平人，講師，碩士，研究方向?yàn)殡娮油ㄐ排c工程;肖斌（1981—） ，男，江西吉水人，講師，碩士，研究方向?yàn)檐浖こ獭?/p>