教師端架構

教師端架構包含伺服器系統、程式系統、以及資料庫系統三大系統，三者為 建立一網際網路服務平台最基本的三要素，於下列一一詳述之。

伺服器系統：採用Apache HTTP Server（以下簡稱 Apache），Apache 為一開 放原始碼的網頁伺服器，其特點為可運行於絕大多數的系統平台，並可透過本身 模組提供的API 支援多種程式語言，同時具有多執行緒，由於其跨平台和支援廣 泛的特性，目前在網際網路上擁有最高的市佔率。

程式系統：採用HTML、PHP 與 JavaScript（http://www.w3schools.com/）三種 基本語法，並搭配 CodeIgniter 開發套件（http://www.codeigniter.org.tw/）與 jQuery 語法（http://jquery.com/）輔助開發 [19]。HTML 為 HyperText Markup Language 的 縮寫，中文名稱為「超文件標示語言」，用來建立與描述網頁的外觀，例如標題 或段落等等，為一種標示語言。PHP 為伺服器端運行的腳本語言，透過執行 PHP 的程式碼可產生動態網頁，並可與多數資料庫系統結合，又因為運行在伺服器所 以具有高安全性，為一廣泛使用的程式語言。JavaScript 為使用者端運行的腳本語 言，不需要伺服器的支援便能在使用者端的瀏覽器執行，為HTML 網頁添加動態 功能，可減輕伺服器負擔，但也因此有著較低的安全性，所以必須與PHP 語言互 相搭配使用方能達到最佳效果。 CodeIgniter 為 PHP 開發輔助程式，主要用途在於

提供方便快速的PHP 撰寫框架（Framework），讓開發者能夠更有效率與模組化 的開發PHP 程式，CodeIgniter 優點在於動態實例化（dynamic instantiation）以及 鬆散耦合（loose coupling），前者表示元件只有在請求時才會載入並執行，可降低 資源佔用，後者表示系統中的元件彼此之間的依賴程度低，具有高度彈性，

CodeIgniter 同時提供多項安全性保護，包括 URI 字串限制、跨站腳本攻擊過濾、

表單資料驗證、以及資料庫SQL 注入攻擊過濾。jQuery 為一 JavaScript 函式庫，

提供多項JavaScript 輔助操作功能，主要在簡化與加速 JavaScript 的撰寫，建立強 大的動態網頁。

資料庫系統：採用MySQL，MySQL 為一關聯式資料庫管理系統，用於儲存 系統資料，其特色為可運行於絕大多數的系統平台，並且為多種語言提供API，同 時具有多執行緒，為目前廣泛運用的資料庫系統。

上述三系統為建立網際網路服務平台之基礎架構，本論文系統主要開發部份 在於程式系統部分，並使用MVC 架構進行開發，MVC 為 Model-View-Controller 的縮寫，為系統開發中的一種架構模式，MVC 架構意指將系統分為三個部分：模 組（Model）、顯示（View）和控制（Controller），使用 MVC 架構可將程式碼做 清楚的切割並且模組化，以利開發人員撰寫和日後的維護，Model 部分主要撰寫核 心運算程式，並且負責和資料庫做溝通，View 部分主要撰寫給使用者觀看與操作 的介面程式，Controller 則為整個系統的控制中心，負責與 Model 和 View 做溝通，

所有的訊息與指令都經由Controller 做處理，View 和 Model 之間無法溝通（圖 2-2），

以一個具有過濾髒話機制的網路留言板為例，使用者於電腦螢幕上看到的畫面便 是由「留言板View」負責產生，可能包含留言者、留言內容等等資訊，當使用者 於畫面中輸入留言內容並按下送出，「留言板View」便會把使用者輸入的資料傳 送到「留言板Controller」，此時便由「留言板 Controller」呼叫「髒話檢測 Model」

來判斷這筆留言內容是否含有不雅言詞，當「髒話檢測Model」運行完畢後便會將 檢測結果傳回「留言板Controller」，若判定無不雅言詞，則「留言板 Controller」

會呼叫「與資料庫溝通Model」，由「與資料庫溝通 Model」將該筆留言寫入資料 庫系統。

上述MVC 架構乃以開發者角度做系統剖析，若以使用者操作角度做分析，則 可將程式系統分為前台與後台兩部分，使用者可操作的所有介面都屬於前台，等

同於MVC 架構中 View 的部份，剩下使用者碰觸不到的部份便統稱為後台。

圖2-3 前後台運作流程 置來使用本系統，網頁系統平台使用的開發語言為jQuery Mobile

（http://jquerymobile.com/），jQuery Mobile 為建立在 jQuery 基礎上的一套函式庫，

能夠提供開發者使用原有的網頁開發技術來開發手機介面程式，而不需要另外學 習新的程式語言與建立新的開發環境，jQuery Mobile 提供內建的模組與函式庫讓