如何在網頁中將數據庫中存儲的圖像顯示為blob

Question

我想在網頁中顯示一個圖像，該圖像作為blob類型存儲在數據庫中。 我成功地將數據存儲為數據庫中的二進制/圖像類型。 但是我怎樣才能在網頁上顯示它。 我得到一個圖像，就像這樣的符號（JFIF fExifII *>）當我從數據庫中檢索。

Answer 1

您應該將圖像數據轉換為base64，然后寫入響應，例如：

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAM0AAAD
 NCAMAAAAsYgRbAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5c
 cllPAAAABJQTFRF3NSmzMewPxIG//ncJEJsldTou1jHgAAAARBJREFUeNrs2EEK
 gCAQBVDLuv+V20dENbMY831wKz4Y/VHb/5RGQ0NDQ0NDQ0NDQ0NDQ0NDQ
 0NDQ0NDQ0NDQ0NDQ0NDQ0NDQ0PzMWtyaGhoaGhoaGhoaGhoaGhoxtb0QGho
 aGhoaGhoaGhoaGhoaMbRLEvv50VTQ9OTQ5OpyZ01GpM2g0bfmDQaL7S+ofFC6x
 v3ZpxJiywakzbvd9r3RWPS9I2+MWk0+kbf0Hih9Y17U0nTHibrDDQ0NDQ0NDQ0
 NDQ0NDQ0NTXbRSL/AK72o6GhoaGhoRlL8951vwsNDQ0NDQ1NDc0WyHtDTEhD
 Q0NDQ0NTS5MdGhoaGhoaGhoaGhoaGhoaGhoaGhoaGposzSHAAErMwwQ2HwRQ
 AAAAAElFTkSuQmCC" alt="beastie.png" /> 

http://www.techerator.com/2011/12/how-to-embed-images-directly-into-your-html/

或者，您可以鏈接到服務器腳本，該腳本返回包含任何圖像內容類型的標題，並將圖像數據直接寫入響應。

Answer 2

這是我使用Ajax從數據庫（SQL Server）將二進制圖像渲染到html頁面時使用的代碼

stm = conn.prepareStatement("SELECT IMAGE FROM TABLE" );
rs = stm.executeQuery();
return rs

然后使用ajax（存儲在“響應”中）接收原始rs：

        $.post('./getImagePage.jsp', {
            action : 'getImage'
        }, function(response) {         
            if (response != ''){                                                        
                var arrayBufferView = new Uint8Array( response[0].IMAGE);                                       
                var blob = new Blob( [ arrayBufferView ], { type: "image/jpg" } );
                var urlCreator = window.URL || window.webkitURL;
                var imageUrl = urlCreator.createObjectURL( blob );                                  
                var img = document.querySelector("#fotoMb");
                img.src = imageUrl;                     
        });     

和HTML：

<img id="fotoMb" style="border:5px solid;">

Answer 3

我建議你不要將圖像保存到數據庫！ 這可以使您的數據庫服務器加載緩慢！ 簡短回答，將圖像保存在您的Web服務器的文件夾中，並僅引用保存文件的URL。 祝好運 ！