本篇作為第七篇，也是第一週的結尾，
我們將介紹網頁中常被忽略的細節，header status 。

想知道網頁常見的 404 、500、403 等數字是什麼嗎？
想知道還有什麼更多的秘密藏在 status 裡面？ 那看這篇這就對了唷。:)

--------系列簡介--------
網站系統可說是現在最多學子與新人想要入門的一個領域，
這個原本屬於新興的領域，這幾年來也累積許多年的知識與 pattern ，
在有限的環境（stateless）與有限的伺服器端、瀏覽器資源下，
成為許多人進入程式的一塊入門鐵板(?)。

這個系列希望能夠就網站系統設計幾個門檻著手，
這是設定給初心者作為學習，給同好們作為回顧，

重新認識有關網站系統的每個環節。
有時候寫文章或者辦活動，常常有感於時間的快速啊，
本篇作為第一週最後一篇，就份量而言也相對輕，有點算是中場休息（笑）。

不過有別於前幾天的龐雜內容，讀者或許可以鬆口氣，看看一些網頁上的小品資訊。

今天我們主要要介紹的是網頁上的幾種狀態，
這些狀態對一個網站系統而言，是很重要的。

＠ 網頁狀態？是讀取中、讀取結束這種狀態嗎？

不，我們說得不是這種網頁讀取過程的狀態，

我們說的是一個網址在一個網站伺服器中，
執行結束後，伺服器回應我們的 html 時一併告訴我們的狀態。

＠ 咦？不是給一個網址，存取一個網頁，就這麼簡單而已嗎？

正常的情況的確是如此，但假設今天有這樣一個情境，
如果您今天存取一個網址，這個網址原本存在，

後來因為更改命名或檔案名稱，導致網頁不存在。

這時候我們會希望伺服器負責任地，告訴瀏覽器說這網頁不存在，
讓瀏覽器存取時能明白發生什麼事情，而提示使用者。

像這個例子，當 Chrome 瀏覽器發現網址不存在時，預設的回應畫面：

＠ 可是我更常看到的不是這個畫面，而是像這個畫面耶？

對，之前的例子主要是出現在當網站伺服器沒有回應時，

一般而言我們都會像這個例子回傳網頁找不到（404 Not found）與對應的自訂錯誤頁面給瀏覽器，
藉此讓瀏覽器知道 web server 存在，但是這個網址對應到的內容並不存在。

也因為我們要回應不同的內容，所以瞭解不同的狀態碼（status），
以利知道要設計無法存取的畫面給瀏覽器就很重要囉。

當然，相信冰雪聰明的您也知道 404 就是無法存取網頁的狀態碼囉！

上圖是 apache 這個網頁伺服器預設的 404 頁面，相信大家應該不陌生才是。

好的 404 頁面，通常會引導使用者到可能有他們需要的資訊的地方，
像是天瓏書局的 404 頁面就設計的很可愛，並且親切的導引使用者到首頁瀏覽更多資料。

讀者可以自己前往看看
http://www.tenlong.com.tw/the_url_not_found

＠ 除了網頁找不到以外，我還需要處理其他狀態嗎？

其實還有蠻多種狀態需要處理的，維基上有詳細的列表
http://en.wikipedia.org/wiki/List_of_HTTP_status_codes

底下簡單列出筆者工作經驗中比較常接觸到與為他做處理的狀態：

頁面狀態：
200 伺服器正常回應，一般正常狀況下應該是這個。
404 網頁找不到，通常需要設計頁面。
403 您沒有存取頁面所需要的權限（常見於管理後台），設計權限控管時常用。
500 伺服器發生內部錯誤（網址正確但資料庫在未知的情況下掛掉的。），例外處理時常用。
503 服務目前無法使用。（如已知資料庫掛掉正在處理中跟 500 的差別在於一個是未知例外，一個是有在預期中的狀態。）

轉址(redirect)狀態
301 永久性頁面轉址
302 暫時性頁面轉址

快取狀態
304 網頁沒有改變。

＠ 呃，可是維基上有一堆狀態耶？

對，不過比較常用的其實是這些，當然如果您想實作更多狀態也無妨。

＠ 什麼是轉址呢？

轉址狀態比較特別，是頁面轉址時需要的，

假設我一開始是到 http://tonyq.org/test1.php ，但是我在 test1.php 裡面進行判斷，
發現其實使用者應該去 http://tonyq.org/test2.php ，這時候就需要轉址（redirect）的行為。

test1.php 應該要回傳轉址的狀態碼，並且告知目標為 test2.php 。

此時瀏覽器會先後詢問 test1.php ，之後透過狀態碼瞭解應該要去 test2.php ，
最後正確無誤的存取 http://tonyq.org/test2.php 的資料。

＠ 302 與 301 的差別在哪呢？

302 暫時性頁面跳轉

一個是像是登入後的頁面跳轉，這種比較屬於 302 ，
暫時性而非永久性的跳轉，也有可能因為不同條件跳轉不同頁面。

php 實作例子

<?php header('Location: http://tonyq.org/the_new_url', true, 302);  ?>

301 永久性頁面跳轉

舊資料可能更名，像是 test1.php 換名字變成 test5.php ，
所以我們常常會設計成當使用者存取 test1.php 時，自動轉向 test5.php 。

此時就應該使用 301 永久跳轉，
來讓瀏覽器跟搜尋引擎瞭解，test1.php 已經不再被使用了。

php 實作例子

<?php header('Location: http://tonyq.org/the_new_url', true, 301);  ?>

＠ 有什麼我應該要注意的呢？

如果你只考慮要給使用者看得頁面，狀態是 500 或者 200 基本上沒差的。

大概只有一些第三方的服務，如 search engine 、ajax 等，
會依賴狀態碼進行判斷作
但是不同的狀態碼對於 Search Engine 就有很大的影響，

像是如果 search engine 看到 503 ，他可能會之後儘快再回來處理一次頁面。

有許多網站常常會明明畫面顯示是 404 或 500 的畫面，
但狀態碼卻是 200，明明是過期資料的轉址，卻呈現 302 。

這些都會造成搜尋引擎的誤會，對所謂的搜尋引擎最佳化（SEO）也會有不好的影響。

像是明明就不存在的網址，卻被當成一般正常網址被索引到搜尋引擎，
這也是件很糟糕的事情。

今天的介紹就先到這裡，有關 header 的秘辛還有很多，
像是快取（cache）、壓縮格式（gzip）、來源網址（refer）等等。

以後談到時，我們會再介紹的。:)

第一週我們介紹的是網頁一些基本的環境基礎知識，在我們正式進入系統設計之前，
總是要明白我們手上能用的組件是什麼，所以我們用了一整週講了很多基礎的基本常識。

有些人跟筆者反應這些有點太基本過頭了，但是就筆者的前端開發經驗裡面，
其實說真的，許多的問題都是從基本功的不紮實所造成的，
所以當自己有機會寫文章時，就不得不從基本開始說起。:)

當然，篇幅有限、時間有限、主題有限，
所以沒辦法講進所有環節，寫起來就有些太過於複雜。（實在是求好心切啊～:P）

下一週開始我們將專注於資料庫（以mysql 為例）的基本操作，
我要出門吃烤肉了（笑），明天見。:)