c# - 使用 WebEssentials.AspNetCore.PWA 将 PWA 集成到 .NET Web 应用程序时，serviceworker 位置错误

Question

我正在尝试使用 WebEssentials.AspNetCore.PWA 将 PWA 集成到我的 .NET Web 应用程序中。

我正在关注本教程 https://medium.com/beginners-guide-to-mobile-web-development/introduction-to-pwa-in-asp-net-core-application-da96c7cc4918

我已经完成了本教程中提到的所有内容。但我收到以下错误

Uncaught (in promise) TypeError: Failed to register a ServiceWorker: A bad HTTP response code (404) was received when fetching the script.

当我查看 WebEssentials.AspNetCore.PWA 的文档时:https://github.com/madskristensen/WebEssentials.AspNetCore.ServiceWorker] 2

以下行应该添加到 </body> 上面标签

<script>'serviceWorker'in navigator&&navigator.serviceWorker.register('/serviceworker')</script>

我的不是这行，而是下面的行

<script nws-csp-add-nonce='true'>'serviceWorker'in navigator&&navigator.serviceWorker.register('~/serviceworker')</script>

正如你所看到的，我的 serviceworker 的路径是错误的 ('~/serviceworker') 。如何修复 Service Worker 的此路径错误？

Answer 1

由于波形符~而失败

解决方法如下:

禁用注册 Service Worker 和 list :

services.AddProgressiveWebApp(new PwaOptions
{
RegisterServiceWorker = false,
RegisterWebmanifest = false,
OfflineRoute = "offline"
});

然后，您可以在 _Layout 中手动添加它们(其中 manifest.webmanifest 是 wwwroot 下的 webmanifest.json 文件)

<meta name="theme-color" content="#FFFFFF" />
<link rel="manifest" href="/manifest.webmanifest" />

最后添加服务人员

<script>'serviceWorker' in navigator && navigator.serviceWorker.register('/serviceworker')</script>