使用 CodeIgniter 創建一個簡單的 Web 站點


 

參考源自:

http://www.ibm.com/developerworks/cn/web/wa-codeigniter/index.html

我的第一個 CodeIgniter 項目(除HelloWorld外),現整理記錄下來。

 

相關環境:

  系統:ubuntu-10.04.3

  Apache:httpd-2.4.7

  PHP:php-5.4.22

  MySQL:mysql-5.6.16

  CI:CodeIgniter-2.2.0

 

目標:

  使用 CodeIgniter 創建一個簡單的 Web 站點。該站點將有一個主頁,顯示一些宣傳文本和一個表單,該表單將發布到數據庫表中。

  按照 CodeIgniter 的術語,可將這些需求轉換為以下內容:

  • 一個控制器,僅包含少數功能(也可使用默認的 Welcome 控制器)
  • 一個模型(以及一個數據庫表),用於存儲聯系人信息
  • 一個主視圖,包含一些支持

 

一、創建數據庫表和模型

  從模型入手可幫助理解底層數據庫表,之后再開始布設功能和 UI。如果對表將存儲哪些內容認識不深,設計與表交互的表單將十分困難。

  對於這個示例應用程序而言,希望存儲的是來自表單的聯系人信息。那么需要的是哪些類型的聯系人信息?目前而言,僅存儲基本信息,要求提供姓名、電子郵件地址、電話號碼和簡短備注。還可能希望在后台存儲時間戳和 IP 地址。

1. 創建數據庫表

cd /usr/local/mysql/bin
mysql -u root -p

然后輸入密碼(我這里為root),就進入了MySQL。

若要查看有哪些數據庫,可用命令: show databases;

若要創建數據庫,可用命令:create database Tina;(這里我創建了一個名為Tina的數據庫)
選擇要使用的數據庫:use Tina;(這里使用名為Tina的數據庫)

創建表contacts:

CREATE TABLE `contacts` (

  `id` int(11) NOT NULL auto_increment,

  `name` varchar(128) NOT NULL,

  `email` varchar(255) NOT NULL,

  `notes` text NOT NULL,

  `stamp` timestamp NOT NULL default CURRENT_TIMESTAMP on update CURRENT_TIMESTAMP,

  `ipaddress` varchar(32) NOT NULL,

  PRIMARY KEY  (`id`)

) ENGINE=MyISAM;

 

查看當前數據庫下的所有表的名稱:show tables;

查看contacts的表結構:desc contacts; 或者 show columns from contacts; 

查看表contacts中的數據:select * from contacts;

 

 配置:

application 文件夾中最重要的文件夾就是 config。該文件夾內有兩個需要關注的文件:config.php 和 database.php。

config.php 文件包含設置 CodeIgniter 所需的基本參數和自變量。database.php 文件包含連接數據庫所需的基本參數和自變量。

 

對於 config.php 文件,這里只需設置 base_url 參數,例如設置為 http://localhost/CodeIgniter_2.2.0/。

根據當前正在使用的服務器地址更改此設置為:

$config['base_url']    = 'http://localhost/CodeIgniter_2.2.0/'

務必牢記添加最后的斜杠,即便是在子目錄中設置 CodeIgniter 應用程序時也是如此。

 

下面打開 database.php 文件,為數據庫服務器設置 connection 參數:

$db['default']['hostname'] = "your-db-host";
$db['default']['username'] = "your-username";
$db['default']['password'] = "your-password";
$db['default']['database'] = "your-db-name";
$db['default']['dbdriver'] = "mysql";

例如:

     

2. 創建模型

  在 application/models 文件夾內,創建一個 contacts_model.php 文件。

代碼如下:

<?php 
class Contacts_model extends CI_Model{
    function __construct()
    {
        parent::__construct ();
    }
    public function add_contact()
    {
        date_default_timezone_set('UTC');
        $now = date("Y-m-d H:i:s");
$data = array( 'name' => $this->input->post('name'), 'email' => $this->input->post('email'), 'notes' => $this->input->post('notes'), 'ipaddress' => $this->input->ip_address(), 'stamp' => $now ); $this->db->insert('contacts', $data); } } /* End of file contacts_model.php */ /* Location: ./application/controllers/contacts_model.php */

  在上面代碼中,其實之前用到了$this->input->xss_clean() 來整理表單字段的數據,但是遇到了問題,即在提交表單后顯示了空白頁。目前還不清楚是什么原因,有待進一步研究。

二、初始化控制器

  在 CodeIgniter 中,控制器用於組織項目。設想每個函數都是站點或應用程序的一個頁面或目標。如果使用主頁,就需要一個 index() 函數。如果有一個 About us 頁面,就需要 about()about_us() 函數—— 具體取決於您希望怎樣構造 URL。

  甚至可以將控制器組織到文件夾中,創建層次結構。例如,在 system/application/controllers 文件夾中,可能有一個 admin 文件夾,其中包含針對管理工具各主要部分的控制器。可按照如下方法訪問這些控制器(和函數): http://www.example.com/admin/controller-name/function-name/。

  進入application/controllers/ 文件夾,新建一個contacts.php文件。(當然也可以使用默認控制器,即 Welcome 控制器。)

代碼如下:

<?php
/**
 * Contacts Class
 *
 * @author Tina
 */
class Contacts extends CI_Controller{

    function __construct()
    {
        parent::__construct();
    }

    function index()
    {
         $this->load->helper('form');
         $data['title'] = "Welcome to our Site";
         $data['headline'] = "Welcome!";
         $data['include'] = 'contacts_home';
         $this->load->vars($data);
         $this->load->view('contacts_view');
    }
};
/* End of file contacts.php */
/* Location: ./application/controllers/contacts.php */

設置可在視圖內部使用的多個變量——通過這種方法,即可更好地組織應用程序。例如,可能希望在控制器中設置標題和標題欄。如果要這樣做,就必須將變量載入視圖。所載入的變量之一就是所包含視圖的名稱。通過這種方法,即可設置包含所有外觀的主視圖,以及包含內容的各包含項。

上面代碼中$data 數組被傳入到一個視圖中(contacts_view)。數組內的信息可使用鍵名訪問,如果希望輸出標題欄,通過 $headline 訪問它即可。

接下來,將創建視圖,並完成控制器。

三、創建視圖

  在application/views 中的創建一個名為contacts_view.php的文件。

代碼如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title><?php echo $title;?></title>
<style>label { display:block;}</style>
</head>
<body>
<h1><?php echo $headline;?></h1>
<?php $this->load->view($include);?>
</body>
</html>

上面代碼傳入了三個變量:$title$headline$include(一個包含項的名稱)。

在前兩條php語句中,將分別顯示在 $data['title']$data['headline'] 中找到的數據。隨后使用 $data['include'] 的值載入第二個視圖。在本例中為一個名為 contacts_home的視圖(添加了少許 CSS 代碼)。其中包含一個文本塊和一個從站點訪問者處收集信息的表單:

contacts_home.php

代碼如下:

<p>This is random text for the CodeIgniter article. 
There's nothing to see here folks, just move along!</p>
<h2>Contact Us</h2>
<?php 
echo form_open('contacts/contactus');
echo form_label('your name','name');
$ndata = array('name' => 'name', 'id' => 'id', 'size' => '25');
echo form_input($ndata);

echo form_label('your email','email');
$edata = array('name' => 'email', 'id' => 'email', 'size' => '25');
echo form_input($edata);

echo form_label('how can you help you?','notes');
$cdata = array('name' => 'notes', 'id' => 'notes', 'cols' => '40', 'rows' => '5');
echo form_textarea($cdata);

echo form_submit('submit','send us a note');
echo form_close();
?>

 

這里使用的是 Form 幫助程序,將其載入控制器。form_open() 函數允許打開表單—— 它具有必要的自變量,即表單發布的目標位置。接下來,將返回控制器並添加 contact() 函數來處理表單發布數據。

在表單中,使用了 form_label() 來創建可訪問的標簽,使用 form_input()form_textarea() 來構建表單字段和文本區,使用 form_submit() 來構建輸入按鈕。這里,通過 form_input()form_textarea()(以及其他表單函數),就可以傳入一個信息數組,幫助跟蹤字段名稱、id、大小和其他信息。

最后,使用 form_close() 關閉表單。

 

再創建一個視圖文件contacts_thanks.php。

代碼如下:

<p>Thanks so much for contacting us. Someone will be in contact with you soon.</p>

四、完成控制器

  現在需要重新回到控制器contacts.php,為其添加兩個函數。

①處理主頁上的表單傳入的 POST 的 contactus() 函數。

thankyou() 函數,它將用作該表單的最終確認頁面。

contactus() 函數非常簡單。載入 contacts_model 模型,運行該模型內的 add_contact() 函數,然后將用戶轉向 thanks 頁面。請注意,要使用 redirect() 函數,必須載入 URL 幫助程序。

函數代碼如下所示:

    function contactus()
    {
         $this->load->helper('url');$this->load->model('contacts_model','',TRUE);
         $this->contacts_model->add_contact();
         redirect('contacts/thankyou','refresh');
    }

    function thankyou()
    {
         $data['title'] = "Thank You!";
         $data['headline'] = "Thanks!";
         $data['include'] = 'contacts_thanks';
         $this->load->vars($data);
         $this->load->view('contacts_view');
    }

 

五、添加安全性

  在控制器的 contactus() 函數中,有着在數據庫中創建多條空記錄的風險—— 這會導致某人連續將聯系人目標載入其瀏覽器或使用某種類型的機器人。要避免此類情況發生,最簡單的方法就是在控制器中添加簡單的測試。如果存在 POST 數據,則載入模型和函數。如果沒有,則將其返回主頁。

修改后的函數如下所示:

  function contactus()
   {
         $this->load->helper('url');
         if ($this->input->post('email'))
         {
               $this->load->model('contacts_model','',TRUE);
               $this->contacts_model->add_contact();
               redirect('contacts/thankyou','refresh');
         }
         else
         {
               redirect('contacts/index','refresh');
         }
    }

結束語

     

  至此,就創建了一個包含主頁、將信息添加到數據庫的表單和 thanks頁面的 Web 站點。

  當然,要學習的東西還有很多。例如,可自動加載所需的模型和任何幫助程序或庫;可以為應用程序調整緩存和性能;可以為視圖添加更多 CSS 內容;可以添加在數據庫插入操作結束后發送電子郵件通知的功能。

  加油!

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM