第 16 章交友網站的設計

第16章交友網站的設計 • 16-1 交友網站的基礎 • 16-2 訪客留言簿 • 16-3 BBS電子佈告欄 • 16-4 票選系統 • 16-5 使用者清單聊天室

16-1 交友網站的基礎 • 16-1-1 訪客留言簿 • 16-1-2 聊天室 • 16-1-3 票選網調系統

16-1-1 訪客留言簿 • 「訪客留言簿」（GuestBook）是常見的Web表單應用，類似News或BBS討論區，可以提供網友一個發表言論的地方。在訪客留言薄會依序顯示訪客訊息，如果想參與留言，只需在Web表單輸入基本資料和留言內容，就可以發表個人意見參與留言。 • 訪客留言簿提供網友和網站間的溝通橋樑，更是大家發表高論的管道，只需結合第14章的網頁電子郵件，還能建立一對多（副本郵件）或一對一的互動功能。

16-1-2 聊天室 • 網路交友最常發生的地方是無所不談的網路聊天室（Chat Room），一般來說，聊天室都有指定的聊天主題，登入使用者能夠進行多人的同時討論，在聊天室顯示的訊息是所有參與使用者都可以看到，每一個訊息可以指出是屬於誰的意見。 • Web介面聊天室受限於HTTP通訊協定的特性，並無法即時看到張貼訊息，只能在指定更新周期來更新聊天訊息。不僅如此，大多數聊天室不能顯示線上使用者清單，或傳送私人訊息來提供個人的交友管道。

16-1-3 票選網調系統 • 線上投票、民調或考試系統都屬於類似的網站功能，顧名思義它可以在網站提供票選園地，要求網友選擇意見，並且進行網友票選的統計。 • 不論是線上投票、民調或考試系統都是一種選擇題，我們可以使用資料庫儲存問題答案和網友的投票記錄，票選統計只是統計資料表的記錄和顯示統計結果。本章範例網站的票選系統，網友可以選擇記名或不記名票選，如果記名就需要輸入電子郵件地址。

16-2 訪客留言簿 • 16-2-1 資料庫版的留言簿 • 16-2-2 System.IO版的留言簿

16-2-1 資料庫版的留言簿-建立步驟 • 在實作上，訪客留言簿可以使用資料表儲存留言，以ASP.NET技術來建立資料庫版的訪客留言簿，其步驟如下所示： • 使用Access建立訪客留言的資料庫Guestbook.mdb。 • 使用ASP.NET建立訪客留言薄，提供Web表單輸入留言訊息，並且顯示資料表儲存的留言內容。 • 建立電子郵件表單，使用System.Net.Mail名稱空間寄送郵件給留言者。

16-2-1 資料庫版的留言簿-訪客留言資料表GuestBook • 訪客留言資料表GuestBook儲存使用者留言，其欄位如下表所示：

16-2-1 資料庫版的留言簿-新增留言 • 在建立好訪客留言薄資料庫後，ASP.NET程式DbGuestBook.aspx整合Web表單讓網友輸入留言，並且在Web表單後顯示GuestBook資料表其他訪客新增的留言記錄。

16-2-1 資料庫版的留言簿-檢視留言 • 留言後稍等一下，就可以重新回到ASP.NET程式，在表單下方顯示新增的留言，如下圖所示：

16-2-2 System.IO版的留言簿 • 留言簿也可以使用文字檔案儲存留言的HTML標籤，在Web表單後顯示文字檔案內容，也就是其他訪客的留言內容。

16-3 BBS電子佈告欄 • 16-3-1 BBS電子佈告欄的基礎 • 16-3-2 建立BBS電子佈告欄

16-3-1 BBS電子佈告欄的基礎-說明 • BBS電子佈告欄是資料庫版留言簿的擴充，因為BBS是一種討論園地，提供多主題的留言簿，稱為留言板或討論區。 • BBS的討論功能允許回應使用者留言來進行討論，不同於留言簿只能讓大家留下意見，BBS還可以使用電子郵件讓參與討論的使用者相互進行私下討論，或在聊天室進行線上通訊。簡單的說，它是整合留言簿、網頁電子郵件和聊天室的Web應用程式。

16-3-1 BBS電子佈告欄的基礎-BBS留言板資料表 • BBS留言板資料表儲存BBS目前開放的留言板，其欄位如下表所示：

16-3-1 BBS電子佈告欄的基礎-BBS的留言訊息資料表 • BBS留言訊息資料表是儲存BBS留言，其欄位如下表所示：

16-3-2 建立BBS電子佈告欄 • 在Access建立好上一節的資料庫後，就可以使用ASP.NET技術來建立BBS電子佈告欄，其步驟如下所示： • 在BBS站新增第13章的會員管理，因為參與BBS討論的使用者需要先註冊成為會員。 • 當登入BBS站後，使用網路商店的產品目錄功能，顯示留言板清單，在選擇留言版後，顯示各板的留言標題。 • 請使用第10-7節的主要與詳細表單，在上方表單顯示留言標題清單，按一下留言標題，就可以在下方表單顯示留言的詳細內容。 • 對於每一個留言，都提供回應功能可以參與討論，或是提供電子郵件表單寄送電子郵件給留言者。 • 在BBS站加上16-5節的聊天室功能提供線上即時討論。

16-4 票選系統 • 16-4-1 網站的安裝與使用 • 16-4-2 網站的架構 • 16-4-3 網站的檔案清單

16-4 票選系統 • 票選系統網站也是網頁資料庫應用，類似的應用領域有網路民調和線上考試系統。網頁票選系統能夠新增票選題目和票選答案，或是參與投票表達使用者意見和顯示票選的統計結果。 • 在票選系統提供二個步驟的表單新增票選題目，題目可以為是非題或至多5個答案的選擇題，而且可以選擇網友是否需要輸入電子郵件地址，如果需要，就會額外檢查IP位址是否重複。換句話說，同一個IP位址對於票選題目只能投一票。

16-4-1 網站的安裝與使用 • 票選系統網站是一個Web應用程式，可以作為單獨網站或社群網站的一部分，使用關聯式資料庫儲存票選題目和使用者的投票記錄。 • 票選系統網站的安裝只需將光碟「Ch16-4」資料夾中的所有檔案都複製到網站的主目錄，或是建立成虛擬目錄，就可以啟動瀏覽程式執行網站，其首頁是Polls.aspx。

16-4-2 網站的架構-檔案架構 • 票選系統網站是使用GridView控制項的表格顯示票選題目、提供者和有多少使用者參與投票，使用者只需按表格每一列的超連結，就可以參與投票或檢視票選結果。 • 票選系統網站的主目錄是「Ch16-4」，所有網站檔案都是儲存在同一個「Ch16-4」目錄。

16-4-2 網站的架構-資料庫架構1 • 票選系統網站是使用Access資料庫Polls.mdb來儲存票選資料，擁有2個資料表Poll和PollResults。首先是儲存票選題目和答案的Poll資料表，如下表所示：

16-4-2 網站的架構-資料庫架構2 • PollResults資料表儲存使用者的票選結果，每一位使用者投一次票就是一筆記錄，內含投票選擇、電子郵件地址和IP位址，如下表所示：

16-4-2 網站的架構-資料流架構1 • 票選系統網站的資料流架構分成兩個部分：第一個部分是參與投票和檢視票選結果，如下圖所示：

16-4-2 網站的架構-資料流架構2 • 第二個部分資料流是新增票選題目，如下圖所示：

16-4-3 網站的檔案清單 • 票選系統網站套用Polls.master主版頁面和使用web.sitmap檔案來建立主選單，一共擁有5個ASP.NET程式檔案。 • Polls.aspx • JoinPoll.aspx • ViewPoll.aspx • AddPoll.aspx • AddPoll1.aspx

16-5 使用者清單聊天室 • 16-5-1 網站的安裝與使用 • 16-5-2 網站的架構 • 16-5-3 網站的檔案清單

16-5-1 網站的安裝與使用 • 使用者清單聊天室網站是獨立Web應用程式，可以作為單獨網站或社群網站的一部分，以文字檔案（每一個聊天室一個）來儲存聊天訊息。 • 請將光碟「Ch16-5」資料夾的所有檔案都複製到網站主目錄，或建立成虛擬目錄，就可以啟動瀏覽程式執行使用者清單聊天室，其首頁是Default.aspx。

16-5-2 網站的架構-檔案架構 • 使用者清單聊天室網站的每個聊天室是一頁框架頁，允許使用者參與聊天、顯示目前或其他聊天室的使用者清單和傳送私人訊息。 • 為了避免使用者忘了登出聊天室，就算沒有按【離開聊天室】超連結登出聊天室，也沒有關係，使用者只需離開聊天室網頁一段時間，即超過更新頻率的最大秒數，或是Session期間過期了，系統都會自動強迫使用者登出聊天室。 • 使用者清單聊天室網站的主目錄是「Ch16-5」，擁有子目錄RoomFiles儲存ChatRooms.xml和聊天室檔案，網站ASP.NET程式等相關檔案是在「Ch16-5」目錄。

16-5-2 網站的架構-框架頁架構 • 使用者清單聊天室網站的聊天室是一頁框架頁，框架頁ChatRoom.aspx上下分成三個部分，如下圖所示：

16-5-2 網站的架構-資料流架構 • 使用者清單聊天室網站的資料流架構是在聊天室的框架頁本身，如下圖所示：

16-5-3 網站的檔案清單 • 聊天室網站的部分ASP.NET程式是套用Chats.master主版頁面和使用web.sitmap檔案來建立主選單。網站擁有web.config檔案指定中文編碼、Global.asax檔案和多個ASP.NET程式檔案。 • Global.asax • Default.aspx • ChatRoom.aspx • ChatTitle.aspx • ChatLogout.aspx • ChatInput.aspx • ChatMessage.aspx • UsersList.aspx • PrivateMsg.aspx • AddRoom.aspx • LogoutUser.aspx • LogoutAll.aspx

第 16 章 交友網站的設計