利用CodeIgniter建立簡單的MVC架構範例 (更新至CI2)
[圖片來源: CodeIgniter.com]
CodeIgniter是一套簡單、快速的PHP Framework，因為採用MVC的概念，所以能讓中、大型網站專案的架構變得漂亮乾淨許多，最近有空又開始試玩它，建議剛入門的同學可以先到官網跟著教學影片run幾次，尤其是20分鐘建立Blog的例子，實際跑過幾次流程，認識一下Controller跟View之間的互動方式。
耶，為什麼只提到Controller跟View呢？Model呢？是的，那個範例並沒有使用到Model，它是將取得資料的動作，直接寫在Controller了。其實寫CodeIgniter，並不用強制一定要M、V、C都使用，如果網站很單純，只要有C (只要有心…)，V跟M都能被實作在C裡。跑過教學影片的同學一定有印象，Controller就是一堆PHP的Class，一個繼承Controller類別的Class，本身就像是一頁網頁，使用echo的方式就能達到View的效果，而在Controller直接呼叫像是 $this->db->get(‘db_table_name’)的語法就能取得資料庫的資料了，就像範例那樣。
雖說Controller似乎能控制一切，但使用MVC架構的目的本來就是不想全部的code都搞成一沱，所以我們先來看看一個簡單的MVC例子，M,V,C都用。現在請先確定已經把CodeIgniter抓下來，並且放在Server目錄內了。
好的，首先我們先建立資料庫的資料，一切從簡，以下是SQL script，請先建立一個名為ci_sample的資料庫，再執行以下SQL建立一個名為guestbook的資料表，欄位有id, name, comment，最後會再建立兩筆記錄:
-- -- 資料庫: `ci_sample` -- -- -------------------------------------------------------- -- -- 資料表格式： `guestbook` -- CREATE TABLE IF NOT EXISTS `guestbook` ( `id` int(16) NOT NULL AUTO_INCREMENT, `name` varchar(64) CHARACTER SET utf8 COLLATE utf8_unicode_ci NOT NULL, `comment` text CHARACTER SET utf8 COLLATE utf8_unicode_ci NOT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ; -- -- 列出以下資料庫的數據： `guestbook` -- INSERT INTO `guestbook` (`id`, `name`, `comment`) VALUES (1, 'mrmu', 'hi,I''m here!'), (2, 'david', 'I''m david!');
在使用資料庫前，請先開啟application/config/database.php，輸入資料庫相關設定：
// ... 略 ... $db['default']['hostname'] = 'localhost'; $db['default']['username'] = '請輸入DB帳號'; $db['default']['password'] = '請輸入DB密碼'; $db['default']['database'] = 'ci_sample'; //自訂的DB $db['default']['dbdriver'] = 'mysql'; $db['default']['dbprefix'] = ''; // ... 略 ...
再來撰寫自訂的Controller類別部份，請注意，Controller的命名規則是：檔名跟類別名要一樣使用小寫英文，但類別的字首要大寫。本例是是取名為blog，所以檔名是blog.php而類別名則是Blog。請在application/controllers目錄下建立blog.php，內容如下:
class Blog extends CI_Controller
{
function __construct()
{
parent::__construct();
}
function index()
{
$data['title'] = "頁面標題";
$data['heading'] = "CI2測試中";
//$data['query'] = $this->db->get('guestbook'); // A
$this->load->model('blog_model'); // B
$data['query'] = $this->blog_model->getdata(); // C
$this->load->view('blog_view', $data); // D
}
}
可以看到我們把資料都放進data陣列裡 (不管是靜態的，還是動態從DB讀出來的)，而放在data陣列中的名稱，稍後就可看到在view中，我們直接拿來當成變數名稱使用。為什麼呢？因為在D行，我們在load view時，把$data一併丟進blog_view裡頭了。(例如：$data['title'] 就可以用 $title 來存取，$data['query']就可用 $query 來使用。)
其中標示A的那行，就是官網的教學影片使用的方式，直接在Controller取得資料庫的資料，我們希望把這個動作交給Model類別來做，所以我們先把它註解掉，以B,C行來取代它，即是使用load->model的方式，把載入資料的事交給blog_model這個類別，而接著再使用blog_model裡的getdata()來取得資料。(稍後會再說明Model的建立，這裡請先注意，在此我們的Model命名規則與Controller一樣，我們建立一個Model叫blog_model，檔名是blog_model.php，類別名為Blog_model)
對了，要記得載入database函式庫，讓我們能使用db相關的函式。要載入database這個函式庫，您可以像本範例一樣設定成自動啟用，作法是直接開啟application/config/autoload.php ，找到此行：
$autoload['libraries'] = array();
將它改成：
$autoload['libraries'] = array('database');
這樣就行了。您也可以用手動的方式在您自訂的Controller類別中加進：
$this->load->database();
您可以加在呼叫$this->db->get(‘entries’); (即是取得資料表的語法)之前，最好是放在建構子中，這樣可叫用的範圍比較廣。不過建議還是使用像範例一樣自動載入的方式，您也就不用在Controller裡面額外加上load database的指令了。
接下來我們就來看看blog_model這個類別要怎麼寫。
請在system/application/models目錄下建立blog_model.php，因為我們只是要驗證一下，所以內容非常簡潔，如下：
class Blog_model extends CI_Model
{
function __construct()
{
parent::__construct();
}
function getdata()
{
$query = $this->db->get('guestbook');
return $query;
}
}
很簡潔吧，好，接下來就是把View的部份也建立起來，請到application/views目錄建立blog_view.php，內容如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-TW">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<?php
//輸出從Controller傳來的heading變數
echo '<h1>'.$heading.'</h1>';
//輸出透過Controller及Model的處理，從DB取出的資料
foreach($query->result() as $row)
{
echo '<h3>'.$row->name.'</h3>'; // 讀出title欄位的資料
echo $row->comment; // 讀出body欄位的資料
echo '<hr />';
}
?>
</body>
</html>
基本上，View就是一堆Html語法加上輸出一些PHP的變數，如此就完成了我們的MVC架構簡單範例了。要觀看結果，請在瀏覽器輸入網址：http://localhost/ci2/index.php/blog (請注意，其中的ci2請變更成您安裝codeigniter的目錄名稱)。
輸出結果：
CI2測試中
mrmu
hi,I’m here!
david
I’m david!
*注意，如果出現了 Message: Undefined property: Blog_model::$db 就表示您沒有載入database這個函式庫，請參考上述作法加載。
CodeIgniter官網：http://codeigniter.com/
CodeIgniter官方教學影片：http://codeigniter.com/tutorials/
相關文章:
2 則回應給 利用CodeIgniter建立簡單的MVC架構範例 (更新至CI2)
Thanks for your sharing.
Pingback: CodeIgniter 記錄 | 沉睡的貓