Is it possible for a view to display a WebImage without saving it to a file first?

You can write it out on the fly!

You just don't use WebImage.Save() like you'd think, instead you use WebImage.GetBytes().

In this example, you've already saved an image as a byte array to the database. Simplified it a bit to only handle jpegs.

    /// <summary>
    /// Reference this in HTML as <img src="/Photo/WatermarkedImage/{ID}" />
    /// Simplistic example supporting only jpeg images.
    /// </summary>
    /// <param name="ID">Photo ID</param>
    public ActionResult WatermarkedImage(Guid ID)
    {
        // Attempt to fetch the photo record from the database using Entity Framework 4.2.
        var photo = db.Photos.Find(ID);

        if (photo != null) // Found the indicated photo record.
        {
            // Create WebImage from photo data.
            // Should have 'using System.Web.Helpers' but just to make it clear...
            var wi = new System.Web.Helpers.WebImage(photo.Data); 

            // Apply the watermark.
            wi.AddImageWatermark(Server.MapPath("~/Content/Images/Watermark.png"), 
                                 opacity: 75, 
                                 horizontalAlign: "Center", 
                                 verticalAlign: "Bottom");

            // Extract byte array.
            var image = wi.GetBytes("image/jpeg");

            // Return byte array as jpeg.
            return File(image, "image/jpeg");
        }
        else // Did not find a record with passed ID.
        {
            return null; // 'Missing image' icon will display on browser.
        }
    }

There isn't anyway to do it in a single razor view... you need to create a seperate action to render the image.

The img tag on the page is going to make a SEPERATE http call to the server based on the url provided in the img src.


Try using Data URLs to display the image. This will avoid temporarily saving the image to disk and a second HTTP request to fetch the image. You'll just need to do one round trip to encode the image inline.