使用没有 MVC 的 Razor 上传文件答案

【问题标题】：File upload using Razor without MVC使用没有 MVC 的 Razor 上传文件
【发布时间】：2020-06-23 11:37:16
【问题描述】：

我是新人，刚从大学毕业。我正在开发的团队拒绝使用 MVC（不确定为什么），所有页面都是 cshtml 剃须刀页面。我的任务是为网站创建文件上传，有没有办法只使用 Razor 和 javascript 来做到这一点？

【问题讨论】：

有什么理由你必须使用javascript并且不能使用输入“文件”控件和发布文件？
@WooHoo 没有理由。这是我第一次真正深入了解 ASP。我知道如何创建表单元素以及不知道的。我真的很困惑如何将文件传递到我的服务器/数据库。
@AllenMiller 如果您无法发布表单，那么您将需要使用 ajax - javascript 具有用于获取文件数据的内置 api。 developer.mozilla.org/en-US/docs/Web/API/FileReader

标签： javascript razor razor-pages

【解决方案1】：

我从下面的网址中获取了大部分内容。

https://www.learnrazorpages.com/razor-pages/forms/file-upload

创建上传页面，这将允许用户选择一个文件，当用户点击提交输入时，它会将文件发送回服务器。

@page
@model UploadFileModel
@{
}
<form method="post" enctype="multipart/form-data">
    <input type="file" asp-for="Upload" />
    <input type="submit" />
</form>

您可以使用以下代码处理发布请求，这会将文件保存到上传文件夹。

using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using System.IO;
using System.Threading.Tasks;
namespace RazorPagesForms.Pages
{
    public class UploadFileModel : PageModel
    {
        private IHostingEnvironment _environment;
        public UploadFileModel(IHostingEnvironment environment)
        {
            _environment = environment;
        }
        [BindProperty]
        public IFormFile Upload { get; set; }
        public async Task OnPostAsync()
        {
            var file = Path.Combine(_environment.ContentRootPath, "uploads", Upload.FileName);
            using (var fileStream = new FileStream(file, FileMode.Create))
            {
                await Upload.CopyToAsync(fileStream);
            }
        }
    }
}

【讨论】：