圖片顯示和 Page 頁(yè)面

接著上一章節(jié)的看，我們現(xiàn)在的程序有了第一個(gè)主頁(yè)面，但是我們會(huì)發(fā)現(xiàn)幾個(gè)問題，一個(gè)是主頁(yè)上的圖片沒法顯示，二是點(diǎn)擊 read more ... 之后的鏈接沒有內(nèi)容。

這兩個(gè)頁(yè)面的入口分別是下圖里面的兩個(gè)框出來(lái)的內(nèi)容。

我們先來(lái)看圖片顯示的頁(yè)面；

Resize_image.php

我們注意到其實(shí)這個(gè)鏈接的完整 URL 是： resize_image.php?image=...&max_width=...&max_height=...;也就是說這個(gè)鏈接有 3 個(gè)參數(shù)： image 是圖片的名稱，max_width 和 height 分別對(duì)應(yīng)圖片的寬和高。那么我們?cè)谶@個(gè)頁(yè)面我們?cè)撊绾翁幚砟兀?/p>

這是 resize_image.php 的完整代碼，將原始的圖片大小根據(jù)我們頁(yè)面輸入的 width 和 height 來(lái)進(jìn)行壓縮或者放大，然后重新生成一張新的圖片，用于顯示在頁(yè)面上。

接下來(lái)我們來(lái)看 page.php 頁(yè)面

page.php

因?yàn)辄c(diǎn)擊 page 頁(yè)面其實(shí)相當(dāng)于打開了 3 個(gè)不同類型的 blog 內(nèi)容的詳細(xì)頁(yè)面，所以我們肯定是需要到數(shù)據(jù)庫(kù)里面進(jìn)行 select 操作的。

上一篇里面有講解過，我們只需要改變中間的顯示內(nèi)容，所以在第 10 行和第 47 行，我們分別引入了 header.php 和 footer.php ，中間的內(nèi)容我們通過數(shù)據(jù)庫(kù)查詢以后再顯示出來(lái)。

我們展示 page 頁(yè)面的時(shí)候，可能有時(shí)候是用戶點(diǎn)擊了某一條 story，這時(shí)候參數(shù)里面會(huì)有 story，傳入的是故事的 id；或者可能是某一類的只有 page 字段，所以根據(jù)參數(shù)中有沒有 story，我們來(lái)決定我們的 select 該怎么寫。

但是無(wú)論如何，我們最后得到的都是這樣的表結(jié)構(gòu)：

我們?cè)賮?lái)回顧下 stories 表的建立過程：

注意看到 id 字段不僅僅是 primary key，而且它還是 auto_increment 屬性，在 MySQL 里面，auto_increment 就是自增字段，每次插入數(shù)據(jù)時(shí)，會(huì)自動(dòng)查詢當(dāng)前序列的最大值，然后加 1，

大家看我的 stories 表中存的所有內(nèi)容，1-7 都是我們通過教材手動(dòng) insert 進(jìn)去的，然后會(huì)發(fā)現(xiàn)接下來(lái)就是 11 了，而并沒有 8，9 和 10 ，是因?yàn)槲以陂_發(fā)過程中進(jìn)行了插入和刪除操作，我把 id 為 8，9，10 的記錄刪除了，所以在表中沒有顯示，但是即便這時(shí)候你的表里面最大的 id 是 7，他的記錄也會(huì)插進(jìn)去 11，也就是說這個(gè)自增的序列是獨(dú)立于當(dāng)前的表的，和 oracle 的自增序列一樣，但是我不太清楚 mysql 里面的自增序列和 oracle 有哪些區(qū)別。

oracle 中的自增序列的建立方法是：

CREATE SEQUENCE "SEQ_ID" MINVALUE 1 MAXVALUE 999999999999 INCREMENT BY 1 START WITH 1 CACHE 10 NOORDER NOCYCLE;  

然后使用的時(shí)候就直接 insert .... values(seq_id.nextval)就相當(dāng)與插入了下一個(gè)自增序列的下一個(gè)值，所以在 oracle 里面可以有好幾個(gè)自增序列，但是不太清楚 MySQL 里面自增序列這塊是怎樣的，目測(cè)是只有一個(gè)公用的自增序列。

好了我們回歸正題，在 while 循環(huán)體內(nèi)，我們能看到每個(gè)故事是由 4 部分組成的，

27 行：

顯示每篇 story 的 headline，

29-35 行：

根據(jù)存儲(chǔ)的 picture 名稱來(lái)顯示出圖片，使用的方法仍然是我們上面提到的 resize_image.php

36-41 行：

這里我們需要用到 db_fns.php 中的新的函數(shù)：

把下面的函數(shù)添加進(jìn) db_fns.php 中，這個(gè)函數(shù)很簡(jiǎn)單，就是把當(dāng)前 sotry 的 writer 信息找到。

然后顯示文章修改的時(shí)間：

這里在數(shù)據(jù)庫(kù)里面存儲(chǔ)的是 10 位的時(shí)間戳形式的，顯示的時(shí)候 根據(jù)格式做一下轉(zhuǎn)換就好了：

date('M d, H: i', $story['modified']);  

44 行

顯示故事的主題內(nèi)容。

好了，這樣我們就能看到界面上的圖片，然后也能點(diǎn)擊主界面上的大部分按鈕了。

下一章節(jié)我們來(lái)進(jìn)行用戶登錄，然后新增文章等操作。

本文由 kaka 創(chuàng)作，采用 知識(shí)共享署名-相同方式 3.0 (CC協(xié)議)中國(guó)大陸許可協(xié)議 進(jìn)行許可。轉(zhuǎn)載、引用前需聯(lián)系作者，并署名作者且注明文章出處。