问题标签 [angular-pwa]

我在 ASP.NET Core 和 Angular 上开发了一个应用程序（带有身份验证和角色）。使用 Visual Studio 生成 ASP.NET Core 和 Angular 模型和脚手架。

我使用 Angular 命令添加了 PWA 支持，现在该应用程序应该是 PWA。使用默认的 ngsw 服务工作者。所有assetGroups（JS和CSS）都被缓存，但是，当离线时，App Shell没有显示，我得到错误504（互联网不工作）。

Error: Uncaught (in promise): Error: Could not load settings for 'MyAppName'

有时会出错：Prod mode Error: Cannot match any routes. URL Segment: 'connect/authorize'

根据我的预期，App Shell 应该已经被缓存并在离线时显示。出了什么问题。我的配置有问题吗？

我已将 angular2 pwa 添加到我的项目中，但是当我尝试构建并使用 prod build 启动它时，由于某种原因服务工作者无法正常工作。配置似乎是正确的，我已经在主模块中添加并注册了它： ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production }). 但是当我启动应用程序时，服务人员没有运行。如果有人有类似的问题？？？

我在NestJS（版本 7）服务器上运行Angular PWA（版本 11） 。每次新部署后，PWA 都会崩溃，因为浏览器会尝试加载不再存在的 JavaScript 文件，并且服务器会重定向到根站点 (html)：

应用模块（app.module.ts）配置如下：

有什么建议么？先感谢您。

我正在尝试从我现有的 Angular 应用程序中制作一个适用于 android 的 PWA 应用程序，我在其中使用 Firebase 身份验证（Google 登录 - 使用弹出窗口登录）。在我的网络应用程序上一切正常，但是当我尝试在 android 上登录 PWA 时，我无法使用 Google 登录。（顺便说一句，使用密码和用户名登录可以正常工作。）单击 Google 登录弹出窗口中的电子邮件地址后，它会停止工作。页面为空白。如果我将 URL 复制到“普通”网络浏览器中，页面为空白并显示以下错误：由于缺少初始状态而无法处理请求。如果浏览器 sessionStorage 不可访问或意外清除，则可能会发生这种情况。这是什么意思？因为是我的第一个 PWA 应用程序，所以我保留了“webmanifest”和 service worker 配置文件的设置，就像使用ng add @angular/pwa.

我正在使用一个角度应用程序，我计划在其中使用 angular /pwa (ngsw) 进行集成，并且当我加载已注册的服务工作者时，我可以在 CacheStorage 中看到项目。但是当我离线时会出错。我现在这是一个很长的问题，但非常感谢任何帮助。

我读了很多线程，为了更新范围，我做到了。将 webmanifest 添加到 MIME 类型现在一切都在浏览器在线时工作，仅当我离线时文档未加载低于错误。

当我在线时，下面是我可以看到服务工作者的所有加载的项目

以下是我的配置，我使用 angular 10

下面是我的网络清单，我将范围更新为“。” 在阅读了一些线程之后，如果我们将它放在 IIS 的子文件夹中，我们需要更改范围。

我没有更改 ngsw.json 中的任何内容

只是认为我们在这个角度项目中做的不同是将应用程序放在项目文件夹中，因为我们有不同的项目

所以我试图根据socket.io服务器自动更新charts.js，但每次我加载它时，客户端都没有出现。服务器端也没有说客户端已连接，它只是说正在侦听。我也没有收到任何错误。

服务器.js

套接字服务.ts

仅供参考，我正在关注这个 YouTube 教程

（抱歉英语不好，这不是我的第一语言。）

过去几天我一直在努力在我的 Angular 11 应用程序中加载新的 PWA 版本。开始拔头发了！

这对我来说没有发生：

“每次用户打开或刷新应用程序时，Angular Service Worker 都会通过查找 ngsw.json 清单的更新来检查应用程序的更新。如果找到更新，则会自动下载并缓存它，并将提供给下次加载应用程序时。”``` Angular - 生产中的服务工作者

我正在使用SwUpdate.checkForUpdate()效果很好的 Angular 服务，当有新版本可用时，它会检测并提示用户重新加载。该应用程序已重新加载并在新版本上，非常完美。

但是，如果我关闭手机上的应用程序，然后重新打开，它总是会回到安装 PWA 时的第一个版本:(

我已经尝试过SwUpdate.activateUpdate() window.location.reload()，更改版本号，自定义服务人员......等等等等。

唯一有效的方法是清除我在 Chrome 中的浏览数据，然后重新安装 PWA :(

我无法做任何事情来导致 PWA 缓存使用新版本进行更新。它正在获取新版本，但缓存未更新。

有人可以在这里指出我正确的方向吗？我错过了什么？

安卓 10，Chrome 89.0.4389.105

概述

我注意到，随着应用程序的每个新版本，缓存大小都会显着增加，因为 Angular 服务工作者将应用程序的先前版本保留在缓存中？是否期望 Angular Service Worker 示意图会添加代码以从以前的版本中清理缓存？如果没有，Angular PWA 原理图似乎无法扩展（也许我只是遗漏了一些东西）？

重现步骤

1. 设置新的 CLI 项目ng new my-pwa-app
2. 添加 PWA 支持ng add @angular/pwa --project my-pwa-app
3. 构建应用程序的生产版本并在本地运行（观察缓存大小）
4. 对应用程序进行小的（非功能性）更改（只是为了更改文件哈希） - 代表正在部署的应用程序的新版本。
5. 构建应用程序的生产版本并再次在本地运行（注意：缓存大小将是以前的两倍）。重复步骤 4 和 5，此行为将继续（缓存大小将继续增长，因为它保留了以前版本的缓存文件）。

例子

我有一个角度 pwa（角度 11.2.8），我通常生成我的生产代码

ng build --prod

在 dist 文件夹中，我可以找到 pwa manifest.webmanifest 文件

现在：我需要更改清单文件的两个设置（范围和开始 url）

至

而且我不想在manifest.webmanifest文件中这样做，因为它不在 VCS 中

我可以在哪里存储这些设置以便在下次构建时在清单文件中找到它们？

我有一个 Angular PWA，它使用 Socket.io Node 和 express 服务器进行实时消息传递，并使用 Firebase Cloud Messaging 推送通知。消息传递工作正常，但问题是当用户离开应用程序时，他们将无法接收通知，而只能在积极使用应用程序时接收。我的假设是当用户离开应用程序时 Socket io 正在断开连接。那么即使应用程序在后台运行，有什么方法可以确保套接字保持活动状态。我附上了我的通知片段。对你的帮助表示感谢