javascript 如何在网页中将存储在数据库中的图像显示为 blob
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13122459/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to display images stored in database as a blob, in webpage
提问by R J.
I want to display a image in webpage , which is stored in database as blob type. I am storing a image as binary/image type in database successfully. But how can i display it in webpage. I am getting a image as something like symbols(?????JFIF????????fExif??II*?????????>) when i retrieve from the database.
我想在网页中显示一个图像，该图像以 blob 类型存储在数据库中。我在数据库中成功地将图像存储为二进制/图像类型。但是我如何在网页中显示它。?当我从数据库中检索时，我得到的图像类似于符号 ( ??? JFIF?? ?????fExif??II*?????????>)。
回答by testCoder
You should convert image data to base64 and then write to response, for example:
您应该将图像数据转换为 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/
http://www.techerator.com/2011/12/how-to-embed-images-directly-into-your-html/
Or you can make a link to server script which return header with content type of any image and write image data directly to response.
或者，您可以创建指向服务器脚本的链接，该脚本返回带有任何图像内容类型的标头，并将图像数据直接写入响应。
回答by Marcelo Carvalho Nascimento
Here's the code I used when I had to render a binary image from the database (SQL Server) into a html page using Ajax
这是我必须使用 Ajax 将来自数据库 (SQL Server) 的二进制图像渲染到 html 页面时使用的代码
stm = conn.prepareStatement("SELECT IMAGE FROM TABLE" );
rs = stm.executeQuery();
return rs
The raw rs is then received using ajax(stored in the "response"):
然后使用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;
});
And the HTML:
和 HTML：
<img id="fotoMb" style="border:5px solid;">
回答by Michael Antonius
I suggest you to don't save image to database ! That's can make your database server loading slowly ! Short answer, save image on folder of you web server and only refer the url where you save your file. Good luck !
我建议您不要将图像保存到数据库！那会让你的数据库服务器加载缓慢！简短的回答，将图像保存在您的 Web 服务器的文件夹中，并且只引用您保存文件的 url。祝你好运 ！
