基于微信小程序的體質(zhì)健康管理系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

張學(xué)敏

摘要：通過現(xiàn)代科技手段，設(shè)計(jì)一款滿足人們?nèi)粘＝∩硇枨蟮能浖?。系統(tǒng)采用模塊化設(shè)計(jì)，包括前端、后臺(tái)、數(shù)據(jù)庫三部分。前端主要是使用微信開發(fā)者進(jìn)行頁面相關(guān)的設(shè)計(jì)，后臺(tái)使用軟件IntelliJ IDEA進(jìn)行程序設(shè)計(jì)，數(shù)據(jù)庫編寫使用MySQL。系統(tǒng)實(shí)現(xiàn)的功能有：用戶注冊(cè)登錄、用戶信息完善、通過推薦鏈接觀看健身房各健身項(xiàng)目、健身課程教學(xué)等。

關(guān)鍵詞：IntelliJ IDEA;MySQL;微信開發(fā)者工具

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

文章編號(hào)：1009-3044（2019）22-0103-04

開放科學(xué)（資源服務(wù)）標(biāo)識(shí)碼（OSID）：

Design and Implementation of Home Environment Detection System

ZHANG Xue-min

（Anhui Medical University， Hefei 230032， China）

Abstract： A software was designed that meets people's daily fitness needs through modern technology. The system adopted modular design， including front-end， back-end， and database. The front-end mainly uses WeChat developers for page-related design， the background is designed with software IntelliJ IDEA， and the database is written using MySQL. The functions that the system needs to implement are： user registration and login， perfecting user information， watching gymnastics fitness programs through recommended links， fitness class teaching.

Key words：IntelliJ IDEA; MySQL; Wechat Developer Tool

1 背景

習(xí)近平總書記在十九大報(bào)告中指出，實(shí)施健康中國(guó)戰(zhàn)略，推動(dòng)全民健身和全民健康深度融合 [1]。全民健身已經(jīng)成為備受關(guān)注的話題，但現(xiàn)如今城市生活節(jié)奏加快，個(gè)人空間變小，健身成本的增高，更多年輕人傾向于通過網(wǎng)絡(luò)健身，而微信小程序以其自帶推廣、觸手可及、無須安裝、快捷搜索、成本低廉、使用體驗(yàn)更為流暢的優(yōu)勢(shì)，備受用戶青睞。因此，筆者設(shè)計(jì)基于微信小程序的體質(zhì)健康管理系統(tǒng)，旨在響應(yīng)國(guó)家號(hào)召，拓寬全民健身渠道。

2 系統(tǒng)分析

2.1 需求分析

系統(tǒng)需求包括：1）用戶實(shí)現(xiàn)注冊(cè)登錄;2）用戶信息完善;3）健身項(xiàng)目展示，可進(jìn)行學(xué)習(xí)購(gòu)買;4）用戶可進(jìn)行評(píng)價(jià)。

2.2 可行性分析

IntelliJ IDEA是一種java編程語言開發(fā)的集成環(huán)境。這款軟件在計(jì)算機(jī)編程里面被公認(rèn)為最好的用于java開發(fā)工具之一，特別是在智能代碼助手、代碼自動(dòng)提示、重構(gòu)、J2EE支持、各類版本工具（git、svn等）、JUnit、CVS整合、代碼分析、 創(chuàng)新的GUI設(shè)計(jì)等方面，其功能明顯優(yōu)于其他軟件[2]。

前期推廣主要通過傳單宣傳、轉(zhuǎn)發(fā)宣傳等線上線下結(jié)合的方式進(jìn)行，以求打開一定流量入口，前期主要公益性使用，后期渠道拓寬，市場(chǎng)范圍擴(kuò)大，再進(jìn)行營(yíng)利性經(jīng)營(yíng)。

2.3 開發(fā)環(huán)境簡(jiǎn)介

2.3.1 微信web開發(fā)者工具

這款工具是由微信官方在網(wǎng)上發(fā)布的主要是針對(duì)微信小程序的一種開發(fā)工具，集中了開發(fā)，調(diào)試，預(yù)覽，上傳等功能。2018年3月，微信團(tuán)隊(duì)發(fā)布了微信小程序開發(fā)者工具、微信小程序開發(fā)文檔和微信小程序設(shè)計(jì)指南，全新的開發(fā)者工具，集成了開發(fā)調(diào)試、代碼編輯及程序發(fā)布等功能，幫助開發(fā)者簡(jiǎn)單和高效地開發(fā)微信小程序[3]。

啟動(dòng)工具時(shí)，開發(fā)者需要使用已在后臺(tái)綁定成功的微信號(hào)掃描二維碼登錄，后續(xù)所有的操作都會(huì)基于這個(gè)微信的賬號(hào)。程序調(diào)試主要有三大功能區(qū)：模擬器、調(diào)試工具和小程序操作區(qū)。模擬器模擬微信小程序在客戶端真實(shí)的邏輯表現(xiàn)，對(duì)于絕大部分的 API 均能夠在模擬器上呈現(xiàn)出正確的狀態(tài)。調(diào)試工具分為 6 大功能模塊：Wxml、Console、Sources、Network、Appdata、Storage以及WxmlPannel。

2.3.2 IntelliJ IDEA

首先是配置JDK。打開“File”–>“project setting”，添加本地安裝的JDK。JDK是Java的開發(fā)工具包，主要包含了各種類庫和工具，JDK提供了一個(gè)虛擬機(jī)。另外，JDK的bin目錄下有各種Java程序需要用到的命令，JDK文件下有javac。JDK是Java的開發(fā)工具，它不僅提供了Java程序運(yùn)行所需的JRE，還提供了一系列的編譯，運(yùn)行等工具，如javac，java，javaw等。JRE只是Java程序的運(yùn)行環(huán)境，它最核心的內(nèi)容就是JVM（Java虛擬機(jī)）及核心類庫。環(huán)境安裝如圖1：

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

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

系統(tǒng)用戶在注冊(cè)登錄后，可以對(duì)小程序內(nèi)健身項(xiàng)目進(jìn)行購(gòu)買和退換，使用的這種小型便捷的軟件，主要方便完成戶的健身需求，同時(shí)用戶也可以在進(jìn)行留言評(píng)論。

3.2.1 系統(tǒng)功能

小程序功能包括：1）新用戶進(jìn)行注冊(cè)，姓名，身高，體重，密碼等一系列操作;2）注冊(cè)完成后，進(jìn)入登錄界面進(jìn)行登錄;3）登錄后，可以看到一些健身文章和健身的項(xiàng)目簡(jiǎn)介;4）進(jìn)入課程可以進(jìn)行購(gòu)買和退換;5）用戶可在評(píng)論區(qū)評(píng)論反饋。

3.2 系統(tǒng)模塊

圖2是用戶模塊，用戶注冊(cè)登錄后進(jìn)入首頁，可以查看健身文章和健身課程，并可以選擇文章閱讀，同時(shí)可以購(gòu)買課程和退換。只有購(gòu)買了課程，才可以在課程下方進(jìn)行評(píng)論和反饋。圖3是管理單元模塊，在管理界面可以查看用戶信息，對(duì)健身課程和文章進(jìn)行添加、刪除還有價(jià)格和內(nèi)容的修改。

3.3 界面設(shè)計(jì)模塊

3.2.1 系統(tǒng)初始化模塊

初始化的狀態(tài)即為用戶看到的注冊(cè)登錄界面，頁面需要簡(jiǎn)潔干凈和大方，給人一種舒心的感覺，讓用戶感興趣，不反感。同時(shí)界面上的按鈕和功能清楚，簡(jiǎn)單明了。

3.2.2 使用進(jìn)程模塊

用戶注冊(cè)登錄后，進(jìn)入頁面，會(huì)看到三個(gè)基礎(chǔ)選項(xiàng)，分別是首頁，課程，我的;這三個(gè)分別用以完成此課題的主要功能。進(jìn)入首頁后，會(huì)有健身相關(guān)課程和文章供用戶查看，用戶可以選擇感興趣的觀看和了解，進(jìn)入課程頁面，可以對(duì)健身課程進(jìn)行購(gòu)買和退換;進(jìn)入我的頁面，可查看自我資料，已經(jīng)購(gòu)買的課程。

3.2.3 管理單元模塊

管理單元模塊，在管理界面可以查看用戶信息，對(duì)健身課程和文章進(jìn)行添加、刪除還有價(jià)格和內(nèi)容的修改。

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

系統(tǒng)大致分為三個(gè)部分前端顯示，后臺(tái)管理，數(shù)據(jù)庫設(shè)計(jì)。微信小程序系統(tǒng)實(shí)現(xiàn)前期大致步驟：注冊(cè);小程序信息完善;開發(fā)小程序;使用微信web開發(fā)者工具進(jìn)行小程序開發(fā);開發(fā)者可以調(diào)試微信網(wǎng)頁授權(quán)和微信JS-SDK。JS-SDK使用步驟：綁定域名;引入JS文件;通過config接口注入權(quán)限驗(yàn)證配置;通過ready接口處理成功驗(yàn)證;通過error接口處理失敗驗(yàn)證[3]。

4.1 前端顯示

4.1.1 頁面的初始化

未注冊(cè)或登錄時(shí)的頁面初始化，如圖5：

登錄后頁面的初始化，如圖6：

4.1.2 課程購(gòu)買退換模塊

購(gòu)買模塊：

退購(gòu)模塊：

4.1.3 用戶界面的管理模塊：

資料編輯模塊：

退出登錄模塊：

4.2 后臺(tái)管理設(shè)計(jì)

后臺(tái)設(shè)計(jì)使用Java編程語言，使用軟件IntelliJ IDEA;包括管理后臺(tái)，后臺(tái)對(duì)應(yīng)api，底層支持和工具方法，數(shù)據(jù)庫及對(duì)象相關(guān)，小程序代碼和小程序api。使用springboot+mybatis框架[4]。

Spring的存在就是為了解決開發(fā)的復(fù)雜度，它不只是在某個(gè)服務(wù)器端之間的開發(fā)，還可以根據(jù)各種不同的角度在java的應(yīng)用上面應(yīng)用[5]。Spring Boot是所有基于Spring開發(fā)的項(xiàng)目的起點(diǎn)。SpringBoot其實(shí)不是什么新的框架，它默認(rèn)配置了很多框架的使用方式，就像maven整合了所有的jar包，spring boot整合了所有的框架[6]。

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

數(shù)據(jù)庫設(shè)計(jì)使用MySQL進(jìn)行編程，MySQL，也稱為My-SEQuel，是一個(gè)開源的，多用戶的，多線程的關(guān)系型數(shù)據(jù)庫的管理系統(tǒng)，由DBMS，DBM和DBA部分組成[7]。它主要是有效地管理大量信息，由于它是開源的，而且執(zhí)行的速度快，體積還小，成本又比較低，主要是還支持Linux，Windows等很多種的操作系統(tǒng)，它具有強(qiáng)大的索引功能，能加速數(shù)據(jù)檢索操作，因此許多網(wǎng)站更喜歡MySQL作為他們的數(shù)據(jù)庫，適合中小型項(xiàng)目管理內(nèi)容[8]。

5 系統(tǒng)調(diào)試與測(cè)試

5.1 測(cè)試方法

在初步完成該系統(tǒng)時(shí)，主要在電腦也就是web端進(jìn)行調(diào)試，測(cè)試各部分模塊，能否完成任務(wù)書的主要功能，在測(cè)試過程中注意功能實(shí)現(xiàn)的同時(shí)，有沒有更好的方法改進(jìn)，進(jìn)一步完善系統(tǒng)。

5.2 測(cè)試環(huán)境和條件

測(cè)試環(huán)境有兩個(gè)，一個(gè)在電腦端測(cè)試，一個(gè)通過手機(jī)端進(jìn)行模擬用戶使用測(cè)試。測(cè)試時(shí)，對(duì)照任務(wù)書上的各項(xiàng)功能進(jìn)行一一驗(yàn)證，通過微信web開發(fā)者工具的真機(jī)調(diào)試模塊，手機(jī)端掃碼登錄，測(cè)試條件一定是符合任務(wù)書標(biāo)準(zhǔn)。

5.3 測(cè)試數(shù)據(jù)

測(cè)試過程中，測(cè)試數(shù)據(jù)主要為用戶的注冊(cè)和登錄，錄入用戶的個(gè)人信息如姓名，年齡，體重，身高，性別，手機(jī)號(hào)，還有對(duì)自己運(yùn)動(dòng)偏向的標(biāo)簽。在用戶登錄后，測(cè)試的數(shù)據(jù)主要是人為的操作為主，體驗(yàn)這款微信小程序的操作是否符合標(biāo)準(zhǔn)，設(shè)計(jì)的是否人性化，操作感是否流暢，界面設(shè)計(jì)是否合理，多找?guī)讉€(gè)同學(xué)進(jìn)行體驗(yàn)，根據(jù)同學(xué)使用情況進(jìn)行修改。

5.4 測(cè)試結(jié)果和分析評(píng)價(jià)

從首頁界面、可選擇購(gòu)買的健身課程界面、用戶自我管理界面、用戶購(gòu)買課程和退換課程，界面的刷新等角度對(duì)小程序進(jìn)行了測(cè)試，測(cè)試效果良好，可以完整完成各項(xiàng)功能，

參考文獻(xiàn)：

[1] 韓喜平， 孫小杰. 全面實(shí)施健康中國(guó)戰(zhàn)略[EB/OL].4. http：//mini.eastday.com/mobile/171022212306067.html#，（2018-12-24）.

[2] 黃強(qiáng)文， 曾丹. 基于Spring Cloud和Docker的分布式微服務(wù)架構(gòu)設(shè)計(jì)[J]. 微型電腦應(yīng)用， 2019， 35（6）： 98-101.

[3] 高小倩. 微信小程序公布四大廣告位，騰訊能成為以廣告收入為主的公司么？[EB/OL]. .https：//baike.baidu.com/reference/20171697/e5e1oyH03Jn6qkW3xe0IaXz2eTPRapEMNSFw8InpuCnQC2WglP7G1xfhO1vFLpeAmOCiyc0quoqP81Wr.（2018-03-29）.

[4] 李雪釗. 基于微信小程序的慢出行共享系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[D]. 北京： 首都經(jīng)濟(jì)貿(mào)易大學(xué)， 2018.

[5] 王曉茹. 基于個(gè)性化推薦的英語輔助教學(xué)系統(tǒng)設(shè)計(jì)[J]. 微型電腦應(yīng)用， 2019， 35（5）： 35-38.

[6] 陳昊， 齊殿偉， 劉煜， 等. “益點(diǎn)益滴”大學(xué)生教育與公益平臺(tái)設(shè)計(jì)及實(shí)現(xiàn)[J]. 現(xiàn)代信息科技， 2019， 3（7）： 73-76， 79.

[7] 鐘婉石. 智能家居網(wǎng)關(guān)與信息推送的分析與研究[D]. 沈陽： 沈陽建筑大學(xué)， 2017.

[8] 邱志軍， 吳彬， 蔣志勇. 基于微信的志愿服務(wù)管理系統(tǒng)開發(fā)與應(yīng)用[J]. 計(jì)算機(jī)產(chǎn)品與流通， 2019（7）： 104-106.

【通聯(lián)編輯：謝媛媛】