HarmonyOS鸿蒙Next自带浏览器对PWA网页的service-worker缓存相关操作不生效

HarmonyOS鸿蒙Next自带浏览器对PWA网页的service-worker缓存相关操作不生效 我有一个 PWA 网页,更新了之后,鸿蒙系统的自带浏览器一直不加载最新的代码。

最开始我在 service-worker.js 中使用 skipWaiting 和 caches.delete 来手动控制缓存,这是我最开始在 service-worker.js 中就有的代码,我使用 service-worker 主要是为了可以在网页离线的时候推送通知

// 处理缓存
// 添加 install 和 activate 事件处理,确保不使用缓存
self.addEventListener('install', () => {
    self.skipWaiting();
});

self.addEventListener('activate', (event) => {
    event.waitUntil(
        caches.keys().then((cacheNames) => {
            return Promise.all(
                cacheNames.map((cacheName) => {
                    // 删除所有缓存
                    return caches.delete(cacheName);
                }),
            );
        }),
    );
    self.clients.claim();
});

除了鸿蒙自带浏览器以外的设备都是可以正常加载新代码的

我这边的测试设备是

  • iPhone 13mini ios 18.3.2 + Safari
  • Xperia 1 vi Android 15.0.0_r3 + Chrome 134.0.6998.135
  • win 11 + Chrome 134.0.6998.118

于是我将 service-worker.js 的内容替换为

self.registration.unregister();

并在 src/index.ts 中添加了

add_header Cache-Control "no-cache";

鸿蒙自带浏览器中仍然是加载的 sw 中缓存的静态资源(js/css)

鸿蒙自带浏览器只有在无痕模式下打开网页才能加载最新的代码

甚至于在浏览器中手动清除网页缓存后仍然是加载的 sw 中的缓存

请问现在有什么办法可以去掉鸿蒙自带浏览器的缓存呢?


更多关于HarmonyOS鸿蒙Next自带浏览器对PWA网页的service-worker缓存相关操作不生效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

您好,您的问题需要进一步分析,请您通过在线提单进一步解决:https://developer.huawei.com/consumer/cn/support/feedback/#/,感谢您的反馈和支持。

更多关于HarmonyOS鸿蒙Next自带浏览器对PWA网页的service-worker缓存相关操作不生效的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中,如果自带浏览器对PWA网页的Service Worker缓存操作不生效,可能是由于以下原因:

  1. 浏览器支持问题:确保浏览器完全支持Service Worker和相关API。鸿蒙Next的浏览器可能在某些版本中对PWA的支持不完全。

  2. 缓存策略问题:检查Service Worker的缓存策略是否正确配置,确保缓存逻辑无误。

  3. HTTPS要求:Service Worker要求网页必须通过HTTPS协议加载,确保你的PWA网页使用了HTTPS。

  4. 浏览器设置:检查浏览器设置,确保没有禁用Service Worker或相关功能。

  5. 系统权限:确保应用拥有足够的系统权限来执行缓存操作。

建议开发者检查以上几点,并根据具体情况进行调试和优化。

回到顶部