.NET6 MVC 无刷新上传文件

1、前端部分（jquery插件自行导入）

<div class="text-center">

    <form id="uploadForm" enctype="multipart/form-data">
        <input type="file" id="fileInput" name="file" />
        <button type="button" id="uploadBtn">上传</button>
    </form>

</div>

<script type="text/javascript">
    $(function () {
        thisPage.init();
    })


    var thisPage = {
        init: function () {
            this.events();
        },
        events: function () {
            $("#send").click(function () {
                thisPage.send();
            })

            $("#uploadBtn").click(function () {
                thisPage.upload();
            })
        },
        upload: function () {
            debugger
            var fileInput = $('#fileInput')[0];
            var file = fileInput.files[0];
            var formData = new FormData();
            formData.append('file', file);
            $.ajax({
                url: '/Home/Upload',
                type: 'POST',
                data: formData,
                cache: false,
                contentType: false, // 告诉jQuery不要去设置Content-Type请求头
                processData: false,  // 告诉jQuery不要去处理发送的数据
                success: function (data) {
                    console.log('Upload successful', data);
                },
                error: function (error) {
                    console.error('Upload failed', error);
                }
            });
        }
    }

</script>

 

2、后端部分

 [HttpPost]
 public async Task<IActionResult> Upload(IFormFile file)
 {
     if (file != null && file.Length > 0)
     {
         string uploadsDirec = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "uploads");
         var filePath = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "uploads", file.FileName);

         if (!Directory.Exists(uploadsDirec))
         {
             Directory.CreateDirectory(uploadsDirec);
         }
         using (var stream = new FileStream(filePath, FileMode.Create))
         {
             await file.CopyToAsync(stream);
         }
         return Ok("上传成功");
     }
     return BadRequest("无效文件");
 }