Re-sizing and saving image to database

Question

I see in my code I'm not passing the re-scaled image into the InputStream, I'm passing in the original file-base. Is it possible to pass in newImage in some way as its of a different type?

I'm using MVC2 .NET 3.5

Here's the controller for uploading:

[HttpPost]
public ActionResult ImageUpload(HttpPostedFileBase fileBase, PhotoViewModel photoViewModel)
{
    if (photoViewModel.Button == "Upload")
    {
        photoViewModel.ImageValid = "Valid";
        ImageService imageService = new ImageService();

        if (fileBase != null && fileBase.ContentLength > 0 && fileBase.ContentLength <= 2097152 && fileBase.ContentType.Contains("image/"))
        {
            Path.GetExtension(fileBase.ContentType);
            var extension = Path.GetExtension(fileBase.FileName);

            if (extension.ToLower() != ".jpg" && extension.ToLower() != ".gif") // only allow these types
            {
                photoViewModel.ImageValid = "Not Valid";
                ModelState.AddModelError("Photo", "Wrong Image Type");
                return View(photoViewModel);
            }
            EncoderParameters encodingParameters = new EncoderParameters(1);
            encodingParameters.Param[0] = new EncoderParameter(Encoder.Quality, 100L); // Set the JPG Quality percentage

            ImageCodecInfo jpgEncoder = imageService.GetEncoderInfo("image/jpeg");
            var uploadedimage = Image.FromStream(fileBase.InputStream, true, true);

            Bitmap originalImage = new Bitmap(uploadedimage);
            Bitmap newImage = new Bitmap(originalImage, 274, 354);

            Graphics g = Graphics.FromImage(newImage);
            g.InterpolationMode = InterpolationMode.HighQualityBilinear;
            g.DrawImage(originalImage, 0, 0, newImage.Width, newImage.Height);

            var streamLarge = new MemoryStream();
            newImage.Save(streamLarge, jpgEncoder, encodingParameters);

            var fileExtension = Path.GetExtension(extension);
            string newname;
            if (photoViewModel.photoURL != null)
            {
                newname = photoViewModel.photoURL;
            }
            else
            {
                newname = Guid.NewGuid() + fileExtension;
            }

            //changed this up now, so it stores the image in db as apposed to physical path
            photoViewModel.photo = newname;
            photoViewModel.ContentType = fileBase.ContentType;
            Int32 length = fileBase.ContentLength;
            byte[] tempImage = new byte[length];
            fileBase.InputStream.Read(tempImage, 0, length);
            photoViewModel.ImageData = tempImage;          

            TempImageUpload tempImageUpload = new TempImageUpload();
            tempImageUpload.TempImageData = tempImage;
            tempImageUpload.ContentType = photoViewModel.ContentType;

            photoViewModel.TempImageId = _service.InsertImageDataBlob(tempImageUpload);

            originalImage.Dispose();
            streamLarge.Dispose();
            return View(photoViewModel);
        }

        if (fileBase != null)
        {
            if (fileBase.ContentLength > 0) ModelState.AddModelError("Photo", "Image size too small");
            if (fileBase.ContentLength <= 2097152) ModelState.AddModelError("Photo", "Image size too big");
            if (fileBase.ContentType.Contains("image/")) ModelState.AddModelError("Photo", "Wrong Image Type");
        }
        else ModelState.AddModelError("Photo", "Please upload a image");

        if (!ModelState.IsValid)
        {
            photoViewModel.ImageValid = "Not Valid";
            return View(photoViewModel);
        }
    }
    return View(photoViewModel);
}

Here's my repository class:

public int InsertImageDataBlob(TempImageUpload tempImageUpload)
{
  int ReturnedPhotoId;

  try
  {
    var phototempdata = new Photo
             {
                  ImageData = tempImageUpload.TempImageData,
                  contentType = tempImageUpload.ContentType,
                  dateUploaded = DateTime.Now
             };
    _db.Photos.InsertOnSubmit(phototempdata);
    Save();
    ReturnedPhotoId = phototempdata.id;
    return ReturnedPhotoId;
  }
  catch (Exception ex)
  {
    //ErrorLogging;
  }
  return 0;
}

And image data field (image type) in the database gets populated with data.

gone through this http://stackoverflow.com/questions/880515/display-image-from-database-in-asp-mvc — maztt, Jan 20 '12 at 12:22
Try to put `fileBase.InputStream.Seek(0, SeekOrigin.Begin);` before `fileBase.InputStream.Read(tempImage, 0, length);` statement? — Amar Palsapure, Jan 20 '12 at 12:24
You are reading from same stream twice, may be in DB your storing empty bytes. — Amar Palsapure, Jan 20 '12 at 12:28
Actually the upload now works but the file does not get resized or rescaled... so it's a partial success.. is there a reason it's bypassing the rescaling? — beebul, Jan 20 '12 at 12:59

theforce · Answer 1 · 2012-01-23T04:24:28.497

probably it works..or not :-P ....my changes in your code for the bypassing/rescaling issue (check my comments in your code):

[HttpPost]
public ActionResult ImageUpload(HttpPostedFileBase fileBase, PhotoViewModel photoViewModel)
{
    if (photoViewModel.Button == "Upload")
    {
        photoViewModel.ImageValid = "Valid";
        ImageService imageService = new ImageService();

        if (fileBase != null && fileBase.ContentLength > 0 && fileBase.ContentLength <= 2097152 && fileBase.ContentType.Contains("image/"))
        {
            Path.GetExtension(fileBase.ContentType);
            var extension = Path.GetExtension(fileBase.FileName);

            if (extension.ToLower() != ".jpg" && extension.ToLower() != ".gif") // only allow these types
            {
                photoViewModel.ImageValid = "Not Valid";
                ModelState.AddModelError("Photo", "Wrong Image Type");
                return View(photoViewModel);
            }
            EncoderParameters encodingParameters = new EncoderParameters(1);
            encodingParameters.Param[0] = new EncoderParameter(Encoder.Quality, 100L); // Set the JPG Quality percentage

            ImageCodecInfo jpgEncoder = imageService.GetEncoderInfo("image/jpeg");
            var uploadedimage = Image.FromStream(fileBase.InputStream, true, true);

            Bitmap originalImage = new Bitmap(uploadedimage);
            Bitmap newImage = new Bitmap(originalImage, 274, 354);

            Graphics g = Graphics.FromImage(newImage);
            g.InterpolationMode = InterpolationMode.HighQualityBilinear;
            // change from originalImage to newImage
            g.DrawImage(newImage, 0, 0, newImage.Width, newImage.Height);

            var streamLarge = new MemoryStream();
            newImage.Save(streamLarge, jpgEncoder, encodingParameters);

            var fileExtension = Path.GetExtension(extension);
            string newname;
            if (photoViewModel.photoURL != null)
            {
                newname = photoViewModel.photoURL;
            }
            else
            {
                newname = Guid.NewGuid() + fileExtension;
            }

            //changed this up now, so it stores the image in db as apposed to physical path
            photoViewModel.photo = newname;
            photoViewModel.ContentType = fileBase.ContentType;
            // using the memoryStream streamLarge
            // old code: Int32 length = fileBase.ContentLength;         
            byte[] tempImage = new byte[streamLarge.Length];
            // replace fileBase.InputStream with streamLarge
            streamLarge.Read(tempImage, 0, length);
            photoViewModel.ImageData = tempImage;          

            TempImageUpload tempImageUpload = new TempImageUpload();
            tempImageUpload.TempImageData = tempImage;
            tempImageUpload.ContentType = photoViewModel.ContentType;

            photoViewModel.TempImageId = _service.InsertImageDataBlob(tempImageUpload);

            originalImage.Dispose();
            streamLarge.Dispose();
            return View(photoViewModel);
        }

        if (fileBase != null)
        {
            if (fileBase.ContentLength > 0) ModelState.AddModelError("Photo", "Image size too small");
            if (fileBase.ContentLength <= 2097152) ModelState.AddModelError("Photo", "Image size too big");
            if (fileBase.ContentType.Contains("image/")) ModelState.AddModelError("Photo", "Wrong Image Type");
        }
        else ModelState.AddModelError("Photo", "Please upload a image");

        if (!ModelState.IsValid)
        {
            photoViewModel.ImageValid = "Not Valid";
            return View(photoViewModel);
        }
    }
    return View(photoViewModel);
}

Hi Daniel, it doesn't like this line : streamLarge.Read(tempImage, 0, length); The name 'length' does not exist in the current context Also if i pass in the filebase.ContentLength then I get this error when submitting the image: "Offset and length were out of bounds for the array or count is greater than the number of elements from index to the end of the source collection." — beebul, Jan 23 '12 at 14:10
If I try and pass in streamLarge.Read(tempImage, 0, tempImage.Length); it doesn't fail but no image is returned (before the image although too big was returned to the view) — beebul, Jan 23 '12 at 14:20
Bounty awarded as it helped me enough to get to the solution. So thank you! :) — beebul, Jan 24 '12 at 14:29

score 1 · Accepted Answer · answered Jan 23 '12 at 15:05

1

I actually got it to work with this code:

      photoViewModel.photo = newname;
      photoViewModel.ContentType = fileBase.ContentType;
      streamLarge.Position = 0;
      byte[] tempImage = new byte[streamLarge.Length + 1];
      streamLarge.Read(tempImage, 0, tempImage.Length);
      photoViewModel.ImageData = tempImage;

answered Jan 23 '12 at 15:05

beebul

993
1
16
37

1

ahh..I see...tempImage.Length for the read and plus 1 for the byte array...you have it..nice bee :-). – theforce Jan 24 '12 at 22:44

Re-sizing and saving image to database

2 Answers2