Ubuntu上Nginx反向代理的ASP.NET Core应用无法加载CSS文件

问题描述 #

在本地Ubuntu 22.10 LTS Linux服务器上运行ASP.NET Core应用，已安装.NET Core SDK 8.0.3并配置Nginx作为反向代理。测试时出现以下现象：

• 通过CLI执行sudo dotnet testapp启动时，应用运行正常，着陆页CSS样式可正常渲染；
• 将应用作为服务运行时，应用能启动，但页面完全没有CSS样式，推测wwwroot目录未被正确访问。

解决方案 #

1. 修复systemd服务文件的拼写错误 #

你的kestrel-app.service存在两处拼写错误，导致WorkingDirectory未被正确识别，应用无法定位到wwwroot目录：

• Description-ASP.NET Core Web App running on Ubuntu 应改为 Description=ASP.NET Core Web App running on Ubuntu（将减号替换为等号）
• Workingdirectory=/var/www/testlinuxapp 应改为 WorkingDirectory=/var/www/testlinuxapp（将directory首字母改为大写）

修正后的完整服务文件：

[Unit]
Description=ASP.NET Core Web App running on Ubuntu

[Service]
WorkingDirectory=/var/www/testlinuxapp
ExecStart=/usr/bin/dotnet /var/www/testlinuxapp/TestLinuxApp_Sec.dll
Restart=always
# restart service after 10 seconds if the dotnet service crashes
RestartSec=10
KillSignal=SIGINT
SysLogIdentifier=dotnet-web-app
# this user should exist on the server and have ownership of the deployment directory
User=appuser
Environment=ASPNETCORE_ENVIRONMENT=Production

[Install]
WantedBy=multi-user.target

修改完成后，重新加载systemd配置并重启服务：

sudo systemctl daemon-reload
sudo systemctl restart kestrel-app.service

2. 确保appuser拥有wwwroot目录的访问权限 #

通过sudo启动应用时使用的是root权限，默认能访问所有文件；但服务以appuser身份运行，需要该用户对应用目录及wwwroot拥有足够权限：

# 递归设置应用目录的所有者为appuser
sudo chown -R appuser:appuser /var/www/testlinuxapp
# 递归设置目录和文件的权限（保证文件可读、目录可执行）
sudo chmod -R 755 /var/www/testlinuxapp

3. 确认ASP.NET Core已启用静态文件中间件 #

检查项目的Program.cs，确保已添加并启用静态文件服务（ASP.NET Core默认模板已包含，但需确认配置未被删除）：

var builder = WebApplication.CreateBuilder(args);

// 注册静态文件服务
builder.Services.AddStaticFiles();

var app = builder.Build();

// 启用静态文件中间件（需放在路由配置之前）
app.UseStaticFiles();

app.MapGet("/", () => "Hello World!");

app.Run();

4. 验证静态资源可正常访问 #

可以直接访问静态资源路径测试，例如：

http://你的服务器IP/css/site.css

如果返回404错误，回到前面的步骤重新排查；如果能正常返回文件内容，说明静态资源访问已恢复。

内容的提问来源于stack exchange，提问作者Charles de M.