[.ashx檔？泛型處理常式？]基礎入門#5....ADO.NET 與將DB裡面的二進位圖片還原 (範例下載 & 大型控制項的ImageField)

2014-05-19

摘要:[.ashx檔？泛型處理常式？]基礎入門#5....ADO.NET 與將DB裡面的二進位圖片還原 (範例下載 & 大型控制項的ImageField)

根據前面三篇文章的教學

完成後可以做出來（請您務必依照順序學習，不要只是找範例來Copy）

本文做為書本「上集」的 Ch.18 FileUpload 補充範例

ASP.NET 4.5專題實務(I)，松崗出版

方法一！

我個人是建議「檔案上傳時，存在 Web Server硬碟，把存檔的路徑與檔名，放入DB」，這種作法最簡單！

不用學習新招數就能完成

我的書本（上集） FileUpload也是介紹這種作法，書本內已經有完整範例。

方法二！本文將介紹的.....

如果您堅持要把「檔案」存到資料表裡面，會遇見兩個關卡

2-1. 如何把圖片（檔案）的二進位IO Stream存入資料表的欄位（請設定為 Image資料型態）

2-2. 如何把資料表裡面的「二進位」資料，撈出來（讀取出來），還原成圖片？秀在網頁上？

教學影片： http://youtu.be/JfZ3rYchlLo

依照上述第三篇文章裡面，我提供的超連結。裡面就有很多前輩分享他們的程式碼

看看哪個OK，您就照做，一定可以做得出來。

http://www.cnblogs.com/travelcai/archive/2007/09/27/907203.html

http://davidma168.wordpress.com/2011/01/25/ashx-%E8%BC%B8%E5%87%BA%E5%9C%96%E7%89%87/

http://davidma168.wordpress.com/2011/01/25/ashx-output-image-2/

===============================================================================================

第一，建立一個資料表

存放「圖片、檔案」的欄位，請設定為 Image資料型態

另一個欄位，要設定 MIME格式，通常是把附檔名（副檔名）放進去。日後要把這些二進位資料獨出來，組合成原本的圖片，會用到MIME！

資料表的範例可由此下載 （.sql檔，檔名有 Image字樣）

https://onedrive.live.com/?cid=6F7F668080F24B20&id=6F7F668080F24B20%21115

第二，上傳的範例，可以看見 FileUpload的程式有些變化

2-1. 不需要存檔了

FileUpload的 .SaveAs()方法用不到。因為檔案上傳後就寫入資料表，不是存在 Web Server硬碟

也不用設定存檔的目錄、路徑

2-2. 上傳後，檔案（圖片）的 IO Stream以「 Byte陣列」的方式的方式來讀取

便可以把這個 Byte陣列的內容（圖片的二進位資料），存入資料表中

第三，把DB裡面的圖片（二進位）還原，秀在網頁上

這裡我用了兩種作法，不過原理都相同

簡言之，把讀取、還原成圖片的動作，放在 .ashx程式裡面

3-1. 一般的 Image控制項

<asp:Image ID="Image1" runat="server"

ImageUrl='<%# "FileUpload_DB_Image_02_Display.ashx?id=" + Eval("FileUpload_DB_id")%>' />

3-2. 大型控制項裡面的 ImageField 樣板欄位

<asp:GridView ,,,,,>

<asp:ImageField DataImageUrlField="FileUpload_DB_id（資料表的欄位名稱！）"

DataImageUrlFormatString="FileUpload_DB_Image_02_Display.ashx?id={0}">

</asp:ImageField>

</asp:Gridview>

第四，把圖片的讀取（從資料庫撈出來）。還原成原本的圖片MIME格式，都是用 ashx程式來做

本系列的範例，不就是介紹 ASHX嗎？

回頭看看第一步驟，我們的 FileUpload_DB2 資料表裡面，多設計兩個「欄位」，

一個存放「圖片（二進位）」，另外一個存放「副檔名」作為MIME

............原理是不是很清楚了？

===============================================================================================

檔案下載：

因為這些範例，也是網路上學習到的

前輩們願意分享，我做好後也願意分享 ( 記得要搭配第一個步驟，先把您的 FileUpload_DB2資料表設定完成 )

ASHX_CS.rar ASHX_VB.rar

2014/10/3 補充文章

IThome邦幫忙，另一位網友的作法，他寫在 Hyperlink控制項的 DataBinding事件內

http://ithelp.ithome.com.tw/question/10157480

下一篇文章將會介紹 FileUpload控制項的 「Filecontent」與「FileBytes」兩個屬性

程式碼幾乎不用改的情況下，也能作到本文的功能

詳見 [.ashx檔？泛型處理常式？]基礎入門#5-1....ADO.NET 與將DB裡面的二進位圖片還原 (FileUpload的 FileContent屬性與 FileBytes屬性)

知識因為分享而偉大

........................................................................................................................................................................

網路上找到兩篇類似的範例，是用SQL指令的特性來做相同的是情

(shadow 與曹祖聖老師的作品)

........................................................................................................................................................................

把 "大容量"的圖片、檔案放到資料表的「欄位」裡面，會有一些缺陷

上課的時候將為您報告這幾點。

您也可以參閱 SQL 2012的 FileStream，試著瞭解為何有這些改進？

改善了哪些地方？......以下是 msdn網站的說明

FILESTREAM 可讓 SQL Server 架構應用程式在檔案系統上儲存非結構化的資料，例如文件和影像。應用程式可以利用檔案系統的豐富資料流 API 和效能，並同時維護非結構化資料與對應結構化資料之間的交易一致性。

FILESTREAM 會將 SQL Server Database Engine 與 NTFS 檔案系統整合，方法是將 varbinary(max) 二進位大型物件 (BLOB) 資料當做檔案儲存在檔案系統上。 Transact-SQL 陳述式可以插入、更新、查詢、搜尋和備份 FILESTREAM 資料。 Win32 檔案系統介面提供了資料的資料流方式存取。

FILESTREAM 會使用 NT 系統快取來儲存檔案資料。如此可減少 FILESTREAM 資料可能對 Database Engine 效能產生的任何影響。 並不會使用 SQL Server 緩衝集區；因此，此記憶體可用於查詢處理。

當您安裝或升級 SQL Server 時，並不會自動啟用 FILESTREAM。您必須使用 SQL Server 組態管理員和 SQL Server Management Studio 來啟用 FILESTREAM。若要使用 FILESTREAM，您必須建立或修改資料庫，以便包含特殊類型的檔案群組。然後，請建立或修改資料表，讓它包含具有 FILESTREAM 屬性的 varbinary(max) 資料行。完成這些工作之後，您就可以使用 Transact-SQL 和 Win32 來管理 FILESTREAM 資料。

微軟MSDN網站： ADO.NET (DataReader) 擷取二進位資料 (BLOB)

http://msdn.microsoft.com/zh-tw/library/87z0hy49(v=vs.110).aspx

搭配SQL 2012 FILESTREAM，這裡有 ADO.NET 的程式範例

（讀取、新增、修改）

http://msdn.microsoft.com/zh-tw/library/vstudio/cc716724(v=vs.110).aspx

也可以參考SQL 2012的新功能，透過DB來管理「檔案」

SQL Server - 神奇又好用的File Table (作者 : sky)

http://www.dotblogs.com.tw/skychang/archive/2013/06/17/105580.aspx

........................................................................................................................................................................

想要作到上傳圖片以後，還要「縮圖」

例如：FileUpload以後，縮圖（大圖變小圖）

搜尋關鍵字「ASP.NET 縮圖」就能找到很多範例，可以參閱這幾篇文章，很清楚：

http://wangshifuola.blogspot.tw/2011/10/aspnetimage-resize.html

http://demo.tc/Post/95

http://blog.xuite.net/cppbuilder/blog/9331487

我將思想傳授他人，他人之所得，亦無損於我之所有；

猶如一人以我的燭火點燭，光亮與他同在，我卻不因此身處黑暗。----Thomas Jefferson

線上課程教學，遠距教學 (Web Form 約 51hr) https://dotblogs.com.tw/mis2000lab/2016/02/01/aspnet_online_learning_distance_education_VS2015

線上課程教學，遠距教學 (ASP.NET MVC 約 135hr) https://dotblogs.com.tw/mis2000lab/2018/08/14/ASPnet_MVC_Online_Learning_MIS2000Lab

寫信給我，不要私訊 -- mis2000lab (at) yahoo.com.tw 或 school (at) mis2000lab.net

(1) 第一天 ASP.NET MVC5 完整影片（5.5小時 / .NET 4.x版）免費試聽。影片 https://youtu.be/9spaHik87-A

(2) 第一天 ASP.NET Core MVC 完整影片（3小時 / .NET Core 6.0~8.0）免費試聽。影片 https://youtu.be/TSmwpT-Bx4I

[學員感言] mis2000lab課程評價 - ASP.NET MVC , WebForm 。 https://mis2000lab.medium.com/%E5%AD%B8%E5%93%A1%E6%84%9F%E8%A8%80-mis2000lab%E8%AA%B2%E7%A8%8B%E8%A9%95%E5%83%B9-asp-net-mvc-webform-77903ce9680b

ASP.NET遠距教學、線上課程（Web Form + MVC）。第一天課程， "完整" 試聽。

......... facebook社團 https://www.facebook.com/mis2000lab ......................

......... YouTube (ASP.NET) 線上教學影片 https://www.youtube.com/channel/UC6IPPf6tvsNG8zX3u1LddvA/

Blog文章 "附的範例" 無法下載，請看 https://dotblogs.com.tw/mis2000lab/2016/03/14/2008_2015_mis2000lab_sample_download

請看我們的「售後服務」範圍（嚴格認定）。

......................................................................................................................................................

ASP.NET MVC => .NET Core MVC 線上教學 ...... 第一天課程完整內容 "免費"讓您評估 / 試聽

[遠距教學、教學影片] ASP.NET (Web Form) 課程上線了！MIS2000Lab.主講事先錄好的影片，並非上課側錄！觀看時，有如「一對一」面對面講課。

回首頁

ASP.NET專題實務 WebForm + MVC線上教學影片 -- MIS2000Lab.

MIS2000 Lab.已推出20餘本電腦書，曾任資策會專任講師與微軟MVP。自.NET 1.x起，已出版15本ASP.NET (Web Form)書籍，也有遠距教學線上教程教學影片