首页 > 解决方案 > 添加到屏幕不显示

问题描述

角度应用程序中 manifest.json 中的 start_url 应该是什么。

{
  "name": "dummy",
  "short_name": "dummy",
  "theme_color": "#1976d2",
  "background_color": "#fafafa",
  "display": "standalone",
  "scope": "/",
  "start_url": "/",
  "icons": [
    {
      "src": "assets/icons/icon-72x72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-96x96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-128x128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-144x144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-152x152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-384x384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ]
}

应该是“/”还是“。” 或“/index.html”,我需要为服务人员收听“beforeinstallprompt”事件吗?或任何其他,如果我错过任何东西。提前致谢!

标签: angularservice-workermanifest.jsonangular-service-workerpwa

解决方案


当您在添加到主屏幕后单击 PWA 的图标时,开始 URL 将成为您应用的主页。如果您在项目的根目录中有一个 index.html 并且在同一路径中有一个清单,您可以给出“/index.html”,或者您也可以给出一个完全限定的 uRL,其域名如“<a href=" https://www.example.com/" rel="nofollow noreferrer">https://www.example.com/

您需要收听 beforeinstallprompt 以使用它来显示“添加到主屏幕”安装横幅。无论您如何处理此事件,您都可以从 chrome 菜单添加到主屏幕。此事件用于页面内安装横幅。


推荐阅读