Blazor PWA内部链接打开行为差异问题求助

以下是针对该问题的排查方向和解决方案：

• 检查manifest.json的范围配置
  .NET 8默认生成的PWA清单可能存在scope或start_url设置不当的情况。确保scope设为根路径"/"，start_url指向应用首页（如"/"），这样PWA能识别所有内部链接属于应用范畴，不会触发浏览器跳转。示例配置：

  {
    "name": "YourAppName",
    "short_name": "AppName",
    "scope": "/",
    "start_url": "/",
    // 其他配置项...
  }
  

• 使用Blazor原生路由组件
  避免使用原生HTML <a>标签跳转内部路由，这类标签会触发浏览器默认行为。改用Blazor提供的NavLink组件或通过NavigationManager的NavigateTo方法跳转，确保路由在PWA内部处理：

  • 正确写法：<NavLink href="/counter" class="nav-link">Counter</NavLink>
  • 代码跳转：NavigationManager.NavigateTo("/counter");

• 调整Service Worker的导航策略
  .NET 8的默认Service Worker可能对导航请求的处理逻辑和旧版本不同。检查service-worker.js，确保导航请求被PWA接管，比如通过NetworkFirst策略处理导航请求，并设置navigateFallback为index.html：

  workbox.routing.registerRoute(
    ({ request }) => request.mode === 'navigate',
    new workbox.strategies.NetworkFirst({
      cacheName: 'pages-cache',
      plugins: [
        new workbox.cacheableResponse.CacheableResponsePlugin({
          statuses: [200],
        }),
      ],
    })
  );
  

• 完善iOS PWA配置
  除了已添加的两个meta标签，还需补充apple-touch-icon图标配置，确保iOS系统正确识别PWA身份，避免异常跳转：

  <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
  

• 清除缓存并重新部署测试
  旧的PWA注册信息或缓存可能导致异常。先删除设备上已添加的PWA，清除浏览器缓存，重新部署应用后再添加到主屏幕测试。

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