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

【问题标题】：serviceworker location is wrong when integrating PWA to .NET Web Application using WebEssentials.AspNetCore.PWA使用 WebEssentials.AspNetCore.PWA 将 PWA 集成到 .NET Web 应用程序时，serviceworker 位置错误
【发布时间】：2019-01-26 13:19:35
【问题描述】：

我正在尝试使用 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 的路径错误？

【问题讨论】：

基于此thread，检查您的服务工作者在index.html 的路径是相对的还是绝对的。 here 声明，如果您使用的是本地存储库，那么在指定文件的 URL 或路径时，不要指定绝对路径，而是提供绝对路径。

标签： c# asp.net-core web-applications progressive-web-apps web-essentials

【解决方案1】：

由于波浪号 ~ 而失败

解决方法是这样的：

禁用注册服务工作者和清单：

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" />

最后添加 service worker

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

【讨论】：