ASP.NET 從 SQL Server 擷取圖片完整教學

前言

在 ASP.NET 應用程式中，將圖片儲存於 SQL Server 資料庫並非難事，但如何高效地將這些二進位資料讀取並輸出至瀏覽器，卻是許多開發者關注的焦點。本文將透過完整的程式碼範例，詳細說明如何使用 Response.BinaryWrite 方法，從資料庫中擷取圖片並正確輸出。

核心概念：Response.BinaryWrite 與 ContentType

輸出圖片的關鍵在於兩個步驟：首先設定 Response.ContentType 為圖片的 MIME 類型（如 image/jpeg、image/png），接著呼叫 Response.BinaryWrite 將二進位位元組陣列直接寫入 HTTP 回應流。由於瀏覽器根據 ContentType 決定如何解譯資料流，因此務必確保資料庫中儲存的圖片類型欄位準確無誤。

資料表結構假設

範例假設資料庫中有一個名為 Person 的資料表，包含以下欄位：

• PersonImage：varbinary(max) 或 image 型別，儲存圖片二進位資料
• PersonImageType：varchar(50)，儲存 MIME 類型（如 image/jpeg）

完整程式碼範例 (VB.NET)

<%@ Page Language="vb" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<script runat="server">
Public Sub Page_Load(sender As Object, e As EventArgs)
    Dim myConnection As New SqlConnection(ConfigurationSettings.AppSettings("ConnectionString"))
    Dim myCommand As New SqlCommand("Select * from Person", myConnection)
    Try
        myConnection.Open()
        Dim myDataReader As SqlDataReader
        myDataReader = myCommand.ExecuteReader(CommandBehavior.CloseConnection)
        Do While (myDataReader.Read())
            Response.ContentType = myDataReader.Item("PersonImageType").ToString()
            Response.BinaryWrite(CType(myDataReader.Item("PersonImage"), Byte()))
        Loop
        myConnection.Close()
        Response.Write("Person info successfully retrieved!")
    Catch SQLexc As SqlException
        Response.Write("Read Failed : " & SQLexc.ToString())
    End Try
End Sub
</script>
<html>
<head><title>Retrieving Image from SQL Server</title></head>
<body style="font: 10pt verdana"></body>
</html>

程式碼解析

1. 連線字串：從 web.config 的 <appSettings> 讀取，建議實務上使用 ConfigurationManager.ConnectionStrings。
2. SqlDataReader：採用 CommandBehavior.CloseConnection，確保讀取結束時自動關閉連線。
3. 迴圈讀取：Do While (myDataReader.Read()) 逐筆處理每一列資料。
4. 輸出圖片：Response.ContentType 設為資料庫儲存的 MIME 類型，Response.BinaryWrite 接收 Byte() 陣列直接輸出。

常見問題與注意事項

• 多筆圖片輸出：上述範例會將所有圖片連續寫入同一個回應流，瀏覽器僅會顯示最後一張。實務上通常透過查詢字串傳入 PersonID，僅查詢並輸出單一圖片。
• 錯誤處理：Try...Catch 區塊捕捉 SqlException，避免資料庫連線失敗導致頁面當機。
• 效能考量：大量圖片讀取時，建議啟用連線池、使用非同步讀取或快取機制減輕資料庫負載。

進階應用：單一圖片輸出頁面

實際專案中，通常建立一個專門的頁面（如 ShowImage.aspx），透過 QueryString 接收圖片 ID：

' ShowImage.aspx.vb
Public Sub Page_Load(sender As Object, e As EventArgs)
    Dim imgID As String = Request.QueryString("ID")
    If String.IsNullOrEmpty(imgID) Then Return
    
    Using conn As New SqlConnection(ConfigurationManager.ConnectionStrings("ConnStr").ConnectionString)
        Dim cmd As New SqlCommand("SELECT PersonImage, PersonImageType FROM Person WHERE PersonID = @ID", conn)
        cmd.Parameters.AddWithValue("@ID", imgID)
        conn.Open()
        Using reader As SqlDataReader = cmd.ExecuteReader()
            If reader.Read() Then
                Response.ContentType = reader("PersonImageType").ToString()
                Response.BinaryWrite(CType(reader("PersonImage"), Byte()))
            End If
        End Using
    End Using
End Sub

前端頁面即可使用 <img src="ShowImage.aspx?ID=123" /> 顯示圖片。

總結

掌握 Response.BinaryWrite 搭配正確的 ContentType，即可輕鬆實現從 SQL Server 擷取並顯示圖片。搭配參數化查詢與適當的錯誤處理，能構建安全、穩健的圖片存取功能。