在 abp 中检索图像源的简单方法

Question

我对 ABP 框架很陌生，可能这个问题有一个非常简单的答案，但我还没有找到它。图片是任何应用程序的重要组成部分，必须以最佳方式（大小、缓存）处理它们。

场景

• 设置文件系统 Blob 存储提供程序。这意味着上传文件将作为图像文件存储在文件系统中
• 创建一个使用 Blob 容器保存和检索图像的服务。因此，保存后，我使用唯一的文件名作为 blob 名称。此名称用于检索它。
• 用户已登录，因此需要授权
• 我可以通过调用blobContainer.GetAllBytesOrNullAsync(blobName)轻松获取图片的byte[]s
• 我想直接在<img> 或datatable 行中轻松显示图像。

所以，这是我的问题：有没有一种简单的方法可以直接在剃须刀页面中将 blob 存储图像用作<img> 的src？我设法实现的是在模型中设置，源作为由image type + bytes converted to base 64 string（如here)）制成的字符串，但是在这种情况下，我需要在模型中进行设置，而且我不知道缓存是否由浏览器使用。我不知道在这种情况下缓存是如何工作的。

我知道这可能是一个与 asp.net 核心更相关的问题，但我在想也许在 abp 中有某种方式可以通过链接访问图像。

Answer 1

如果您有 blob 的 ID，那么很容易做到。只需创建一个 Endpoint 即可根据 blob id 获取图像。

这里是示例 AppService

public class DocumentAppService : FileUploadAppService
{
    private readonly IBlobContainer<DocumentContainer> _blobContainer;
    private readonly IRepository<Document, Guid> _repository;
    public DocumentAppService(IRepository<Document, Guid> repository, IBlobContainer<DocumentContainer> blobContainer)
    {
        _repository = repository;
        _blobContainer = blobContainer;
    }

    public async Task<List<DocumentDto>> Upload([FromForm] List<IFormFile> files)
    {
        var output = new List<DocumentDto>();
        foreach (var file in files)
        {
            using var memoryStream = new MemoryStream();
            await file.CopyToAsync(memoryStream).ConfigureAwait(false);
            var id = Guid.NewGuid();
            var newFile = new Document(id, file.Length, file.ContentType, CurrentTenant.Id);
            var created = await _repository.InsertAsync(newFile);
            await _blobContainer.SaveAsync(id.ToString(), memoryStream.ToArray()).ConfigureAwait(false);
            output.Add(ObjectMapper.Map<Document, DocumentDto>(newFile));
        }

        return output;
    }

    public async Task<FileResult> Get(Guid id)
    {
        var currentFile = _repository.FirstOrDefault(x => x.Id == id);
        if (currentFile != null)
        {
            var myfile = await _blobContainer.GetAllBytesOrNullAsync(id.ToString());
            return new FileContentResult(myfile, currentFile.MimeType);
        }

        throw new FileNotFoundException();
    }
}

上传函数将upload文件和Get函数将获取文件。

现在将 Get 路由设置为图像的 src。

这是博文：https://blog.antosubash.com/posts/dotnet-file-upload-with-abp

回购：https://github.com/antosubash/FileUpload