Json PWA启动屏幕不是';t即使满足所有要求,也不能正常工作

Json PWA启动屏幕不是';t即使满足所有要求,也不能正常工作,json,icons,splash-screen,progressive-web-apps,Json,Icons,Splash Screen,Progressive Web Apps,我已经为我的自定义框架设置了PWA功能,除了启动屏幕之外,一切都很好。满足以下所有要求: name属性设置为我的PWA的名称 背景颜色属性设置为有效的CSS颜色值 图标数组指定的图标至少为512px×512px 该图标存在并且是PNG 除非我删除所有其他图标,否则512x512图标将不会用于启动屏幕 该图标出现在Chrome开发工具应用程序部分,因此可以清楚地看到它 下面是我的manifest.json,以及指向我的测试站点的链接 { "short_name": "New Site",

我已经为我的自定义框架设置了PWA功能,除了启动屏幕之外,一切都很好。满足以下所有要求:

  • name属性设置为我的PWA的名称
  • 背景颜色属性设置为有效的CSS颜色值
  • 图标数组指定的图标至少为512px×512px
  • 该图标存在并且是PNG
除非我删除所有其他图标,否则512x512图标将不会用于启动屏幕

该图标出现在Chrome开发工具应用程序部分,因此可以清楚地看到它

下面是我的manifest.json,以及指向我的测试站点的链接

{
  "short_name": "New Site",
  "name": "New Site",
  "start_url": "/",
  "display": "standalone",
  "background_color": "#17AAEC",
  "theme_color": "#17AAEC",
  "icons": [
    {
      "src": "assets/media/icon-pwa-48x48.png",
      "type": "image/png",
      "sizes": "48x48"
    },
    {
      "src": "assets/media/icon-pwa-96x96.png",
      "type": "image/png",
      "sizes": "96x96"
    },
    {
      "src": "assets/media/icon-pwa-192x192.png",
      "type": "image/png",
      "sizes": "192x192"
    },
    {
      "src": "assets/media/icon-pwa-256x256.png",
      "type": "image/png",
      "sizes": "256x256"
    },
    {
      "src": "assets/media/icon-pwa-512x512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ]
}


更新2018-10-29 结果表明,当没有注册服务人员时,会使用启动屏幕图像,但如果注册了服务人员,则会使用较小的图标。据我所知,这似乎是Webkit的一个bug。请参阅下面的GIF


如果不仅指定512px图标,则不会选择最大的图标。。。目前还没有真正的解决方案来纠正这一点。您只能定义一个512px图标,这不是问题。

我也有同样的问题-似乎您不仅需要正确地获得px值,还需要解决dp问题,这取决于屏幕密度和所创建图像的dpi设置-请参见Jacque的精彩回答:

您能提供日志吗?是什么让您想到应该使用512图像?@abielita我不确定您指的是什么日志,您能澄清一下吗?@abraham Google自己的文档@Jacobsthedev只是说你应该有512码。它从来没有说明当定义了512x512图标时使用的大小,只是没有读取它。请仔细阅读问题。啊,对不起,我误解了你的意思。如果我只定义了一个512x512图标,那么是的,它可以工作,但是我想为启动屏幕提供一个与添加到主屏幕不同的图标。听起来不可能,这很不幸。我可以发誓这以前是有效的。。。