asp.net-core - 如何在 Blazor WebAssembly 中直接从服务器加载图像/视频？

Question

我在 Blazor webassembly 中实现了一个解决方案，该解决方案允许用户上传图像并将文件存储在服务器上，并将文件路径存储在数据库中。当我在客户端加载图像时，我将图像从服务器作为字节发送到客户端，并将图像字节转换为 base64 字符串并显示图像。这很好用，但根据我的阅读，这不是一个好习惯，因为 base64 转换将文件大小增加了 30%，并且图像无法缓存在客户端上。我想让浏览器从服务器路径下载文件并显示图像。我的问题如下：

1. 如何设置服务器“根”位置以便浏览器知道从哪里获取文件？我在服务器上使用 IWebHostEnvironment 来获取本地路径。
2. 有没有办法保护文件，只允许授权用户从服务器下载文件？
3. 我应该将图像添加到与解决方案相同的文件夹中，还是应该在解决方案之外创建一个不同的文件夹？

我目前在 Blazor WebAssembly 解决方案中使用带有 ASP.NET CORE 5 的 IIS 服务器。

编辑1：

控制器方法：

  [HttpGet(API.GetFile)]
    public async Task<FileContentResult> GetFile([FromQuery] string fileType,string encoding,string name)
    {
        var path = Path.Combine(_webHost.ContentRootPath, "Media", "Images", name);
        byte[] file = await System.IO.File.ReadAllBytesAsync(path);

        return File(file, encoding);
    } 

用于访问文件的链接：

https://localhost:44339/GetFile?encoding=image/jpeg&name=3020_1_21.JPEG

在浏览器中生成的标签：

<img style="width:300px;height:300px" src="https://localhost:44339/GetFile?encoding=image/jpeg&name=3020_1_21.JPEG">

正如我在评论中提到的，该链接在 Postman 中有效，它检索图像，但在浏览器中不起作用，没有检索到文件。

标签： asp.net-coreiisblazor-webassembly