基于HTML5的腦溢血康復(fù)護理軟件設(shè)計

徐志偉，萬 紅，李宗朋，李 震，樸 雪

（徐州醫(yī)科大學(xué)醫(yī)學(xué)信息學(xué)院，江蘇 徐州 221004）

1 系統(tǒng)分析

1.1 軟件開發(fā)的必要性

腦溢血是嚴(yán)重危害人類生命健康的常見病之一，具有發(fā)病急、進展快、病死率高、致殘率高等特點[1]。腦溢血搶救不及時會導(dǎo)致神經(jīng)功能缺損、肢體活動功能障礙、語言功能障礙等后遺癥[2]。對腦溢血患者進行積極治療，可以降低致殘率，防止疾病復(fù)發(fā)，所以腦溢血后遺癥患者術(shù)后護理意義重大。大部分患者家屬腦溢血防治與康復(fù)護理知識較匱乏，錯誤的飲食和生活習(xí)慣往往會導(dǎo)致后遺癥加重，甚至使疾病復(fù)發(fā)。因此，急需開發(fā)一個實用、便捷、高效的腦溢血康復(fù)護理軟件。

國內(nèi)一些專家、學(xué)者對腦溢血后遺癥患者的回訪進行了研究，發(fā)現(xiàn)目前針對此類患者的康復(fù)護理仍處于初期階段，以信息查詢、咨詢?yōu)橹?，并沒有專門為患者提供詳細的康復(fù)計劃和指導(dǎo)，未建立腦溢血后遺癥患者康復(fù)指導(dǎo)系統(tǒng)。

鑒于以上原因，筆者開發(fā)了一項基于HTML5的腦溢血康復(fù)護理軟件，實現(xiàn)了醫(yī)患實時溝通，為腦溢血后遺癥患者提供專業(yè)的家庭康復(fù)和護理指導(dǎo)。醫(yī)生可以第一時間了解患者恢復(fù)情況，制定更好的康復(fù)方案，為腦溢血治療方法研究奠定良好基礎(chǔ)。

1.2 HTML5的優(yōu)勢

HTML5是互聯(lián)網(wǎng)的核心技術(shù)之一，是構(gòu)建和呈現(xiàn)互聯(lián)網(wǎng)內(nèi)容的一種語言方式，現(xiàn)已成為互聯(lián)網(wǎng)開發(fā)技術(shù)的新標(biāo)準(zhǔn)[3]。與其他技術(shù)相比，HTML5具有自適應(yīng)網(wǎng)頁設(shè)計、跨平臺使用、交互性強等優(yōu)勢。筆者開發(fā)的腦溢血康復(fù)護理軟件根據(jù)患者情況、醫(yī)生意見和最新資訊，在PC端與移動端及時更新、反饋和推送，具有廣闊的發(fā)展前景。

圖1 腦溢血康復(fù)護理軟件總體設(shè)計

2 軟件功能模塊設(shè)計

根據(jù)腦溢血后遺癥患者治療需求，該軟件設(shè)計4個主要功能模塊，如圖1所示。用戶可直接在首頁點擊腦溢血視頻、腦溢血管理、腦溢血影像、聯(lián)系我們模塊進入，也可以通過菜單選擇更多模塊進入。

2.1 腦溢血視頻

本模塊中，插入腦溢血介紹、預(yù)防視頻。用戶點擊“腦溢血視頻”按鈕進入該模塊，也可以通過菜單選擇更多模塊選項進入該模塊，通過在線觀看或下載觀看兩種方式瀏覽。筆者精心挑選質(zhì)量轉(zhuǎn)好的視頻插入，用戶可免費觀看。

2.2 腦溢血管理

點擊“腦溢血管理”按鈕進入腦溢血管理模塊，也可以通過菜單選擇更多模塊選項進入該模塊。本模塊中添加了治療腦溢血的代表藥物，詳細介紹了它們的藥動學(xué)特點、藥理作用、適應(yīng)證、用法用量以及注意事項。對于各種藥物的特點進行簡要說明，方便用戶查詢。用戶點擊菜單中相應(yīng)選項卡，進入相關(guān)內(nèi)容介紹頁面。

2.3 腦溢血影像

該模塊詳細介紹了彩色多普勒雙功能超聲、MRA磁共振血管造影、CTA-CT血管成像技術(shù)、CTP-CT灌注成像、DSA-數(shù)字減影血管造影技術(shù)的原理及主要參數(shù)、應(yīng)用領(lǐng)域和診斷價值。用戶可以通過點擊菜單中相應(yīng)選項，進入相關(guān)內(nèi)容介紹頁面。

2.4 聯(lián)系我們

該模塊提供了醫(yī)患交流溝通通道，用戶點擊“聯(lián)系我們”按鈕即可進入，也可以通過菜單選擇更多模塊選項進入。用戶匿名發(fā)送關(guān)于腦溢血方面的疑惑，醫(yī)生負責(zé)解答。用戶對網(wǎng)站開發(fā)的建議或意見，也可以通過電子郵件的方式聯(lián)系開發(fā)者，使網(wǎng)站不斷完善。

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

3.1 界面實現(xiàn)

腦溢血康復(fù)護理軟件包括手機端和服務(wù)端兩部分。為了使軟件能夠多設(shè)備跨平臺使用，用戶界面使用HTML5、JAVASCRIPT和CSS3相結(jié)合的方式，讓操作更簡單、美觀、人性化。用戶通過手機、平板電腦等移動設(shè)備向服務(wù)器發(fā)出請求，服務(wù)器響應(yīng)之后最終將HTML5轉(zhuǎn)換為圖文并茂的網(wǎng)頁，并呈現(xiàn)在移動客戶端上。關(guān)鍵代碼如下：

3.2 視頻播放及下載的實現(xiàn)

觀看和下載視頻資源是用戶使用腦溢血康復(fù)護理軟件的基本需求，通過視頻可以生動、清晰、全面地向用戶展示腦溢血康復(fù)護理的前沿知識。網(wǎng)絡(luò)微視頻、多媒體技術(shù)的廣泛應(yīng)用和移動終端便攜攝錄技術(shù)的進步，使得醫(yī)患雙方視頻交互更容易實現(xiàn)[4]。

腦溢血康復(fù)護理相關(guān)視頻的播放主要通過HTML5的“Video”標(biāo)簽實現(xiàn)，不需要任何視頻插件。由于各個瀏覽器支持的視頻標(biāo)準(zhǔn)存在差異，視頻解碼器可以分為3種類型：H.264、Theora和 VP8[5]。在“Video”標(biāo)簽中定義了 3 個“Source”標(biāo)簽，通過“src”屬性指定3個不同的媒體源，加入以上3種類型的視頻標(biāo)準(zhǔn)，瀏覽器會自動挑選最佳視頻源進行播放，從而實現(xiàn)多個瀏覽器兼容播放的操作。腦溢血康復(fù)護理相關(guān)視頻的下載則通過使用 HTML5 的“a”標(biāo)簽實現(xiàn)，利用“a”標(biāo)簽“href”屬性指明超鏈接目標(biāo)的URL，利用“a”標(biāo)簽“download”屬性重新規(guī)定超鏈接目標(biāo)的文件名。同時，利用“img”標(biāo)簽向網(wǎng)頁插入下載圖標(biāo)“”，并將此段代碼嵌入“a”標(biāo)簽，從而實現(xiàn)單擊下載圖標(biāo)“”即可下載腦溢血康復(fù)護理相關(guān)視頻的操作。視頻播放界面如圖2所示，用戶可以通過在線觀看或者下載觀看兩種方式瀏覽，關(guān)鍵代碼如下：

圖2 腦溢血康復(fù)護理軟件視頻播放界面

3.3 數(shù)據(jù)存儲與訪問

筆者使用HTML5提供的客戶端數(shù)據(jù)存儲和離線存儲技術(shù)，獲得更好的用戶體驗?？蛻舳舜鎯Σ捎谩發(fā)ocal Storage”方式，通過“js”設(shè)置“name”和“value”，保存軟件中欄目相對固定的信息，如腦溢血護理注意事項、腦溢血治療診斷現(xiàn)狀等。離線存儲則利用“manifest”文件配置本地文件和需要服務(wù)器進行加載的文件，即通過“cache manifest”文件指明需要緩存的資源，對靜態(tài)頁、圖片等進行離線存儲，用戶在離線訪問程序時，資源文件會自動加載，不需要從服務(wù)器端獲取。通過以上兩種本地存儲實現(xiàn)用戶即使在離線狀態(tài)下也能繼續(xù)瀏覽腦溢血康復(fù)護理軟件信息。

4 結(jié)語

腦溢血康復(fù)護理軟件利用HTML5技術(shù)開發(fā)，具有跨平臺、交互性強、部署成本低等特點。用戶可以通過訪問移動終端腦溢血管理、腦溢血視頻、腦溢血影像等4個模塊，及時了解腦溢血相關(guān)信息；醫(yī)生也可以通過移動終端及時了解患者情況，推送一些關(guān)于腦溢血的權(quán)威信息，實現(xiàn)醫(yī)患實時溝通，具有廣闊的應(yīng)用前景。