Не удалось создать изображение из base64string по методу действия MVC

Question

Я пытаюсь загрузить изображение в MVC-контроллере по его содержимому.

$scope.imageUpload = function (event) { 
     var files = event.target.files; //FileList object 
     fileString = event.target.files[0]; 
     for (var i = 0; i < files.length; i++) { 
      var file = files[i]; 
      var reader = new FileReader(); 
      reader.onload = $scope.imageIsLoaded; 
      reader.readAsDataURL(file); 
     } 
    } 
    $scope.imageIsLoaded = function (e) { 
     $scope.$apply(function() { 
      $scope.userProfilePic = e.target.result; 
      $.ajax({ 
       url: "FileUploadWithAjax", 
       type: "POST", 
       data: 'imageString=' + e.target.result.split(',')[1], 
       processData: false 
      }); 
     }); 
    } 

После загрузки изображения я отправляю его содержимое на контроллер MVC.

[System.Web.Mvc.HttpPost] 
     public void FileUploadWithAjax([FromBody]string imageString) 
     { 
      bytes = Convert.FromBase64String(imageString); 
      using (MemoryStream ms = new MemoryStream(bytes)) 
      { 
       Image image = Image.FromStream(ms); 
       image.Save("myBlargyImage.jpg"); 
      } 
     } 

Но он ломается при создании изображения из потока. Он выдает сообщение об ошибке «Недопустимый параметр».

Исключение типа «System.ArgumentException» произошло в System.Drawing.dll, но не был обработан в пользовательском коде

Дополнительная информация: Параметр не является допустимым.

Трассировка стека

на System.Drawing.Image.FromStream (поток Поток, булева useEmbeddedColorManagement, булева validateImageData) в System.Drawing.Image.FromStream (поток) в поток Micraft.BBraun.Controllers.EmployeeController.FileUploadWithAjax (String imageString) в D: \ B Braun \ mvc 31 JAN 2017 \ Micraft.BBraun \ Controllers \ EmployeeController.cs: строка 351 в lambda_method (Closure, Controlle rBase, Object []) в System.Web.Mvc.ActionMethodDispatcher. <> c__DisplayClass1.b__0 (ControllerBase контроллер, Object []) параметры при System.Web.Mvc.ActionMethodDispatcher.Execute (ControllerBase контроллера, Object []) параметры при System.Web.Mvc.ReflectedActionDescriptor.Execute (ControllerContext controllerContext, IDictionary параметры) на System.Web.Mvc.Async.AsyncControllerActionInvoker.b__39 (IAsyncResult AsyncResult, ActionInvocation innerInvokeState) в System.Web.Mvc.Async.AsyncResultWrapper.WrappedAsyncResult 2.CallEndDelegate(IAsyncResult asyncResult) at System.Web.Mvc.Async.AsyncResultWrapper.WrappedAsyncResultBase 1.End() на System.Web.Mvc.Async.AsyncControllerActionInvoker.EndInvokeActionMethod (IAsyncResul т AsyncResult) при System.Web.Mvc.Async.AsyncControllerActionInvoker.AsyncInvocationWithFilters.b__3d() на System.Web.Mvc.Async.AsyncControllerActionInvoker.AsyncInvocationWithFilters. <> c__DisplayClass46.b__3f()

UPDATE

Я просто проверял онлайн инструмент, который может генерировать изображение из base64string как http://codebeautify.org/base64-to-image-converter

Когда я скопировал текст изображения из своего источника в HTML, Мне удалось создать изображение на сайте.

После этого я попытался скопировать содержимое изображения, которое я получал по моему методу на стороне сервера, и, на удивление, я не смог сгенерировать изображение.

Затем я сравнил оба текста и нашли некоторые diferences

Если вы проверяете сильфона изображение внимательно, я могу увидеть некоторые изменения, как везде, где есть какая-либо «+» знак содержания изображения, его заменили на «пустое пространство».

есть ли какой-либо контент, который мне не хватает, что я должен использовать при отправке этих данных на сервер?

Answer 1

Вы должны использовать encodeURIComponent() на данные, отправляемые на сервер. Так, в запросе Ajax, выполните следующие действия:

data: 'imageString=' + encodeURIComponent(e.target.result.split(',')[1]), 

См AJAX POST and Plus Sign (+) -- How to Encode?