相对图像 URL

Question

我正在上传用户图像并将图像存储在文件夹中，并将它们的名称存储在数据库中

图片上传由angular
完成
图像存储到文件夹和数据库由 dotnet 核心完成 api

两个操作都正常，但我无法在站点中显示存储的图像。

SQL 数据库存储图像 url

要在客户端访问此图像，我在 angular

中使用以下内容

Component.html 文件

 <img [src]="createImgPath()" alt="profile picture" style="width:60px; height:60px;">

.ts 文件

 public createImgPath = () => {
debugger;
if(this.studentPriviewImage==null)
{
  return this.fallback;
}else{  
  console.log(data1);
  return environment.baseUrl+this.studentPriviewImage.filepath1; 
}

}

哪个 returns http://localhost:9529/Resources/Group/student_Photo/11/3/18/3_20220127002626AM.png

如果我直接尝试在浏览器中访问它，我会收到以下错误

存储图像文件的我的解决方案文件夹结构。

还是不明白是什么问题。这种方法有什么问题。

Answer 1

如果你想在 web root 之外提供文件，你需要在 StartUp.cs 中添加以下配置：

app.UseStaticFiles();
    
   ...
   app.UseStaticFiles(new StaticFileOptions
   {
        FileProvider = new PhysicalFileProvider(
        Path.Combine(Directory.GetCurrentDirectory(), "Resources")),
        RequestPath = "/Resources"
   });

相对图像 URL

Relative Image URL

angular

asp.net-core

file-upload