将Base64图像字节复制到MVC控制器功能以在服务器中上传

时间:2015-09-06 12:57:27

标签: jquery asp.net-mvc-4

我开发了以下视图:

<p><a href="#" id="hl-crop-image">Crop Image</a></p>

    <p>
        //First Image
        <img id="my-origin-image" src="#"/>
        //Second Image
        <img id="my-origin-image" src="#" />
    </p>
    <p>
        <input type='file' accept="image/*" name="image" id="imgUpload" />
    </p>
    <p>
        <img id="my-cropped-image" src="#" style="display:none;" />
    </p>

现在我想从客户端机器浏览图像并在第一个图像控件中显示图像(“id =”my-origin-image“”)。然后我想裁剪图像然后如果我点击链接裁剪图像(id =“hl-crop-image”),那么图像字节和它的坐标将被发送到mvc控制器上传。这是我用jquery ajax函数完成的。代码如下:

function cropImage() {

                if (imageCropWidth === 0 && imageCropHeight === 0) {
                    alert("Please select crop area.");
                    return;
                }

                $.ajax({
                    url: '/Image/CropImage',
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        imagePath: $("#my-origin-image").attr("src").replace(/^data:image\/(png|jpeg);base64,/, ""),
                        cropPointX: cropPointX,
                        cropPointY: cropPointY,
                        imageCropWidth: imageCropWidth,
                        imageCropHeight: imageCropHeight
                    },
                    success: function (data) {
                        $("#my-cropped-image")
                            .attr("src", data.photoPath + "?t=" + new Date().getTime())
                            .show();
                    },
                    error: function (data) { }
                });
            }

控制器功能

//byte[] imageBytes = System.Text.Encoding.UTF8.GetBytes(imagePath);
            //byte[] imageBytes = Convert.FromBase64String(imagePath);
            byte[] imageBytes = System.Convert.FromBase64String(HttpContext.Request["imagePath"]);

            byte[] croppedImage = ImageHelper.CropImage(imageBytes, cropPointX.Value, cropPointY.Value, imageCropWidth.Value, imageCropHeight.Value);

            string tempFolderName = Server.MapPath("~/" + ConfigurationManager.AppSettings["Image.TempFolderName"]);
            string fileName = Path.GetFileName(imagePath);

            try
            {
                FileHelper.SaveFile(croppedImage, Path.Combine(tempFolderName, fileName));
            }
            catch (Exception ex)
            {
                //Log an error     
                return new HttpStatusCodeResult((int)HttpStatusCode.InternalServerError);
                throw ex;
            }

            string photoPath = string.Concat("/", ConfigurationManager.AppSettings["Image.TempFolderName"], "/", fileName);
            return Json(new { photoPath = photoPath }, JsonRequestBehavior.AllowGet);

问题控制器无法正确获取图像字节并将文件上传到服务器中。任何人都可以让我知道问题出在哪里。

0 个答案:

没有答案