设置PWA的窗口标题和图标

debugcn 发表于 Dev

愤怒的小熊

我正在将我的网站变成PWA，并逐步进行了使其可下载的步骤，并在主屏幕上带有其自己的图标。

但是，我找不到任何有关如何设置窗口标题和图标的文档，因为该窗口当前是chrome的图标并命名为Application ...。这可能吗？如果可以，我该如何实现呢？

该应用的清单：

{
  "name": "AppName",
  "short_name": "AppName",
  "lang": "en-US",
  "start_url": "/",
  "display": "standalone",
  "background_color": "white",
  "theme_color": "black",
  "icons": [{
    "src": "../content/themes/AppName/images/fuzz.png",
      "sizes": "512x512",
      "type": "image/png"
    }]
}

Android中应用程序的窗口（出于隐私目的，删除了窗口内容）：

费德比尔

某些Android发行版未在应用程序切换器中显示PWA名称和图标，您可以转到已知良好的PWA来检查您的发行版是否是其中之一。

来自Airhorner的清单清单示例：

{
  "name": "The Air Horner",
  "short_name": "Airhorner",
  "description": "The world's best airhorner, and it's free",
  "icons": [
      {
        "src": "/images/touch/android-launchericon-48-48.png",
        "type": "image/png",
        "sizes": "48x48"
      }, 

      {
        "src": "/images/touch/android-launchericon-72-72.png",
        "type": "image/png",
        "sizes": "72x72"
      }, 
      {
        "src": "/images/touch/android-launchericon-96-96.png",
        "type": "image/png",
        "sizes": "96x96"
      }, 
      {
        "src": "/images/touch/android-launchericon-144-144.png",
        "type": "image/png",
        "sizes": "144x144"
      }, 
      {
        "src": "/images/touch/android-launchericon-192-192.png",
        "type": "image/png",
        "sizes": "192x192"
      }, 
      {
        "src": "/images/touch/android-launchericon-512-512.png",
        "type": "image/png",
        "sizes": "512x512"
      } 
      ],
  "start_url": "/?homescreen=1",
  "scope": "/",
  "display": "standalone",
  "background_color": "#2196F3",
  "theme_color": "#2196F3"
}

Result on the Pixel launcher: