基于.NetCore开发博客项目 StarBlog - 图片批量导入
Posted dotNET跨平台
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了基于.NetCore开发博客项目 StarBlog - 图片批量导入相关的知识，希望对你有一定的参考价值。
系列文章
基于.NetCore开发博客项目 StarBlog - (9) 图片批量导入
...
前言
前面把分类层级结构做出来了，不过还不完美，然后我就又折腾了一波，把那个组件fork了一份魔改实现了我要的效果，还顺便上传了NPM包，详情可以看这篇文章：魔改了一下bootstrap-treeview组件，发布个NPM包体验一下
文章这部分就暂时完成了，接下来是摄影模块，首先要搞定图片的批量导入。
理清需求
先来看看模型设计
public class Photo
[Column(IsIdentity = false, IsPrimary = true)]
public string Id get; set;
public string Title get; set;
public string Location get; set;
public string FilePath get; set;
public long Height get; set;
public long Width get; set;
public DateTime CreateTime get; set;
PS：其中Location是照片的拍摄地点，FilePath是存储相对路径。
之前路线图中设定的是要支持图片Exif数据读取并自动定位，不过目前第一版没有实现，需要手动输入地点，存在Location字段中。
然后还有需要读取图片的长跟宽，保存起来，后面做瀑布流展示的时候有用。
那么，流程也理清了：扫描目录 -> 复制图片 -> 读取图片信息 -> 保存到数据库
代码实现
OK，可以开始写代码了
扫描目录和复制都比较简单，先来看看如何获取图片的尺寸。
在.Net Framework时代，框架内置有操作图片的标准库，但.Net Core时代就无了，好像是因为之前的库是跟GDI这种Windows平台独有技术绑定的，为了跨平台只能砍了
不过.NetCore有个非常厉害的ImageSharp库可以操作图片，作者是SixLabors，这名字很有意思啊，六个劳工，哈哈
读取图片
那么先来写个读取图片信息的方法
编辑StarBlog.Web/Services/PhotoService.cs文件，在PhotoService中添加方法
using SixLabors.ImageSharp;
public class PhotoService
/// <summary>
/// 获取图片的物理存储路径
/// </summary>
/// <param name="photo"></param>
/// <returns></returns>
private string GetPhotoFilePath(Photo photo)
return Path.Combine(_environment.WebRootPath, "media", photo.FilePath);
/// <summary>
/// 重建图片数据（扫描图片的大小等数据）
/// </summary>
/// <param name="photo"></param>
/// <returns></returns>
private Photo BuildPhotoData(Photo photo)
var savePath = GetPhotoFilePath(photo);
using (var img = Image.Load(savePath))
photo.Height = img.Height;
photo.Width = img.Width;
return photo;
传入Photo对象，根据图片完整路径去加载，然后把宽度和高度存到对应的属性里
批量导入
接着来写批量导入的方法，完整代码见：https://github.com/Deali-Axy/StarBlog/blob/master/StarBlog.Web/Services/PhotoService.cs
public List<Photo> BatchImport()
var result = new List<Photo>();
var importPath = Path.Combine(_environment.WebRootPath, "assets", "photography");
var root = new DirectoryInfo(importPath);
foreach (var file in root.GetFiles())
var photoId = GuidUtils.GuidTo16String();
var filename = Path.GetFileNameWithoutExtension(file.Name);
var photo = new Photo
Id = photoId,
Title = filename,
CreateTime = DateTime.Now,
Location = filename,
FilePath = Path.Combine("photography", $"photoId.jpg")
;
var savePath = GetPhotoFilePath(photo);
file.CopyTo(savePath, true);
photo = BuildPhotoData(photo);
_photoRepo.Insert(photo);
result.Add(photo);
return result;
只扫描一层文件目录，不像博客批量导入那样递归遍历所有子目录
因为图片的没有层级结构
这个方法最后返回导入的图片列表
导入的图片会复制到StarBlog.Web/wwwroot/assets/photography下
没有像导入博客那样写在单独一个Project里是因为这个功能需要用接口来调用（其实导入博客也需要，后续我会整合到blogService中）
Controller
为了有始有终，把接口这部分代码也贴一下
/// <summary>
/// 批量导入图片
/// </summary>
/// <returns></returns>
[Authorize]
[HttpPost("[action]")]
public ApiResponse<List<Photo>> BatchImport()
var result = _photoService.BatchImport();
return new ApiResponse<List<Photo>>
Data = result,
Message = $"成功导入result.Count张图片"
;
导入完成后接口返回图片列表
实现效果
皮一下… 这部分没有图片，等下一篇介绍图片瀑布流就有啦~
以上是关于基于.NetCore开发博客项目 StarBlog - 图片批量导入的主要内容，如果未能解决你的问题，请参考以下文章
基于.NetCore开发博客项目 StarBlog - 图片批量导入
基于.NetCore开发博客项目 StarBlog - (11) 实现访问统计
基于.NetCore开发博客项目 StarBlog - 开始搭建Web项目
基于.NetCore开发博客项目 StarBlog - (15) 生成随机尺寸图片