Sunday, 15 February 2015

Upload and display Image without saving in ASP.Net using C# and VB.Net


In this article how to upload Image and display it in Image control without physically saving it in a folder on disk in ASP.Net using C# and VB.Net.
HTML Markup
<form id="form1" runat="server">
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="btnUpload" runat="server" Text="Upload"
    onclick="btnUpload_Click" />
<hr />
<asp:Image ID="Image1" Visible = "false" runat="server" Height = "100" Width = "100" />
</form>
 
Above you will see a FileUpload control to upload the Image File, a Button control to trigger the File upload process and an Image control to display the uploaded image file.
 
Displaying the Byte Array as Image
Below is the code that is being executed when the Upload button is clicked.
C#
protected void btnUpload_Click(object sender, EventArgs e)
{
    System.IO.Stream fs = FileUpload1.PostedFile.InputStream;
    System.IO.BinaryReader br = new System.IO.BinaryReader(fs);
    Byte[] bytes = br.ReadBytes((Int32)fs.Length);
    string base64String = Convert.ToBase64String(bytes, 0, bytes.Length);
    Image1.ImageUrl = "data:image/png;base64," + base64String;
    Image1.Visible = true;
}
 
VB
Protected Sub btnUpload_Click(sender As Object, e As EventArgs)
    Dim fs As System.IO.Stream = FileUpload1.PostedFile.InputStream
    Dim br As New System.IO.BinaryReader(fs)
    Dim bytes As Byte() = br.ReadBytes(CType(fs.Length, Integer))
    Dim base64String As String = Convert.ToBase64String(bytes, 0, bytes.Length)
    Image1.ImageUrl = "data:image/png;base64," & base64String
    Image1.Visible = True
End Sub

No comments:

Post a Comment