如果你使用的是HTML5中的canvas,借助jquery将图片上传至服务器,如果出现下来的提示:
System.FormatException: Base-64 字符数组的无效长度。 在 System.Convert.FromBase64String(String s)
那么,你应该遵循下面的方案去解决您的问题。
一般情况下,在客户端浏览器中,应是根据canvas的图像内容,将图像信息转换为加密后的base64数据,然后再传递到服务器端,服务器根据这个编码,对其进行解码,最后保存成为图片。
一、前台的jquery代码
大体是这样的:
var imgData=document.getElementById("canvas").toDataURL("image/png");
var base64Data = imgData.substr(22);
CallServer(base64Data);//上传至服务器
二、后台的代码
string GetBase64Data = context.Request.Params["MyValue1"].ToString();
byte[] imgBytes = Convert.FromBase64String(GetBase64Data);
//将base64字符串转换为字节数组
System.IO.Stream stream = new System.IO.MemoryStream(imgBytes);
System.Drawing.Image imgae = System.Drawing.Image.FromStream(stream);
imgae.Save(context.Server.MapPath("img/MyCamera.png"), System.Drawing.Imaging.ImageFormat.Png);//保存图片
按照常规,上面的前台和后台代码,是不存在任何问题的。但是在实际的使用中,却发生了本文所讲的错误提示。那么,如何解决问题呢?
问题的根源:当我们在前台imgData=document.getElementById("canvas").toDataURL("image/png");对图像数据进行编码之后,传到服务器,在这过程中,空格与加号是不能正常显示出来的,因此,应该使用替换的办法,对编码进行字符的替换,这样问题才能得到解决。
所以,后台代码的第一句,应该改为:
string GetBase64Data = context.Request.Params["MyValue1"].ToString();
GetBase64Data = GetBase64Data.Replace(" ","+");
这样问题就解决了。