MVC6 Web应用图片渲染报错：控制台出现HTTP404资源未找到问题

兄弟，我太懂这种明明揪出问题根源却卡壳的憋屈感了！你遇到的这个HTTP404就是因为图片路径里多了个Home，导致服务器找不到对应资源，咱们一步步来把它彻底解决：

核心原因 #

MVC6（也就是ASP.NET Core MVC）里，静态资源默认是放在wwwroot目录下的，而你当前的请求路径https://localhost:44356/Home/assets/img/avatars/avatar10.jpg把控制器名称Home加进了静态资源路径，服务器自然找不到——因为Home是控制器路由，不是静态资源目录的一部分。

具体解决方案 #

1. 用Url.Content辅助方法生成正确路径 #

在Razor视图（包括布局页和局部视图）里，用@Url.Content()来生成根路径的资源地址，它会自动映射到wwwroot目录，完全避免路由上下文的干扰：

<img src="@Url.Content("~/assets/img/avatars/avatar10.jpg")" alt="用户头像" />

这里的~符号是关键，它代表应用的根目录，不管你的视图是在哪个控制器下渲染，都会正确解析为https://localhost:44356/assets/img/avatars/avatar10.jpg。

2. 直接使用根路径前缀~/ #

如果你不想用辅助方法，也可以直接在src里写~/开头的路径，Razor引擎会自动处理成正确的绝对路径：

<img src="~/assets/img/avatars/avatar10.jpg" alt="用户头像" />

这种写法和上面的方法效果一致，更简洁。

3. 检查局部视图的调用方式 #

确保你调用局部视图时没有带多余的控制器前缀，比如不要写：

@await Html.PartialAsync("Home/_YourPartialView")

正确的调用应该是直接用局部视图名称（如果在Shared目录）或者相对路径：

@await Html.PartialAsync("_YourPartialView")

错误的调用方式可能会让视图上下文带上控制器名称，间接导致资源路径解析错误。

4. 确认静态资源中间件配置 #

打开你的Program.cs，确保已经添加了静态资源中间件，这是服务器能访问wwwroot资源的前提：

var app = builder.Build();

// 先添加静态资源中间件，顺序很重要！
app.UseStaticFiles();

// 其他中间件（路由、授权等）...
app.UseRouting();
app.UseAuthorization();

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}");

app.Run();

如果没加app.UseStaticFiles()，就算路径写对了，服务器也不会返回静态资源。

额外排查点 #

• 确认wwwroot目录下的结构是否正确：图片必须在wwwroot/assets/img/avatars/avatar10.jpg位置，文件名和大小写要一致（Linux环境下大小写敏感，部署时要注意）。
• 用浏览器开发者工具的「网络」标签，查看实际请求的路径，对比你写的路径，确认是不是渲染时被额外添加了Home前缀。

按照上面的方法试一遍，应该就能搞定这个404问题了！

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