【问题标题】:ASP.NET Core how can I link the front end to the back end?ASP.NET Core 如何将前端链接到后端?
【发布时间】:2021-10-24 17:25:15
【问题描述】:

好的,我的项目的目的是将文件上传到站点。我通过相对路径映射做到了这一点。现在我添加了一个导航菜单,1 个用于管理员,1 个用于用户。我想让一个文件(由管理员)上传到某个类别(截至目前,它们使用列表显示在一个类别中),以便用户必须单击该特定类别才能查看该特定文件。我怎么做? 这是我的剃须刀页面:

@if (User.IsInRole("Admin"))
    {
        <!-- In order to post files to server we should use form with post method, also need to add multipart/form-data encoding.
               Otherwise the files will not sent to the server. -->

        <form method="post" enctype="multipart/form-data" id="catform">
            <input asp-for="Files" type="file" name="files" multiple />
            <button type="submit">Upload</button>

        </form>




        <p>Alegeti categoria de personal pentru care doriti sa uploadati</p>


        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <a class="navbar-brand" href="#">Navbar</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav mr-auto">


                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            Alegeti categoria

                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="#">Incepatori</a>
                            <a class="dropdown-item" href="#">Avansati</a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="#">Admini</a>
                        </div>
                    </li>

                </ul>
                <form class="form-inline my-2 my-lg-0">
                    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
                    <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
                </form>
            </div>
        </nav>
    }
    @if (User.IsInRole("User"))
    {
        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <a class="navbar-brand" href="#">Navbar</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item active">
                        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Incepatori</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Avansati</a>
                    </li>
                    

                    <li class="nav-item">
                        <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Admini</a>
                    </li>
                </ul>
                <form class="form-inline my-2 my-lg-0">
                    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
                    <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
                </form>
            </div>
        </nav>
    } 






public IActionResult Index1()
        {
            // Get files from the server
            var model = new FilesViewModel();
            foreach (var item in Directory.GetFiles(Path.Combine(Directory.GetCurrentDirectory(), "upload")))
            {
                model.Files.Add(
                    new FileDetails { Name = System.IO.Path.GetFileName(item), Path = item });
            }
            return View(model);
        }

        [HttpPost]
        public IActionResult Index1(IFormFile[] files)
        {
            // Iterate each files
            foreach (var file in files)
            {
                // Get the file name from the browser
                var fileName = System.IO.Path.GetFileName(file.FileName);

                // Get file path to be uploaded
                var filePath = Path.Combine(Directory.GetCurrentDirectory(), "upload", fileName);
                

                




                // Check If file with same name exists and delete it
                if (System.IO.File.Exists(filePath))
                {
                    System.IO.File.Delete(filePath);
                }

                // Create a new local file and copy contents of uploaded file
                using (var localFile = System.IO.File.OpenWrite(filePath)) 
                    using (var uploadedFile = file.OpenReadStream())

                    {
                       



                        uploadedFile.CopyTo(localFile);








                    }
        
            }
            ViewBag.Message = "Files are successfully uploaded";

            // Get files from the server
            var model = new FilesViewModel();
            foreach (var item in Directory.GetFiles(Path.Combine(Directory.GetCurrentDirectory(), "upload")))
            {
                model.Files.Add(
                    new FileDetails { Name = System.IO.Path.GetFileName(item), Path = item });
                
            }
            return View(model);
        }

【问题讨论】:

  • 下面的代码是来自控制器的上传代码
  • 您的意思是您的项目中有一个文件夹来存储管理员上传的所有文件,并且您希望用户导航到特定页面然后他们可以看到文件名列表?只是文件名?还是需要下载?
  • 是的,你是对的!
  • 您可以在下面尝试我的代码,它确实对我有用 :) 或者还有其他问题吗?
  • 在我的代码中,我也有类似的列表,但我希望按类别列出它们,例如,每当我上传某些内容时,我希望可以选择将其上传到某个类别,而对于用户部分,每当他点击一个类别(它将是一个导航栏)时,他只会显示来自该特定类别的项目......

标签: html asp.net asp.net-core-mvc frontend backend


【解决方案1】:

我的控制器中的这 2 个方法用于列出和下载项目中 wwwroot/upload 文件夹中的文件。

public IActionResult files() {
            string[] filePaths = Directory.GetFiles(Path.Combine(_hostingEnvironment.WebRootPath, "upload/"));
            List<MyFile> files = new List<MyFile>();
            foreach (string filePath in filePaths)
            {
                files.Add(new MyFile { filename = Path.GetFileName(filePath) });
            }
            return View(files);
        }

        public IActionResult DownloadFile(string fileName)
        {
            string path = Path.Combine(_hostingEnvironment.WebRootPath, "upload/") + fileName;
            byte[] bytes = System.IO.File.ReadAllBytes(path);
            return File(bytes, "text/plain", fileName);
        }

这是我的查看页面代码:

@model List<WebApplication2.Models.MyFile>
<table>
    <tr>
        <th>File Name</th>
        <th></th>
    </tr>
    @foreach (MyFile file in Model)
    {
        <tr>
            @*<td>@file.filename</td>*@
            <td>@Html.ActionLink(@file.filename, "DownloadFile", new { fileName = file.filename })</td>
        </tr>
    }
</table>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-09-14
    • 2021-04-01
    • 1970-01-01
    • 2019-11-14
    相关资源
    最近更新 更多