使用WebApi，Ajax上传文件

Question

我想通过ajax调用使用WebApi上传文件，该文件将保存到数据库中。我尝试了此链接中 给出的代码
。在这里，它将接收到的数据作为未指定扩展名的文件保存到硬盘驱动器中，但是我想要执行类似将文件保存到数据库时的操作，我也想保存文件名和扩展名原因，如果以后需要要下载文件，我可以提供文件名和扩展名。并在链接中将文件作为文件保存到硬盘，但是有什么方法可以直接将文件保存到DB。

Answer 1

答案分为几个部分。

首先，要上传文件，可以使用包含以下代码的视图：

@using (Html.BeginForm())
{
    <input type="file" value="Choose a file"/>
    <br/>
    <input type="button" value="Upload" id="upload"/>
}

@section scripts
{
<script type="text/javascript">
    $(document).ready(function() {
        $('#upload').click(function () {
            var data = new FormData();
            var file = $('form input[type=file]')[0].files[0];
            data.append('file',file);
            $.ajax({
                url: '/Api/File/Upload',
                processData: false,
                contentType: false,
                data: data,
                type: 'POST'
            }).done(function(result) {
                alert(result);
            }).fail(function(a, b, c) {
                console.log(a, b, c);
            });
        });
    });
</script>    
}

其次，要接收此数据，请使用以下方法创建一个控制器：

public class FileController : ApiController
{
    [HttpPost]
    public async Task<string> Upload()
    {
       var provider = new MultipartMemoryStreamProvider();
       await Request.Content.ReadAsMultipartAsync(provider);

       // extract file name and file contents
       var fileNameParam = provider.Contents[0].Headers.ContentDisposition.Parameters
           .FirstOrDefault(p => p.Name.ToLower() == "filename");
       string fileName = (fileNameParam == null) ? "" : fileNameParam.Value.Trim('"');
       byte[] file = await provider.Contents[0].ReadAsByteArrayAsync();

       // Here you can use EF with an entity with a byte[] property, or
       // an stored procedure with a varbinary parameter to insert the
       // data into the DB

       var result 
           = string.Format("Received '{0}' with length: {1}", fileName, file.Length);
       return result;
    }
}

第三，默认情况下，最大上传大小是有限的。您可以通过修改克服这些限制web.config：

1. 添加maxRequestLength="max size in bytes"在<configuration><system.web><httpRuntime>。（或创建该元素（如果不存在）：

2. 添加maxAllowedContentLength到<configuration><system.web><security><requestFiltering><requestLimits>元素（如果不存在则创建此元素）

这些条目如下所示：

<configuration>
  <system.web>
    <!-- kilobytes -->
    <httpRuntime targetFramework="4.5" maxRequestLength="2000000" />

<configuration>
  <system.webServer>
   <security>
    <requestFiltering>
      <!-- bytes -->
      <requestLimits maxAllowedContentLength="2000000000"/>

注意：您应该将此<location>元素包含在元素中，以便将此限制仅应用于文件上传的特定路径，如下所示：

<location path="Api/File/Upload">
  <system.web>
     ...
  <system.webServer>
     ...

注意修改根目录web.config，而不要修改Views文件夹中的根目录。

第四，关于将数据保存在数据库中，如果使用EF，则只需要一个像这样的实体：

public class File
{
  public int FileId { get; set; }
  public string FileName { get; set; }
  public byte[] FileContent { get; set; }
}

创建此类的新对象，添加到上下文中并保存更改。

如果使用存储过程，请创建一个具有varbinary参数的过程，然后传递byte[] fileas值。