如何在 ASP.NET MVC 中将 base64String 转换为 blob 并通过 ajax 发送到控制器？

Question

我是 ajax 新手，目前我正在使用 ajax 尝试将 base64string 从视图发送到控制器并获得如下的 JsonResult：

$.ajax({
  url: "@Url.Action("UploadSignature", "JobList")",
  type: "POST",
  dataType: "json",
  data: { photoByte: base64String, eventRecordID: "123456" },
  success: function (result) {
              if (result.success === true) {
                 alert("Signature uploaded !");
              }
  },
  error: function (XMLHttpRequest, textStatus, errorThrown) {
                  console.log(XMLHttpRequest);
         }
  });

我的控制器方法如下：

[HttpPost]
    public async Task<ActionResult> UploadSignature(string photoByte, string eventRecordID)
    {
         byte[] photoAfterConvert = Convert.FromBase64String(photoByte);
         ...             
         //Upload photoAfterConvert to server
         ...
         return Json(new { success = true });
    }

但是，上面的代码有时不起作用，尤其是当 base64String 太长时。一旦我调用了 ajax，它就会挂起并且永远不会进入控制器方法。大约1分钟后，会触发错误回调函数，消息如下所示，无意义。

{"readyState":0,"status":0,"statusText":"error"}

因此，我在想有没有其他方法可以通过 ajax 将大字符串数据从视图发送到控制器？发送 blob 是一个不错的选择吗？如果是，我如何通过发送 blob 来实现它？我需要在控制器参数中放入什么数据类型才能接受 blob？

提前感谢您的帮助。

Answer 1

试试这个：

function Base62ToBlob (dataURI) {
    'use strict'
    var byteString,
        mimestring

    if (dataURI.split(',')[0].indexOf('base64') !== -1) {
        byteString = atob(dataURI.split(',')[1])
    } else {
        byteString = decodeURI(dataURI.split(',')[1])
    }

    mimestring = dataURI.split(',')[0].split(':')[1].split(';')[0]

    var content = new Array();
    for (var i = 0; i < byteString.length; i++) {
        content[i] = byteString.charCodeAt(i)
    }

    return new Blob([new Uint8Array(content)], { type: mimestring });
}

从客户端调用操作方法：

function FileUploadServer (blob) {   
    var fd = new FormData();
    fd.append("file", blob,  "FileName.png");
    $http.post("URL", fd, {
        headers: { 'Content-Type': undefined }
    })
        .success(function (response, status, headers, config) {
          
          
        });
}

服务器端调用接收方法：

 public ContentResult Upload()
  {
      var files = System.Web.HttpContext.Current.Request.Files;
      return CustJson( null);
   }