实现附件上传下载的功能一般需要考虑三个部分:前端界面展示、后端文件处理和数据存储,下面我来分享一下在 .NET Core 下实现附件上传下载的完整攻略:
前端界面展示
在前端界面,我们可以使用 <input type="file">
标签实现文件上传功能,同时通过表单提交的方式将文件传递给后端。这里可以借助一些前端框架来实现,例如 Bootstrap File Input,它提供了丰富的文件上传界面和文件格式验证功能。
示例1:使用 Bootstrap File Input 实现文件上传
<!-- 引入Bootstrap文件 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<!-- 引入jQuery文件 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- 引入Bootstrap File Input插件文件 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/5.0.5/css/fileinput.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/5.0.5/js/plugins/piexif.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/5.0.5/js/plugins/sortable.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/5.0.5/js/plugins/purify.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/5.0.5/js/fileinput.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/5.0.5/themes/fas/theme.min.js"></script>
<!-- 文件上传表单 -->
<form action="/upload" method="post" enctype="multipart/form-data">
<input id="file" name="file[]" type="file" multiple class="file" data-overwrite-initial="false" data-theme="fas">
<button type="submit" class="btn btn-primary">上传</button>
</form>
<!-- 初始化Bootstrap File Input插件 -->
<script>
$("#file").fileinput({
language: "zh",
allowedFileTypes: ["image", "pdf", "doc", "docx", "xls", "xlsx"],
showUpload: false,
showClose: false,
maxFileCount: 10,
});
</script>
后端文件处理
在后端,我们需要实现文件上传和下载的接口。文件上传一般包括以下几个步骤:
- 接收前端传递的文件数据。
- 根据配置的存储路径,将文件保存到服务器的指定目录中。
- 将文件信息记录到数据库中,便于后续的查询和下载。
示例2:使用 ASP.NET Core 实现文件上传接口
[HttpPost("upload")]
public async Task<IActionResult> Upload(IFormFile file)
{
// 检查是否选择了文件
if (file == null || file.Length == 0)
{
return BadRequest("请选择文件");
}
// 获取上传文件的文件名和扩展名
var fileName = Path.GetFileNameWithoutExtension(file.FileName);
var fileExtName = Path.GetExtension(file.FileName);
// 生成保存文件的文件名(使用当前时间戳)
var saveFileName = $"{DateTime.Now:yyyyMMddHHmmssffff}{fileExtName}";
// 拼接存储目录和文件名
var filePath = Path.Combine(_env.WebRootPath, "uploads", saveFileName);
// 写入文件
using (var stream = new FileStream(filePath, FileMode.Create))
{
await file.CopyToAsync(stream);
}
// 记录文件信息到数据库
var fileInfo = new FileInfo()
{
FileName = fileName,
FileExtName = fileExtName,
FilePath = filePath,
FileSize = file.Length,
};
_dbContext.FileInfos.Add(fileInfo);
_dbContext.SaveChanges();
return Ok(new { fileInfo.Id });
}
除了文件上传接口外,我们还需要提供下载接口。文件下载的实现包括以下步骤:
- 通过文件 ID 查询到文件的相关信息。
- 读取文件内容并返回给客户端。
示例3:使用 ASP.NET Core 实现文件下载接口
[HttpGet("download/{id}")]
public async Task<IActionResult> Download(long id)
{
// 查询文件信息
var fileInfo = _dbContext.FileInfos.FirstOrDefault(fi => fi.Id == id);
if (fileInfo == null)
{
return NotFound();
}
// 设置返回的 Mime 类型
var contentType = "application/octet-stream";
new FileExtensionContentTypeProvider().TryGetContentType(fileInfo.FilePath, out contentType);
// 定义文件下载文件名
var displayFileName = $"{fileInfo.FileName}{fileInfo.FileExtName}";
// 开始下载文件
var stream = new FileStream(fileInfo.FilePath, FileMode.Open, FileAccess.Read);
return File(stream, contentType, displayFileName);
}
数据存储
实际上,文件信息的存储方式有很多种选择,可以存储在数据库,也可以存储在第三方对象存储服务中。在这里,我们假设将文件信息存储在关系型数据库中,并且存在 FileInfo
表中,其中字段包括:Id
、FileName
、FileExtName
、FilePath
、FileSize
等字段。
示例4:FileInfo 表的数据模型定义
public class FileInfo
{
public long Id { get; set; }
public string FileName { get; set; }
public string FileExtName { get; set; }
public string FilePath { get; set; }
public long FileSize { get; set; }
}
以上就是 .NET Core 下实现附件上传下载的完整攻略。通过前端界面展示插件、后端文件处理接口和数据存储引擎的配合,我们可以轻松地实现附件上传下载功能。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:.net core下对于附件上传下载的实现示例 - Python技术站