.NET Core Razor Pages（非MVC）PWA应用Manifest加载失败求助

核心问题分析 #

你遇到的问题主要源于两个关键疏漏：一是未正确注册PWA服务，二是Razor Pages未自动注入Manifest引用（MVC项目的教程默认包含了这一步，但Razor Pages需要手动配置），同时Manifest文件的MIME类型和语法可能存在问题。

步骤1：修正Program.cs配置 #

首先要确保在服务容器中注册PWA服务，同时配置静态文件的MIME类型（让浏览器正确识别Manifest文件）：

var builder = WebApplication.CreateBuilder(args);

// 添加Razor Pages服务
builder.Services.AddRazorPages();
// 注册PWA核心服务（你之前的代码遗漏了这一行）
builder.Services.AddProgressiveWebApp();

var app = builder.Build();

// 环境配置
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    app.UseHsts();
}

app.UseHttpsRedirection();
// 配置静态文件，确保Manifest文件的MIME类型正确识别
app.UseStaticFiles(new StaticFileOptions
{
    ContentTypeProvider = new FileExtensionContentTypeProvider
    {
        Mappings = { [".webmanifest"] = "application/manifest+json" }
    }
});

app.UseRouting();
app.UseAuthorization();
app.MapRazorPages();

app.Run();

步骤2：调整Manifest文件 #

1. 重命名文件：将manifest.json改为manifest.webmanifest（这是PWA标准推荐的扩展名，避免MIME类型识别问题）。
2. 修正JSON语法：确保所有引号为英文双引号，删除多余的逗号。修正后的内容如下：

{
    "name": "Razor PWA",
    "short_name": "Razor PWA",
    "icons": [
        {
            "sizes": "192x192",
            "type": "image/png",
            "src": "/img/icon-192.png"
        },
        {
            "sizes": "512x512",
            "type": "image/png",
            "src": "/img/icon-512.png"
        }
    ],
    "display": "minimal-ui",
    "theme_color": "#2dab66",
    "orientation": "portrait",
    "background_color": "#2dab66",
    "start_url": "/"
}

步骤3：在Razor Pages布局页中添加Manifest引用 #

MVC项目的布局页会被WebEssentials.AspNetCore.PWA包自动注入Manifest链接，但Razor Pages需要手动添加。打开Pages/Shared/_Layout.cshtml，在<head>标签内加入：

<link rel="manifest" href="/manifest.webmanifest">
<!-- 可选：添加苹果设备的触摸图标支持 -->
<link rel="apple-touch-icon" href="/img/icon-192.png">
<meta name="theme-color" content="#2dab66">

额外排查项 #

• 确认wwwroot/img目录下确实存在icon-192.png和icon-512.png，且路径正确。
• 清理浏览器缓存（Chrome可按Ctrl+Shift+R强制刷新），避免旧的错误缓存影响。
• 打开Chrome DevTools的Network标签，查看manifest.webmanifest的请求状态：若返回404，检查文件路径和静态文件配置；若返回200但提示语法错误，再次核对JSON格式。

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