MVC Convert Base64 String to Image, but ... System.FormatException

Question

My controller is getting an uploaded image in the request object in this code:

[HttpPost] public string Upload() { string fileName = Request.Form["FileName"]; string description = Request.Form["Description"]; string image = Request.Form["Image"]; return fileName; }

The value of image (at least the beginning of it) looks a lot like this:

data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEAYABgAAD/7gAOQWRvYmUAZAAAAAAB/...

I tried to convert using the following:

byte[] bImage = Convert.FromBase64String(image);

However, that gives the System.FormatException: "The input is not a valid Base-64 string as it contains a non-base 64 character, more than two padding characters, or an illegal character among the padding characters."

I get the feeling that the problem is that at least the start of the string isn't base64, but for all I know none of it is. Do I need to parse the string before decoding it? Am I missing something completely different?

Jon Skeet · Accepted Answer · 2013-02-22 20:29:44Z

9

It looks like you may just be able to strip out the "data:image/jpeg;base64," part from the start. For example:

const string ExpectedImagePrefix = "data:image/jpeg;base64,"; ... if (image.StartsWith(ExpectedImagePrefix)) { string base64 = image.Substring(ExpectedImagePrefix.Length); byte[] data = Convert.FromBase64String(base64); // Use the data } else { // Not in the expected format }

Of course you may want to make this somewhat less JPEG-specific, but I'd try that as a very first pass.

answered Feb 22, 2013 at 20:29

Jon Skeet

1.5m893 gold badges9.3k silver badges9.3k bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

ESDictor Over a year ago

I need to accept jpg, gif, png, and bmp, which I suppose isn't so many to check for to handle it your way (assuming it works). However, I can't help but think that there's a correct way to parse that image. So many possible delimiters in that first 20 or so characters ... it can't be a coincidence.

Jon Skeet Over a year ago

Well, I think the format of data:[content-type];[encoding],[data] is pretty reasonable...

ESDictor Over a year ago

I just need to test it on Monday ... if it works I'll mark your answer

ESDictor Over a year ago

This actually worked great. After decoding, everything after the column was a valid image. Thanks for the help @Jon! I actually grabbed the mime-type, which I was basing off the filename, but I feel better grabbing it from there now.

Jose A Over a year ago

string base64 = Regex.Replace(file, @"data:image\/(png|jpg|svg|gif)\;base64,", ""); The code before will replace the text for png, svg, gif, jpg, files. Add more by adding |myType. Like this: string base64 = Regex.Replace(file, @"data:image\/(png|jpg|svg|gif|myType)\;base64,", "");

|

Dachi · Accepted Answer · 2016-01-29 08:31:53Z

The reason really is "data:image/jpeg;base64,", I'll suggest using this method for removing starting string from base64

var base64Content = image.Split(',')[1]; byte[] bImage = Convert.FromBase64String(base64Content);

This is Shortest solution and you don't have to use magic strings, or write a regex.

Collectives™ on Stack Overflow

MVC Convert Base64 String to Image, but ... System.FormatException

2 Answers 2

7 Comments

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

1 Comment

Linked

Related