投稿類別:資訊類

Size: px

Start display at page:

Download "投稿類別:資訊類"

老谅成
5 years ago
Views:

1 投稿類別 : 資訊類篇名 : 打造一個簡易的留言板使用 ASP.NET 作者 : 吳宗儒高雄市立高級工業職業學校資訊科二年級指導老師 : 陳彥良老師

2 壹前言一研究動機在網路上, 我們可以看到許多的網站上都設有一個留言版, 而這個留言版設置的用意就是為了能了解使用者的想法, 若我們要自己製作出一個留言版, 應該要如何製作與設計? 在這邊我們採用了 ASP.NET 搭配 Visual Studio 的整合開發環境, 來開發我們的留言版二研究目的 1 了解如何使用 VB 來寫 ASP.NET 2 了解 ASP.NET 的控制項使用方法 3 了解如何讀取 SQL Server 的資料以及新增與更新三研究方法 ( 一 ) 研究架構 1 準備: 文獻探討以及開發環境準備 2 畫面設計: 設計程式顯示畫面 3 程式設計 : 將畫面以及功能寫進程式, 並進行偵錯 4 問題討論 : 探討該系統上的優缺點 ( 二 ) 研究工具 1 硬體 : 個人電腦 2 軟體 :Visual Studio 2008 SQL Server Express 2005 貳正文一 ASP.NET ( 一 ) ASP 與 ASP.NET 介紹 ASP( 全名為 Active Server Pages), 是微軟公司旗下的產品, 搭配該公司的 IIS(Internet Information Server) 使用新一代的 ASP 改名為 ASP.NET, 由 1

微軟在.NET Framework 中所提供開發 Web 應用程式的類別庫 ASP.NET 是 ASP 技術的後繼者, 但它的發展性要比 ASP 技術要強大許多 ( 維基百科 ) 圖 2-1.NET Framework 3.5 內所包含的各種技術 ( 紅框為 ASP.NET) ( 二 ) 為何採用 ASP.NET 在上一段有提到 ASP.NET 是架構在微軟.

3 微軟在.NET Framework 中所提供開發 Web 應用程式的類別庫 ASP.NET 是 ASP 技術的後繼者, 但它的發展性要比 ASP 技術要強大許多 ( 維基百科 ) 圖 2-1.NET Framework 3.5 內所包含的各種技術 ( 紅框為 ASP.NET) ( 二 ) 為何採用 ASP.NET 在上一段有提到 ASP.NET 是架構在微軟.NET Framework 中, 在目前學校的課程中, 只有教到 Visual Basic, 而 ASP.NET 支援 Visual Basic, 可以免去我們重新學習語言的困擾, 因此採用 ASP.NET 二開發環境與資料庫環境 ( 一 ) 程式開發環境我們採用 Visual Studio 2008 作為我們的開發環境由下圖 ( 圖 2-2) 可以看到,ASP 網頁其實跟 Windows 表單的設計介面很類似, 唯一不同的是 : 表單中控制項可以隨意指定放置位置, 在網頁上僅能一排一排的照順序放置, 若要達到較複雜的版面還必須搭配 div 標籤或是表格才能達成 2

SQL Server Management Studio Express 來管理我們的資料庫圖 2-3

4 圖 2-2 Windows 表單設計與 ASP 網頁設計比較 ( 二 ) 資料庫環境在資料庫方面, 我們採用了 Microsoft SQL Server 2005 Express 並搭配 Microsoft SQL Server Management Studio Express 來管理我們的資料庫圖 2-3 SQL Server Management Studio Express 操作畫面三資料庫建置 ( 一 ) 資料表結構 3

5 在資料庫方面, 我們建立了一個資料庫, 這個資料庫中包含了兩個資料表 ( 如下圖 2-4), 一為 GuestBook 用於儲存留言資料, 二為 Config 用於儲存設定資料庫 GuestBook 資料表 dbo.guestbook 資料欄位與資料 No Title Time UserName Avatar Text Reply 資料表 dbo.config 資料欄位與資料 Name Value 圖 2-4 資料結構圖四程式設計在程式設計方面, 我們採用 Visual Studio 2008 作為我們的工具, 使用的程式語言為 Visual Basic ( 一 ) 讀取資料庫資料在.NET Framework 中的 System.Data.SqlClient 這個命名空間提供許多物件, 這些物件可以協助我們連線至 SQL Server 並取得資料, 以下為程式流程 : 4

6 建立連線在 S 建立連線讀取資料關閉連線圖 2-5 讀取資料庫流程 Dim Conn As New SqlConnection("Data Source= ;Initial Catalog=GuestBook;User ID=sa;Password=12345") 建立連線 Conn.Open() 開啟連線 Dim cmd As New SqlCommand("SELECT [Value] FROM [Config] WHERE [Name] = 'Password'", Conn) Dim dr As SqlDataReader dr = cmd.executereader() 執行命令 If dr.read() Then Password = dr.item("value").tostring End If cmd.cancel() : dr.close() : Conn.Close() 關閉所有相關物件圖 2-6 連線至 SQL Server 並取得資料之相關程式碼在上圖 ( 圖 2-5 與圖 2-6) 我們可以看到在取得資料庫內容時, 會先建立一個連線, 建立完成後會執行命令, 如上圖第四行, 在 SQL 中常用到 SELECT ( 選擇命令, 常用於取得資料庫的資料 ) INSERT( 新增命令, 常用於新增一筆新資料 ) UPDATE( 更新命令, 常用於改變已存在資料庫內的資料 ) DELECT( 刪除命令, 常用於刪除資料庫內的資料 ), 透過以上這四個命令即可完成我們留言版與資料庫的互動 ( 二 ) 寫入資料庫寫入跟讀取在程式的撰寫上沒有太大的差別, 最大差別在讀取時是使用 SELECT 並且會宣告一個 SqlDataReader 來儲存讀取到的資料, 寫入資料庫時是使用 INSERT( 新增 ) 或是 UPDATE( 更新 ) 而且不需要使用到 SqlDataReader 建立連線建立連線寫入資料關閉連線圖 2-7 寫入資料庫流程 5

7 Dim Conn As New SqlConnection("Data Source= ;Initial Catalog=GuestBook;User ID=sa;Password=12345") 建立連線 Dim strinsert As String Dim cmnd As SqlCommand Conn.Open() 開啟連線 strinsert = "INSERT INTO [GuestBook] ([Title],[Time],[UserName],[Avatar],[ ],[Site],[Context]) VALUES('" & tb_title.text & "','" & DateTime.Now & "','" & tb_username.text & "','" & tb_avatar.text & "','" & tb_ .text & "','" & tb_site.text & "','" & tb_context.text & "')" cmnd = New SqlCommand(strinsert, Conn) cmnd.executenonquery() : cmnd.cancel() : Conn.Close() 執行命令, 關閉所有相關物件圖 2-8 連線至 SQL Server 並寫入資料之相關程式碼 ( 三 ) 密碼安全為了保護密碼的安全, 我們在這邊採用了取代加密法, 使存放於資料庫中的密碼較不容易被破解, 下圖 ( 圖 2-9) 為取代加密法示意圖 A B C D E F G H C D E F G H I J 圖 2-9 取代加密法示意圖這邊舉個例子, 例如現在輸入一個值為 HELLO, 那麼透過加密系統的規則 :H J E G L N O Q, 最後得到的加密字串為 : JGNNO 参結論一研究成果 : ( 一 ) 留言版主畫面 6

8 ( 二 ) 新增留言畫面圖 3-1 留言版主畫面圖 3-2 新增留言畫面 7

9 ( 三 ) 登入認證畫面圖 3-3 未填寫內容送出提示畫面 ( 四 ) 留言管理畫面圖 3-4 登入認證畫面圖 3-5 留言管理畫面 8

( 五 ) 全域設定畫面圖 3-6 全域管理畫面二未來研究建議 ( 一 ) 安全性的補強 : 因為目前在後臺 ( 管理介面 ) 的驗證上都是藉由網址來傳遞密碼認證, 會有密碼外流的疑慮, 該問題將於往後修正 ( 二 ) 留言內容可多采多姿 : 礙於現有知識不足, 在這次的成果中並沒有做到留言內容的色彩及字體大小可由使用者自訂的功能肆引註資料 1 周棟祥 (2008.7) ASP.

10 ( 五 ) 全域設定畫面圖 3-6 全域管理畫面二未來研究建議 ( 一 ) 安全性的補強 : 因為目前在後臺 ( 管理介面 ) 的驗證上都是藉由網址來傳遞密碼認證, 會有密碼外流的疑慮, 該問題將於往後修正 ( 二 ) 留言內容可多采多姿 : 礙於現有知識不足, 在這次的成果中並沒有做到留言內容的色彩及字體大小可由使用者自訂的功能肆引註資料 1 周棟祥 (2008.7) ASP.NET 專題實務統一元氣資產管理 ( 股 ) 限公司 2 维基百科 ASP.NET 2012 年 03 月 24 日, 取自 3 余小章 (2009) [ADO.NET] 如何建立 SQL Server 2005 Express Edition 資料庫連線字串 / SQL Connect String 2012 年 03 月 24 日, 取自 4 Microsoft (2008).NET Framework 3.5 Common Namespaces and Types Poster 2012 年 03 月 24 日, 取自维基百科替換式密碼 2012 年 03 月 24 日, 取自 E5%AF%86%E7%A0%81 9

投影片 1

投影片 1 資料庫管理程式 ( 補充教材 -Part2) 使用 ADO.NET 連結資料庫 ( 自行撰寫程式碼以實現新增刪除修改等功能 ) Private Sub InsertButton_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles InsertButton.Click ' 宣告相關的 Connection