Show image from FileUpload stored in Session

Question

User-1526035670 posted

Hi

I will give a very short scenario i am facing but happy to give more info/code if required (i maybe making this complex than it already is).

I am collecting some user info along with 2 images using two FileUpload controls (they are both saved to different tables). This info is saved in a session object. For the FileUpload i am saving the below details on button click

Session["fuImageOneFilename"] = fuImageOne.FileName;
Session["fuImageOneFilebytes"] = fuImageOne.FileBytes;

Same for FileUpload 2but names changed.

I have a third button which validates the page and once valid it takes the user to the next page. Upon reaching the next page i would like to display the images that were uploaded using the Image control but cant figure out how i can do this? Do i need to add another variable to capture more details or is there something simple im missing here? Eventually i would save this image to our server and save the data to a database.

Thanks

Answer 1

User753101303 posted

Hi,

With Web Forms a possible approach is to use an ASHX handler: https://stackoverflow.com/questions/21877/dynamically-rendering-aspimage-from-blob-entry-in-asp-net

I short rather than giving the address of an actual file and having the web server to return the content of this file, you'll have an address that runs your own code which return the byte content to the browser.
You'll be able then to use this address exactly as if it was matching a real file (ie using for example this address for the src attribute of an img tag).

Answer 2

User-1330468790 posted

Hi JamieP1,

 

I think you just want to pass the name and the image to the next page which will display these two information. Then, the user will decide whether save the image or not.

 

If so, the solution would be very simple. Store the name and image in session and fetch them in the next page.

The image will be displayed using base64 format string to represent the byte array for image.

 

More details, you could refer to below codes.

Pass Image ASPX:

  <form id="form1" runat="server">
        <div>
            <asp:FileUpload ID="fuImageOne" runat="server" />
            <asp:Button ID="PassBtn" runat="server" Text="Pass" OnClick="PassBtn_Click"/>
        </div>
    </form>

Pass Image Code behind:

protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void PassBtn_Click(object sender, EventArgs e)
        {
            Session["fuImageOneFilename"] = fuImageOne.FileName;
            Session["fuImageOneFilebytes"] = fuImageOne.FileBytes;

            Response.Redirect("~/SessionShowImage.aspx");
        }

Show Image ASPX:

 <form id="form1" runat="server">
        <div>
            <asp:Label ID="DisplayName" runat="server">
            </asp:Label>
            <asp:Image ID="DisplayImage" runat="server" />
        </div>
    </form>

Show Image Code behind:

 protected void Page_Load(object sender, EventArgs e)
        {
            if (Session["fuImageOneFilename"]!=null && Session["fuImageOneFilebytes"] != null)
            {
                DisplayName.Text = Session["fuImageOneFilename"].ToString();
                DisplayImage.ImageUrl= "data:image;base64," + Convert.ToBase64String((byte[])Session["fuImageOneFilebytes"]);
            }
        }

Demo:

 

Hope this can help you。

Best regards,

Sean