javascript - 使用 WebApi 限制文件上传大小

Question

我有一个简单的 WebApi，可以使用它上传文件。下面是它的简单代码

    [HttpPost]
    public async Task<bool> UploadSingleFile()
    {
        bool isSuccess = false;

        try
        {
            var streamProvider = new MultipartFormDataStreamProvider("D:\\");
            await Request.Content.ReadAsMultipartAsync(streamProvider);
            isSuccess = true;
        }
        catch (Exception ex)
        { }
        return isSuccess;
    }

新，我在 HTML 的表单提交中调用它 <form>使用以下代码标记

<form enctype="multipart/form-data" method="post" action="http://localhost:4952/api/UploadApi/UploadSingleFile" id="ajaxUploadForm" novalidate="novalidate">
<ol>
    <li>
        <input type="file" name="file" id="fileInput">
    </li>
    <li>
        <input type="button" id="ajaxUploadButton" class="btn">
    </li>
</ol>
</form>

我可以使用上面的代码上传任何大小的文件。但是，如果我使用 Javascript ajax 调用相同的 API，API 操作方法会抛出错误，指出文件大小超过最大大小。

$('#ajaxUploadButton').click(function () {

    var data, xhr;

    data = new FormData();
    data.append('file', $('#fileInput')[0].files[0]);

    xhr = new XMLHttpRequest();

    xhr.open('POST', 'http://localhost:4952/api/UploadApi/UploadSingleFile', true);
    xhr.onreadystatechange = function (response) { };
    xhr.send(data);

})

那么为什么ajax无法发布大文件呢？两个代码集中到底发生了什么？

Answer 1

此设置位于您的 web.config 中

<configuration>
  <system.web>
    <httpRuntime maxRequestLength="xxx" />
  </system.web>
</configuration>

默认值为 4 MB。