MVC架構 - HUOCALM BLOG : 和康顧問部落格

Table of Contents

什麼是 MVC?

在軟體或應用程式開發中，對於「關注點分離(Separation of concerns, SOC)」這個名詞一定不陌生。SOC 是指把整個應用程式依照程式的該念、目的去做切割，讓每個區塊可以依照關注點去開發，最後再將它們加以合併。其好處為 :

1. 只需要專注於一個焦點上，不需被不同程式區塊的概念所分心
2. 只需要專注於一個焦點上，不需要到分散的檔案中做修改
3. 將複雜性高的程式碼轉變為簡潔且可讀性高的程式碼
4. 修改檔案時所耗費的成本大幅降低，可維護性、開發效率有所上升

然而，將 SOC 的概念落實於軟體架構上，就出現了一個新的軟體架構 – MVC。

MVC 是一種設計模式(design pattern)，其一目的是將內部運作區分成不同區塊，讓每個區塊負責不同的關注點；另一目的則是簡化應用程式的開發。MVC 是由三大元件組成的，如下:

Model(模型)負責資料處理、商業邏輯，且具有對資料直接存取的權力，也就是說能和資料庫進行溝通與存取。

View(視圖)就是畫面的呈現，將從 Model 拿到的資料藉由 HTML template 顯示於 UI 介面上。一般來說，在 View 中是沒有程式上的邏輯。

Controller(控制器)負責控制應用程式的工作流程和收發 request / response，可以把 Controller 視為 MVC 架構的中間人，控制整個流程並收集不同元件的結果，統一回傳給使用者。

然而，在 Controller 上通常會設置許多不同的 action。當使用者觸發某個 action 時，就會觸發相對應的行為。

我們以一個例子來說明 MVC 架構的運作原理 :

當使用者使用瀏覽器打上 Google 的網址並登入帳號時會發送一個 request 的請求，此時最先遇到的是 router 裡的路徑表(route)，藉由路徑表進行對照。如果在對照表裡找不到的話，則是回傳 HTTP 404
比對完成後，會給出相對應的 Action，此時 Controller 上的 Action 將會觸發後續的行為。以這邊例子為例，這個 Action 需要「登入 Google 帳號」，Controller 會請 Model 幫忙抓取帳號的資料並驗證
Model 會透過 SQL 語法直接和資料庫溝通並完成先前的要求
Model 取完資料後便會回傳給 Controller
雖然拿到資料了，但也不可能直接拿給使用者看，因為這些資料還未經過美化、排版與整理，因此需要從 View 裡調用 template(HTML/CSS/Javascript)
將從 Model 那邊拿到的資料與 View 裡生成的畫面做結合，再回傳給 Controller，最後就直接呈現在使用者的畫面上了