我刚刚使用 next-pwa 将 service-works 添加到网站，所有 og 标签都根据需要出现，但它们都不起作用：| 我在 facebook 调试器网站上检查了它，有 206 响应代码，还说没有任何 og 标签，第一张图片是 mozila firefox 开发人员工具检查器窗口，显示所有 og 标签都在需要的地方

这是我的 next.config.js 文件

这是我的 service-Worker.js：

我是服务工作者的新手，我用 next-pwa 制作它并且它崩溃了：/对于第一次加载它工作得很好，在另一个页面上导航也很好，但是几秒钟后当我回到缓存页面时它崩溃了，在网络中关于文件的选项卡写入 404 未找到，并且在控制台中我已经佩戴：源“http://localhost:3000/_next/static/chunks/pages/admin.js?ts=1626295746921”的脚本加载失败。 其他页面也有同样的警告，一些页面正在工作，但也找不到动态导入的文件：| 任何想法 ？

这是我的 next.config.js

这是我的 service-Worker.js

我将如何使用 预缓存我的nextjs应用程序的所有页面next-pwa？假设我有以下页面：

• /
• /关于
• /帖子

我希望所有这些都被预先缓存，以便在第一次加载应用程序后它们都可以离线使用。目前我正在使用自定义 webpack 配置将.next/build-manifest.json文件复制到public/build-manifest. 然后，一旦应用程序第一次加载，我注册一个activated处理程序来获取build-manifest.json文件，然后将它们添加到缓存中。它有效，但似乎是一种迂回的实现方式，并且在某种程度上取决于实现细节。我将如何以更规范的方式完成相同的任务？

目前，我的next.config.js文件看起来像这样

我的服务人员钩子看起来像这样

任何帮助是极大的赞赏。谢谢。

我有一个Next.js应用程序，它使用next-pwa库将应用程序设置为服务人员。部署新版本后，我想显示一个可用的快餐栏。

目前，当我重新加载应用程序时它确实会出现，但它似乎毫无用处，因为代码库在重新加载后已经是最新的。

我想知道当用户将选项卡打开一段时间，部署了新版本，然后他们回来看到小吃栏时，是否可以显示该小吃栏？

我的代码目前看起来像这样：

我最近遇到了渐进式 Web 应用程序 (PWA)。我一直在想，是否有可能让独立窗口在安装后像PureRef一样将“始终在顶部”功能编码到其中？

我正在用 Next.js 和 next-pwa 构建一个应用程序。我想我还要问的是，是什么让 Web 应用程序成为独立应用程序？我们可以配置/编码/操作它，以便我们可以利用我提到的一些功能吗？

回购是开源的

_document.js

_app.js

居住

https://time-stamp.vercel.app

我已经检查了 PWA 正在使用上述 URL 或未使用的天气

我在 PWA 的控制台中看到以下错误：

1. “https://static.cloudflareinsights.com/beacon.min.js”的 FetchEvent 导致网络错误响应：承诺被拒绝。
2. “https://www.google-analytics.com/analytics.js”的 FetchEvent 导致网络错误响应：承诺被拒绝。

似乎外部脚本有问题被工作箱获取？该网站是一个 next.js 应用程序，我正在使用 next-pwa 将其转换为 PWA。这是 next-pwa 的 pwa-config：next-pwa config

有谁知道如何解决这一问题？

我开始使用 next-pwa，基本设置就像一个魅力。现在它想使用运行时缓存选项，这对我不起作用：

我的 next.config.js 包括标准缓存条目和一个自定义条目，该条目应该为每个到 /api/todoitem 的请求使用策略 StaleWhileRevalidate：

重新启动 npm run dev 启动浏览器 -> fetch GET /api/todoitem -> 和 console.log 告诉我

我尝试了多种正则表达式组合，包括在我的 runtimeCache 条目之前或之后的 defaultRuntimeCaching 均无济于事。

任何使自定义 runtimeCache 规则正常工作的提示将不胜感激。

下一个.js 12.0.7

下一个 pwa 5.4.4

node.js v14.18.2

版本

• next-pwa：
• next：

问题

如何在 fallbacks.image 中加载更多图像，例如我需要两个图像到后备中

文件 - next.config.js

我目前在我的代码中使用 Facebook Pixel 来处理事件重复数据删除。所有初始化和跟踪功能都已成功发送并登录到 Facebook。

但是当我使用 next-pwa 创建 PWA 时，Facebook Pixel 出错了。Facebook Pixel 事件仅在 Hard Reload (Ctrl + F5) 时触发，但当我刷新页面或重新访问页面时，Facebook Pixel 不会被触发。我使用 Facebook Pixel Helper 来注意事件是否被触发。

通过查看网络选项卡和 Workbox 控制台日志，我注意到 Workbox 可能会拦截对 Facebook 的请求。 用于添加到购物车的 Facebook 网络选项卡的 Workbox 日志

我注入 Facebook Pixel Script 的代码：

然后在我的 index.js 中，我使用 useEffect Hook 调用它。请注意，PixelID 是从 GraphQL 获取的：

我的 next.config.js

我尝试在每次重新加载页面时初始化 Facebook Pixel，但不幸的是它不起作用。我认为这与 Workbox 如何处理第三方请求有关。已经阅读了处理来自 Google 的第三方请求，但仍然无法正常工作。对此有什么帮助吗？

谢谢！