Web App Manifest 的最简单的 service worker

Question

我必须承认，我不知道什么是 service worker (TL;DR)，但是在网上阅读之后，it seems that 要让 Web App Manifest 正常工作，您需要一。

我真的需要这个额外的脚本（service worker）才能在 Android 上使用 Web App Manifest 设置主屏幕选项吗？

这是我的 /manifest.webmanifest:

{
  "short_name": "autocustos",
  "name": "Calculadora dos Custos do Automóvel",
  "icons": [
    {
      "src": "/favicon32x32.png",
      "type": "image/png",
      "sizes": "32x32"
    },
    {
      "src": "/favicon72x72.png",
      "type": "image/png",
      "sizes": "72x72"
    },
    {
      "src": "/favicon114x114.png",
      "type": "image/png",
      "sizes": "114x114"
    },
    {
      "src": "/favicon144x144.png",
      "type": "image/png",
      "sizes": "144x144"
    },
    {
      "src": "/favicon192x192.png",
      "type": "image/png",
      "sizes": "192x192"
    }
  ],
  "start_url": "/PT",
  "scope": "/",
  "background_color": "#F4F6FE",
  "display": "fullscreen",
  "theme_color": "#F4F6FE"
}

我在头部有这个

<link rel="manifest" href="/manifest.webmanifest" crossorigin="use-credentials">

为了服务于我的 /manifest.webmanifest，我将内容 header 设置为 application/manifest+json

但是 Google Application -> Manifest 上的 Dev Tools 告诉我：

Answer 1

要清楚地了解所有这些是如何组合在一起的，请前往 https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps

Answer 2

按照评论中的说明，我做了以下操作：

在 url 根目录下添加一个非常简单的 /serviceWorker.js 文件，如下所示：

self.addEventListener("fetch", function(event) {
  console.log(`start server worker`)
});

通过将以下代码嵌入 html head 标记或在触发事件 onload 后将其加载到 JS 文件中来加载以下代码

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('./serviceWorker.js')
    .then(function(registration) {
      // Registration was successful
      console.log('ServiceWorker registration successful with scope: ', registration.scope);
    }).catch(function(err) {
      // registration failed :(
      console.log('ServiceWorker registration failed: ', err);
    });
}

那么原始 post 中所述的 manifest.json 将按预期工作

基于这个例子：https://github.com/januwA/web-app-manifest

Web App Manifest 的最简单的 service worker

The simplest service worker for a Web App Manifest

service-worker

web-manifest