基于SPA技術(shù)的網(wǎng)絡(luò)隨訪系統(tǒng)的設(shè)計與實現(xiàn)

臨床資料的完整性和規(guī)范性是臨床醫(yī)學(xué)科研和教學(xué)工作的重要基礎(chǔ)。一般而言，患者在接受治療或者手術(shù)之后，病情一旦穩(wěn)定就會立即出院休養(yǎng)，等待完全康復(fù)。對于醫(yī)療機(jī)構(gòu)而言，科研和教學(xué)工作相當(dāng)重要，需要進(jìn)一步跟蹤隨訪離院患者的康復(fù)情況，以便對其在院期間的治療方案進(jìn)行結(jié)果跟蹤并作出最終評價[1]。

傳統(tǒng)的隨訪方法是由醫(yī)生根據(jù)患者的診斷、病情、基本健康狀況等特點，制定特定格式的隨訪卡，由負(fù)責(zé)隨訪的專人收集隨訪信息并填寫隨訪卡。紙質(zhì)隨訪卡存在整理困難、容易重復(fù)和出錯、容易遺失、信息難以檢索統(tǒng)計等問題，并且隨著隨訪患者的增多，隨訪信息越來越復(fù)雜。為了適應(yīng)大量臨床數(shù)據(jù)的整理、儲存和分析需要，必須使用信息化的管理方式[2]。

目前主流的電子隨訪系統(tǒng)采用C/S結(jié)構(gòu)，部署在醫(yī)院的內(nèi)部網(wǎng)絡(luò)上，采用RDBMS+J2EE等傳統(tǒng)的企業(yè)級開發(fā)架構(gòu)。這類技術(shù)體系對需求響應(yīng)慢，難以適應(yīng)復(fù)雜的數(shù)據(jù)模型，無法在外部互聯(lián)網(wǎng)訪問。對于隨訪數(shù)據(jù)格式復(fù)雜多變，或者需要隨訪人員隨時隨地錄入隨訪數(shù)據(jù)的情景，該類技術(shù)體系顯然是難以滿足的。對需求和場景進(jìn)行分析后，我們決定使用基于MEVN(MongoDB+Express.js+Vue.js+Node.js)架構(gòu)的單頁面應(yīng)用(Single Page Application，SPA)技術(shù)，并且將隨訪系統(tǒng)部署到云服務(wù)上。相對于傳統(tǒng)的技術(shù)體系，基于MEVN架構(gòu)的SPA技術(shù)具有開發(fā)效率高、適應(yīng)復(fù)雜數(shù)據(jù)模型、并發(fā)性能好、易部署等特點，適合隨訪系統(tǒng)這類數(shù)據(jù)格式復(fù)雜多變，需隨時隨地訪問和錄入數(shù)據(jù)的業(yè)務(wù)系統(tǒng)。

1 技術(shù)簡介

SPA是一種特殊的Web應(yīng)用，它將所有的活動限于單個Web頁面中，僅在該Web頁面初次載入時加載所有必需的資源文件，一旦頁面加載完畢，SPA不會因為用戶的任何操作而進(jìn)行頁面的重新加載或跳轉(zhuǎn)，從而提供非常流暢的用戶體驗[3]。SPA將主要業(yè)務(wù)邏輯封裝在前端頁面中，后臺程序只提供必要的接口，是一種典型的“胖客戶端/瘦服務(wù)端”(Fat Client/Thin Server)，能有效提高用戶交互響應(yīng)速度和減輕服務(wù)器壓力[4]。

MEAN(MongoDB+Express.js+AngularJS+Node.js)架構(gòu)[5]是一種常用的、基于JavaScript的開源全棧SPA開發(fā)架構(gòu)，能創(chuàng)建輕量高效、容易擴(kuò)展和維護(hù)的SPA應(yīng)用。MEVN架構(gòu)是MEAN架構(gòu)的一個變體，將其中的前端框架Angular.js替換是為了更加簡潔直觀的Vue.js。

MEVN架構(gòu)的組成技術(shù)簡介見表1。

表1 MEVN架構(gòu)組成技術(shù)

2 系統(tǒng)設(shè)計與實現(xiàn)

2.1 核心需求及業(yè)務(wù)邏輯

系統(tǒng)需實現(xiàn)以下核心需求。 隨訪數(shù)據(jù)錄入/檢索/導(dǎo)出：隨訪數(shù)據(jù)錄入后，能按照關(guān)鍵字、數(shù)據(jù)值等條件進(jìn)行模糊或精確檢索，并且能導(dǎo)出為表格形式(如Excel)。 歷史隨訪記錄對比：按時間維度記錄患者歷次隨訪數(shù)據(jù)，對比疾病風(fēng)險的變化情況，從而推斷疾病風(fēng)險的關(guān)鍵影響因素。 疾病風(fēng)險量表評估：使用疾病風(fēng)險評估量表對每次隨訪記錄進(jìn)行疾病風(fēng)險評估，觀察疾病風(fēng)險走勢，推斷患者患病風(fēng)險。 提供互聯(lián)網(wǎng)訪問：用戶可隨時隨地在互聯(lián)網(wǎng)上訪問和管理隨訪數(shù)據(jù)。 系統(tǒng)業(yè)務(wù)邏輯如圖1所示。

圖1 網(wǎng)絡(luò)隨訪系統(tǒng)的業(yè)務(wù)邏輯流程

2.2 系統(tǒng)設(shè)計與實現(xiàn)

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

隨訪系統(tǒng)主要包括以下數(shù)據(jù)庫實體。

隨訪表單(Follow-up Form)：定義隨訪記錄的內(nèi)容和格式。

隨訪表單章節(jié)(Follow-up Form Section)：隨訪記錄的章節(jié)。1份隨訪記錄可以包含多個章節(jié)。

隨訪表單字段(Follow-up Form Field)：隨訪記錄字段。1個隨訪記錄的章節(jié)可以包含多個字段。

風(fēng)險評估表單(Assessment Form)：定義風(fēng)險評估表的內(nèi)容和格式。

風(fēng)險評估表單問題(Assessment Form Question)：風(fēng)險評估表的問題。1份風(fēng)險評估表可以包含多個問題。

隨訪結(jié)果(Follow-up Result)：患者隨訪結(jié)果。格式為數(shù)組，包含患者歷次隨訪記錄。

隨訪記錄(Follow-upRecord)：患者單次隨訪記錄。記錄患者單次隨訪的結(jié)果，首次隨訪記錄包含完整的隨訪信息，后續(xù)隨訪記錄僅記錄增量變化。同時，每次隨訪記錄還包含患者該次隨訪的風(fēng)險評估記錄。

風(fēng)險評估記錄(Assessment Record)：患者單次隨訪的風(fēng)險評估記錄。

上述數(shù)據(jù)庫實體中，隨訪表單字段(Follow-up Form Field)的格式較為復(fù)雜，原因主要是需支持單選、多選、文本、段落、數(shù)字、日期等多種格式，每種字段格式的參數(shù)和值的類型都不相同，字段之間存在邏輯規(guī)則關(guān)聯(lián)(如當(dāng)“性別”為男性時，“是否懷孕”只能為否)。常規(guī)的關(guān)系型數(shù)據(jù)庫的字段類型唯一且不可變更，也無法表示數(shù)組或者對象等數(shù)據(jù)結(jié)構(gòu)。如果選用關(guān)系型數(shù)據(jù)庫，至少會有8個數(shù)據(jù)庫表，并且表間存在復(fù)雜的關(guān)聯(lián)關(guān)系。

為了避免上述情況，我們選擇非關(guān)系型數(shù)據(jù)庫MongoDB作為系統(tǒng)數(shù)據(jù)庫。

MongoDB是一種面向文檔(Document-oriented)的數(shù)據(jù)庫，能夠儲存類似JSON格式的對象。在傳統(tǒng)關(guān)系型數(shù)據(jù)庫不能滿足需求、且對數(shù)據(jù)的實時性和一致性要求不高又不需要各種關(guān)聯(lián)查詢的情況下，MongoDB的表現(xiàn)比關(guān)系型數(shù)據(jù)庫更好。在此我們將隨訪表單看作一個復(fù)雜的文檔(Document)，所有的隨訪表單章節(jié)是它的一個數(shù)組成員，每個章節(jié)又有一個字段數(shù)組，包含這個章節(jié)的所有字段。按照這種方式設(shè)計，整個數(shù)據(jù)庫只需要3類文檔：隨訪表單(Follow-up Form)、風(fēng)險評估表單(Assessment Form)、隨訪結(jié)果(Follow-up Result)，其他實體都作為文檔成員出現(xiàn)。具體的數(shù)據(jù)庫設(shè)計見圖2(數(shù)據(jù)庫實體僅列出主要屬性)。僅擁有主鍵的實體才是獨立的文檔。

圖2 網(wǎng)絡(luò)隨訪系統(tǒng)數(shù)據(jù)庫設(shè)計

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

系統(tǒng)劃分為用戶界面層、業(yè)務(wù)接口層和數(shù)據(jù)存儲層3層。

用戶界面層：基于Vue.js進(jìn)行開發(fā)構(gòu)建，將用戶界面拆解為若干獨立的、可復(fù)用的圖層組件。組件已封裝好主要的業(yè)務(wù)邏輯，組件之間使用屬性和事件進(jìn)行通訊。

業(yè)務(wù)接口層：采用Express.js作為Web應(yīng)用服務(wù)器，接收和處理各類HTTP訪問請求，為用戶界面層提供必要的數(shù)據(jù)接口。接口代碼采用Javascript編寫，由Node.js提供的V8 Javascript引擎[9]提供運(yùn)行環(huán)境。

數(shù)據(jù)存儲層：采用MongoDB作為數(shù)據(jù)庫服務(wù)器，存儲各類復(fù)雜的數(shù)據(jù)結(jié)構(gòu)，為業(yè)務(wù)接口層提供數(shù)據(jù)訪問服務(wù)。

系統(tǒng)部署在第三方云服務(wù)上。整體架構(gòu)見圖3。

圖3 網(wǎng)絡(luò)隨訪系統(tǒng)整體架構(gòu)

2.2.3 系統(tǒng)部署

我們選用Heroku作為本文隨訪系統(tǒng)的云服務(wù)提供商。Heroku是一個“平臺即服務(wù)”(Platform as a Service，PaaS)平臺，為開發(fā)人員提供構(gòu)建、運(yùn)行和操作Web應(yīng)用的云服務(wù)環(huán)境[10]。Heroku支持Ruby、Node.js、Python、Java、PHP、Go等幾乎所有市面上主流的Web編程語言。Heroku的部署和配置非常簡潔明了，甚至只需要一行代碼就能完成Web應(yīng)用的部署。

本文隨訪系統(tǒng)的部署步驟如下。

編譯前端工程：將編譯好的SPA模板文件復(fù)制到后端服務(wù)器目錄下。

在后端服務(wù)器中添加對SPA模板文件的托管，僅需一行代碼即可實現(xiàn)：app.use(express.static(‘frontend’))。其中app為后端服務(wù)器運(yùn)行實例，frontend為SPA模板文件所在目錄。

添加Heroku運(yùn)行配置文件：在后端源文件目錄下添加Procfile文件，最基本的運(yùn)行配置也僅需一行代碼：web: node server.js。其中server.js文件為后端服務(wù)器啟動程序。

綁定Heroku Git源：Heroku會為每一個Web應(yīng)用提供一個遠(yuǎn)程Git源，綁定之后，每一次Git提交代碼操作都會自動觸發(fā)Web應(yīng)用的重新編譯和部署行為，簡化了Web應(yīng)用重新發(fā)布的流程。

2.2.4 系統(tǒng)實現(xiàn)

系統(tǒng)主界面以列表的形式展示所有隨訪結(jié)果，提供隨訪結(jié)果的搜索/導(dǎo)出/查看/新增/修改/刪除功能(圖4)。

圖4 網(wǎng)絡(luò)隨訪系統(tǒng)主界面

隨訪結(jié)果錄入界面以時間軸的形式展示患者的所有隨訪記錄和疾病風(fēng)險評估記錄。如果本次隨訪記錄的某字段與上次隨訪記錄的某字段存在差異，將會標(biāo)黃顯示。風(fēng)險評估走勢直觀地展示了疾病風(fēng)險的走勢情況。鼠標(biāo)懸浮在某個時間點上方還會顯示本次隨訪記錄與上次隨訪記錄的不同之處，可以用于估測對患者疾病風(fēng)險影響較高的因素(圖5)。

疾病風(fēng)險評估表由若干評估問題組成(圖6)，每個問題的選項均對應(yīng)一定的分值，選擇相應(yīng)的選項可實時計算評估總分并計算出風(fēng)險分級結(jié)果。

圖5隨訪結(jié)果錄入界面

圖6 疾病風(fēng)險評估表截圖

3 應(yīng)用效果

系統(tǒng)完成研發(fā)后，在院內(nèi)神經(jīng)內(nèi)科進(jìn)行了應(yīng)用，制作了重癥肌無力病種的隨訪數(shù)據(jù)表單，醫(yī)生可在院內(nèi)外方便地訪問本系統(tǒng)并錄入隨訪數(shù)據(jù)。上線數(shù)月后，已完成對2 000多名患者的隨訪管理，每名患者平均錄入3～4條隨訪跟蹤信息。系統(tǒng)界面友好，操作方便，用戶體驗流暢，能方便地對患者病情進(jìn)行評估并查看風(fēng)險走勢和影響因素，得到了科室醫(yī)生的一致認(rèn)可。醫(yī)生可以使用本系統(tǒng)篩選特定條件的患者，并將結(jié)果以Excel的格式導(dǎo)出，導(dǎo)入統(tǒng)計分析軟件(如SPSS)進(jìn)行統(tǒng)計學(xué)分析，有力地輔助了醫(yī)學(xué)研究工作。

4 總結(jié)和展望

本文針對網(wǎng)絡(luò)隨訪系統(tǒng)的需求，采用基于MEVN架構(gòu)的SPA技術(shù)設(shè)計和實現(xiàn)了一種簡潔靈活、開發(fā)效率高、用戶體驗好的隨訪系統(tǒng)單頁面應(yīng)用，并將其部署到云服務(wù)上。相對于其他針對隨訪系統(tǒng)的研究，本文采用了一種基于文檔的非關(guān)系型數(shù)據(jù)庫和全新的MEVN技術(shù)架構(gòu)，具有適應(yīng)復(fù)雜數(shù)據(jù)結(jié)構(gòu)、擴(kuò)展性好，并發(fā)性能強(qiáng)、用戶體驗流暢、易部署等優(yōu)點，適合快速響應(yīng)用戶需求并高效開發(fā)Web應(yīng)用。在下一步工作中，本系統(tǒng)將與院內(nèi)HIS系統(tǒng)進(jìn)行對接，導(dǎo)入HIS系統(tǒng)中的患者信息，形成更加完整的患者健康視圖，并且集成數(shù)據(jù)分析模塊，實時對隨訪數(shù)據(jù)進(jìn)行統(tǒng)計分析和匯總展示?？梢灶A(yù)見，SPA技術(shù)作為一種新興的Web開發(fā)技術(shù)，將會在各行業(yè)信息化中得到越來越廣泛的應(yīng)用。