马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。
您需要 登录 才可以下载或查看，没有账号？立即注册
×
关键词：admin blazor 文件上传
每个背景体系都离不开文件管理。
用户头像、商品图片、文章封面、附件文档……上传、存储、展示、管理，一套流程下来，看着简朴，做起来满是细节：
- 用户传了 exe、bat 怎么办
- 图片太大了，页面加载慢
- 文件路径怎么输入、怎么预览
- 多租户的文件会不会混在一起
EasyAdminBlazor 的文件管理模块，把这些全包了。
一、AdminFileInput：文件路径输入 + 预览一体
不须要写任何 JS 上传逻辑，直接利用 AdminFileInput 组件：
razor- [/code][b]功能特性：[/b]
- [table][tr]功能分析[/tr][tr][td][b]只读文本框[/b][/td][td]表现文件上传后的存储路径，不可手动编辑[/td][/tr][tr][td][b]打开文件选择器[/b][/td][td]点击组件弹出 FilePicker 弹窗，选择已有文件或重新上传[/td][/tr][tr][td][b]图片悬浮预览[/b][/td][td]鼠标悬停在路径上，Popover 弹出图片预览（支持 jpg、png、webp 等）[/td][/tr][tr][td][b]扫除已选文件[/b][/td][td]一键清空当前绑定的文件路径[/td][/tr][/table][b]一行代码，搞定文件选择、路径绑定、图片预览。[/b]
- [indent]实际文件上传由 FileService 完成，AdminFileInput 只负责路径绑定和预览展示。
- [/indent][size=5]二、上传验证：白名单 + 黑名单 + 巨细限定[/size]
- 文件上传是安全重灾区。EasyAdminBlazor 内置多层防护：
- json
- [code]{
- "FileSettings": {
- "IncludeExtension": [ ".jpg", ".jpeg", ".png", ".gif", ".pdf", ".docx" ],
- "ExcludeExtension": [ ".exe", ".dll", ".bat", ".cmd", ".vbs" ],
- "MaxFileSize": 10
- }
- }
三、图片处置惩罚：压缩 + WebP 一键转换
上传的图片主动颠末以下处置惩罚：
处置惩罚步调分析格式验证通过 ImageSharp 检测是否为有效图片尺寸压缩高出设置的最大宽度时主动等比缩放格式转换主动转为 WebP 格式，明显减小体积json- {
- "FileSettings": {
- "MaxImageWidth": 800,
- "WebpQuality": 80,
- "KeepOriginalFile": false
- }
- }
页面加载速率提升 5-10 倍，用户完全无感知。
四、分组管理 + 多租户隔离
按日期主动归档
text- wwwroot/uploads/2026/06/17/xxx.webp
手动分组
上传时可以手动选择分组，把文件归类到差异的业务目次下。
多租户隔离（启用多租户时）
text- wwwroot/uploads/{tenantCode}/yyyy/MM/dd/xxx.webp
五、文件列表与预览
文件上传后，在管理背景展示：
- 文件名：原始文件名称，带范例图标
- 文件巨细：主动格式化表现（KB / MB / GB）
- 上传时间：记录上传时间
- 分组：所属分组
- 图片预览：鼠标悬停或点击即可预览
左侧分组树快速筛选，右侧列表展示，管理高效。
六、总结
功能EasyAdminBlazor 做法文件路径输入 + 预览AdminFileInput 组件，一行搞定上传验证设置文件白名单 + 黑名单 + 巨细限定图片处置惩罚主动压缩 + WebP 转换文件管理列表展示 + 分组筛选 + 预览多租户隔离按租户编码主动分目次存储从文件选取到路径绑定、图片预览、压缩转换、管理，全链路覆盖，一行代码不消写。
下一篇预告
《EasyAdminBlazor 第九篇：》——你想看什么？品评区告诉我。
|
发表于 2026-6-18 02:30:11