PDA

View Full Version : Show binary image



thomsonzh
17 Jun 2013, 10:38 AM
I try to show a binary image from database,

var picBox = {
id: 'imgname',
name: 'imgname',
fieldLabel: '',
xtype: 'box', // or xtype: 'component',
width: 150, //
height: 150, //
autoEl: {
tag: 'img', //
src: image //'../../images/Logo.png' //exists.png' /// <reference path="../../images/Logo.png" />
}
}
}
//////////////////////////////////////////////////////////
function hexToBase64(str) {
return btoa(String.fromCharCode.apply(null, str.replace(/\r|\n/g, "").replace(/([\da-fA-F]{2}) ?/g, "0x$1 ").replace(/ +$/, "").split(" ")));
}
////////////////////////////////////////////////
Ext.getCmp('imgname').src = 'data:image/jpeg;base64,' + hexToBase64(form.responseText);

form.responseText is from backend code(c#)
byte[] image = (byte[])imageData;
Response.ContentType = "image/jpeg";
Response.BinaryWrite(image);
Response.End();

I cant get image show. Is anything wrong?

Many thanks,
Thomson

cloudsharl
8 Sep 2013, 4:39 AM
Data encoded by base64 cannot be read.
You can pass url of image to front page.

thomsonzh
8 Sep 2013, 1:47 PM
I stored image in the database, so I don't have url for access. I believed the image can show to front from database.

thanks for your respond.
Thomson

cloudsharl
9 Sep 2013, 5:19 AM
Hi guy, maybe you are right . I just found it here
http://stackoverflow.com/questions/13122459/how-to-display-images-stored-in-database-as-a-blob-in-webpage