Oray上的小程序教學輔助平臺設計與實現

廖海玲 何明昌 李梅 楊宇豪 張睿 張盼

摘要：目前大多數高校的教學平臺都是網站形式，也有一些提供手機APP以實現部分功能。隨著微信的流行與便捷，師生們使用微信的比例越來越高。為此開發了一款基于微信小程序的教學輔助平臺，并自建管理后臺，開發語言使用PHP，采用MySQL構建數據庫，結合Oray上的https域名發布。平臺涵蓋了課表查詢、成績查詢、在線考試、視頻教學、社區討論，并獨創課堂坐標位置考勤功能，同時滿足了學生們碎片化學習的需求。

關鍵詞：微信;小程序;輔助;坐標;考勤;Oray

中圖分類號：G434? ? ? ? 文獻標識碼：A

文章編號：1009-3044（2019）19-0090-03

Abstract： At present， most of the teaching platforms in colleges and universities are in the form of websites， and some provide mobile apps to realize some functions. With the popularity and convenience of WeChat， more and more teachers and students use WeChat. For this purpose， a teaching assistant platform based on WeChat small program was developed， and a management background was built. development language used PHP， MySQL was used to build the database， and the HTTPS domain name on Oray was published. The platform covers course schedule query， score query， online examination， video teaching， community discussion， and the original classroom coordinate position attendance function， while meeting the needs of students in fragmented learning.

Key words： WeChat; Small program; Auxiliary; Coordinates; Attendance; Oray

1 引言

通過基于Android的APP教育平臺模式開發出的教育平臺， 雖然可以定制完善功能， 但其客戶量、重復的登陸、退出、安裝、卸載等，給用戶帶來的煩冗工作是非常麻煩的，手機的容量就是那么大，不可能無休止地安裝手機APP，于是基于微信的手機應用越來越多，也越來越受用戶喜愛。調查顯示2018年微信活躍用戶達到10.4億人，巨大的市場資源是微信小程序蓬勃發展的主要因素， 但是由于技術局限性，微信小程序使用起來也存在功能局限性，其主因還在于必須借助微信的管理，基于微信平臺二次開發的應用程序顯示出越來越明顯的市場優勢[1]，為此，使用微信小程序開發，擁有自己的管理后臺是非常必要的。

2 技術結構

微信小程序的整體技術架構大概從以下幾個方面來說：視圖層和邏輯層分離，通過數據驅動，事件交互，不直接操作DOM;視圖層負責渲染頁面結構，邏輯層負責邏輯處理、數據請求、接口調用等。如圖1所示：

3 技術實現

3.1 前端設計

微信小程序的前端設計最大特點就是代碼邏輯清晰簡單，微信小程序首先初始項目，要求把每個頁面相關的js、wxss、wxml放在各自的文件中，使得結構清晰明朗，這種設計理念，使得微信小程序整齊劃一，職責明確，減輕代碼設計復雜度。在小程序設計中，主要的文件app.json作用是對微信小程序進行全局配置，決定頁面文件的路徑、窗口表現、設置網絡超時時間、設置多 tab 等，而入口文件app.js則注冊一個小程序，接受一個 object 參數，通過其指定小程序的生命周期函數，通過全局方法getApp（）獲取app實例，進而直接調用它的屬性或方法。

平臺基于小程序進行開發，主要開發語言是 JavaScript。小程序的開發與普通的網頁開發相比有很大的相似性。網頁開發渲染線程和腳本線程是互斥的，長時間的腳本運行可能會導致頁面失去響應，而在小程序中，二者是分開的，分別運行在不同的線程中。網頁開發者可以使用到各種瀏覽器暴露出來的 DOM API，進行 DOM 選中和操作，使系統易于維護，易于測試。

3.2 后臺架構設計

適用于Web開發領域前后臺用的開發語言有以下幾種：java，Python，php，asp.net，c++，rubyon rails等。PHP是運行在服務器的腳本，在語法上吸收了C語言、Java的特點，利于學習，使用廣泛，其特點是靈活，上手快，易修改，發布快捷，環境好部署，可以運行在UNIX、LINUX、WINDOWS、Mac OS、Android等平臺。ThinkPHP是一個快速、兼容而且簡單的輕量級國產PHP開發框架，使用面向對象的開發結構和MVC模式，融合了Struts的思想和TagLib（標簽庫）、ROR的ORM映射和ActiveRecord模式，提高了代碼的重用率[3]，可以支持Windows/Unix/Linux等服務器環境，支持MySQL、PgQL、Sqlite多種數據庫以及PDO擴展。作為一個整體開發解決方案，ThinkPHP能夠解決應用開發中的大多數需要，其自身包含了底層架構、兼容處理、基類庫、數據庫訪問層、模板引擎、緩存機制、插件機制、角色認證、表單處理等常用的組件，并且對于跨版本、跨平臺和跨數據庫移植都比較方便。

MySQL是一個小型關系型數據庫管理系統，是開源的，目前MySQL被廣泛地應用在Internet上的中小型網站中。由于其體積小、速度快、總體擁有成本低，開放源碼，因此平臺中我們采用MySQL進行數據處理。

4 系統需求分析

平臺采用HTML5、java進行前端設計，用PHP+MYSQL數據庫進行后臺開發，平臺力求給每個用戶最貼心的學習服務，主要功能有信息查找、資料分享，視頻學習，社區討論、視頻直播等，根據業務流程，系統內分三大板塊：教師手機客戶端、學生手機客戶端和管理員后臺。功能區有四個模塊：分別為教學輔助模塊，消息接收模塊，社區討論模塊，個人中心模塊，如圖3所示：

5 系統實現

5.1 JSON數據交換格式

JSON（Java Script? Object? Notation）是一種輕量級的獨立語言的文本數據交換格式，基于Java Script編程語言的一個子集，具備良好的讀寫性能，并且方便機器進行解析和生成[4]，這些特性使得JSON成為理想的數據交換語言，所以系統在手機客戶端采用JSON數據交換格式。JSON作為數據的交換格式，在客戶端和服務器端都要有對應的轉換過程，如圖4所示：

5.2 坐標位置考勤實現

教師登錄系統后，向服務器發出學生考勤請求，系統接到指令，向學生發出登錄指令，學生登錄后，系統得到學生位置信息，系統根據學生位置信息，識別學生是否在指定位置，得出考勤結果，流程如圖5所示：

5.3 動態網站服務器

因為設計的網站是動態的，相關的功能需要有大量的數據上傳等，如果找一些付費的服務器的話，除了增加成本外，還要考慮一些運行成本以及網站維護等問題，而且在發布運行過程中隨時都有可能要調試修改。基于上面的問題我們選擇了花生殼Oray作為平臺用的動態域名解析。

下載花生殼動態域名軟件安裝后，輸入賬號密碼登錄，設置內網穿透，綁定自己的IP提交，花生殼客戶端會記錄ADSL撥號后所分配的動態IP地址，然后返還給花生殼服務器端，并把IP地址寫入用戶在花生殼網站注冊的域名記錄里[5]，這樣非常方便平臺的調試與維護。

6 結束語

隨著互聯網的深入發展，教學輔助工具也應該與時俱進，平臺通過強大的互聯網技術，通過微信小程序，使用坐標定位考勤，極大提高了學生到課率平臺還分享優秀的學習資料，開設課程直播、點播等功能，為師生們提供一個高質量、體驗優的學習平臺。

參考文獻：

[1] 劉琦，丁萍莉.基于微信小程序的互聯網+教育學習平臺的研究與設計[J].內江科技，2016，37（12）：45-46.

[2] 歉信君.淺談微信小程序架構[EB/OL].https：//www.cnblogs.com/kenshinobiy/p/6724867.html.

[3] 孫武，陳濤，王凡，劉炳楠，劉春.基于ThinkPHP框架的學習共享資源平臺的設計與實現[J].電腦迷，2018（5）：208.

[4] 王華志. 基于JSON的異構數據源數據交換技術研究[D].武漢：武漢理工大學，2015.

[5] 何明昌.建設經濟高效動態服務器 提升學生網站建設容量[J].實驗室研究與探，2010，29（5）：58-61+78.

【通聯編輯：王力】