8

当我在 Chrome DevTools 中查看 manifest.js 时，我可以看到徽标和颜色都在那里。但是，当我从我的 android 设备上的主屏幕启动网站时，既没有加载背景或主题颜色，也没有显示我的启动画面。知道为什么吗？

清单.json：

{
  "short_name": "Example",
  "name": "Example",
  "icons": [
    {
      "src": "images/logo_192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "images/logo_512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "start_url": "./",
  "display": "standalone",
  "theme_color": "#a300c4",
  "background_color": "#c46a00"
}

截屏： Chrome Devtools 中的清单

编辑

我发现了错误。我正在使用 Chrome DevTools 通过远程设备浏览网站。端口转发到 localhost:3000 与触发初始屏幕的 https 要求不匹配。

现在 pwa 以独立模式启动，颜色和启动画面正确显示。

但是，没有显示初始屏幕徽标，我不知道为什么。图像的路径是正确的，并且图像以正确的文件名和类型存在。

有什么建议么？

4

3 回答 3

15

“如果你的页面已经有一个主题颜色元标记——例如<meta name="theme-color" content="#2196F3">——那么页面级别的配置将被使用而不是清单中的值。”

来自：https ://developers.google.com/web/updates/2015/08/using-manifest-to-set-sitewide-theme-color

于 2019-07-19T14:35:23.093 回答
2

我唯一看到这个清单有问题的是起始 URL。将其更改为如下所示

  "start_url": "/index.html",

或者

  "start_url": "https://example.com/myapp/",

如果这没有帮助，请将您的应用程序托管在某个公共域中并共享 URL。

于 2018-06-06T22:14:42.130 回答
0

更改以下内容：

"background_color": "#c46a00"和"background-color": "#ffffff"

于 2022-02-03T20:13:21.590 回答