安装横幅 a2hs 在我的 pwa 上不起作用

如何解决安装横幅 a2hs 在我的 pwa 上不起作用

我正在尝试从我的网站中删除 PWA。到目前为止，添加了 manifest 和 service worker，一切正常，通过应用程序和 Lighthouse 在 chrome 开发工具上检查，一切都是绿色的并且可以安装。

这是我的清单：

{
  "short_name": "ClickToPLay","name": "Твой магазин игр.","icons": [
    {
      "src": "/images/AppLogo1.png","type": "image/png","sizes": "192x192"
    },{
      "src": "/images/AppLogo2.png","sizes": "512x512"
    },{
      "src": "/images/maskable_icon.png","sizes": "192x192","purpose": "any maskable"
    },{
      "src": "/images/AppLogo3.png","sizes": "144x144","type": "image/png"
    }
  ],"start_url": "https://clicktoplay.ru/","background_color": "#666c7a","display": "fullscreen","scope": ".","theme_color": "#c28e1f","orientation": "portrait-primary","description": "Аренда и покупка игр для PS4 и PS5"
  
} 

这是我的 app.js :

if('serviceWorker' in navigator){
    navigator.serviceWorker.register('/sw.js')
    .then((reg)=> console.log('service worker registered',reg))
    .catch((err) => console.log('service worker not registered',err))
} 

这是我的服务人员：

//install service worker

self.addEventListener('install',evt =>{
    console.log('service worker has been installed');
});

//activate service worker
self.addEventListener('activate',evt =>{
    console.log('service worker has been activated');
});

//fetch event
self.addEventListener('fetch',evt => {
    console.log('fetch event',evt);
});

我可以手动将其 pwa 添加到主屏幕，一切正常，但实际的 A2HS 横幅不会在 android chrome 或其他任何东西上弹出。

有人可以帮我提供解决方案或建议吗？

谢谢

解决方法

您在网络应用清单中的 start_url 应该是相对的，而不是完全限定的 URL。

使用 "start_url": "/", 而不是 "start_url": "https://clicktoplay.ru/",

我还查看了 start_url 中列出的站点，那里的 Service Worker 可能有问题。如果您更新应用中的任何 HTML/CSS/JS，则将继续提供之前的缓存版本，直到您更新 Service Worker。

看一看 workbox 一种更轻松地构建和使用 Service Worker 的方法。

,

最终通过完全清除缓存解决了它，代码中没有错误只是一个完整的缓存笑话。

要清除缓存，请转到 Chrome => 右上角按钮 => 高级 => 选择您的网站并按“清除并重置”。

谢谢大家