Razor Pages中图片无法显示的问题求助

以下是针对该问题的具体排查和修复步骤：

• 确保静态文件中间件已配置
  在Program.cs中必须添加静态文件服务配置，否则wwwroot内的资源无法被外部访问。确认代码中包含：

  app.UseStaticFiles();
  

  注意该代码需放在路由配置（app.UseRouting()）和端点配置（app.UseEndpoints()）之前，避免路由拦截静态文件请求。

• 修正图片路径写法
  ASP.NET Core中不直接支持~/的路径解析（除非配合Razor辅助方法），可以改用两种方式：

  1. 根相对路径（推荐）：

     <img src="/calculette.png" />
     

  2. Razor辅助方法（适用于Razor页面/MVC视图）：

     <img src="@Url.Content("~/calculette.png")" />
     

• 验证文件状态

  • 确认calculette.png确实存在于wwwroot根目录，文件名大小写完全匹配（Linux/macOS环境大小写敏感，建议统一小写命名）。
  • 右键文件→属性，设置「复制到输出目录」为「如果较新则复制」，确保文件被正确部署到运行目录。

• 清除缓存并重启应用
  按Ctrl+F5强制刷新浏览器清除缓存，同时重启ASP.NET Core应用，确保静态文件服务配置生效。

• 排查路由冲突
  若应用有自定义通配符路由（如/{*path}），需确保这类路由不会拦截静态文件请求，调整路由顺序，让app.UseStaticFiles()优先执行。

内容的提问来源于stack exchange，提问作者Cedric Delmas