javascript - Jquery、Ajax 中使用数组与 FormData 发送大图像文件时 FormData 内容长度限制

Question

我有 3 个图像或多图像数组，其总大小约为。 29mb 或以上。我尝试使用 Ajax 和表单数据将其发布在服务器端。但是当我尝试在 MVC 中使用 FormData 发布大数据时它显示错误，有什么解决方案吗？当我尝试发布数据时，它在客户端显示错误意味着进入 request.fail 部分

这是我的 Jquery 代码

 var filess = new Array();
var num = 4;
var IsAlready = false;
$(document).ready(function() {
    document.getElementById('pro-image').addEventListener('change', readImage, false);

    $( ".preview-images-zone" ).sortable();

    $(document).on('click', '.image-cancel', function() {
    debugger;
        let no = $(this).data('no');
        let Id = this.id;
        $(".preview-image.preview-show-"+no).remove();
        for (var i = 0; i < filess.length; i++) {
          debugger;
             filess = $.grep(filess, function(value) {
  return value.name != Id;
        });
}
    });
});

function readImage() {

    if (window.File && window.FileList && window.FileReader) {
        var files = event.target.files;
        var output = $(".preview-images-zone");

          for (var i = 0; i < files.length; i++) {

             $.grep(filess, function (n) {
                 if (n.name == files[i].name) {
                     IsAlready = true;
                 }
             })
             if (IsAlready)
             {
                 alert("Same Name File Exist");
                  $("#pro-image").val('');
                  IsAlready = false;
                 return false;
             }
        }

        var anyWindow = window.URL || window.webkitURL;
          for (var i = 0; i < files.length; i++) {

            filess.push(files[i]);
        var file = null;
             file = files[i];

            if (!file.type.match('image')) continue;
            var objectUrl = anyWindow.createObjectURL(files[i]);
            var html =  '<div class="preview-image preview-show-' + num + '"  >' +
                            '<div class="image-cancel" data-no="' + num + '" id="' + files[i].name + '">x</div>' +
                            '<div class="image-zone"><img id="pro-img-' + num + '" src="' + objectUrl + '"></div>' +

                            '</div>';

                output.append(html);
                num = num + 1;

            window.URL.revokeObjectURL(files[i]);
        }
       $("#pro-image").val('');
    }
    else {
        console.log('Browser not support');
    }

}

$("#submit").click(function () {
    event.preventDefault();
    debugger;
    var url = "/Administration/CreateAlbum";
    var albumName = $("#AlbumName").val();
    var albumDescription = $("#AlbumDescription").val();
    var IsActive = $("#IsActive").val();
    var filess = new Array();
    var data = new FormData();
    data.append('albumName', albumName);
    data.append('albumDescription', albumDescription);
    data.append('IsActive', IsActive);
    $("#submit").prop("disabled", true);

    for (var i = 0; i < filess.length; i++) {

        data.append('image', filess[i] );
    }

    var request = $.ajax({
        url: url,
        enctype: 'multipart/form-data',
        type: 'POST',
        processData: false,
        contentType: false,
        cache: false,
        timeout: 600000,
        data: data
    });

    request.done(function (response) {
        $("#resultCode").html(response.ResultCode);
        $("#resultMessage").html(response.ResultMessage);
        $('#reasonCode').val("");
        $('#quantity').val("");
        $('#inventoryCode').val("");
        $('#unitCost').val("");


    });
    request.fail(function (jqXHR, textStatus) {
        alert("Request failed: " + textStatus);
    });

});

Answer 1

正如所讨论的，您需要在 web.config 中设置 maxAllowedContentLength

 <system.webServer>
    <security>
      <requestFiltering>
        <requestLimits maxAllowedContentLength="YOUR SIZE"  />
      </requestFiltering>
    </security>
  </system.webServer>

谢谢