Question

我需要使用manifest.json添加提示以添加到主屏幕，但是当我在审核中的pwa分数为100％时，它不会显示

我有如下所示的dist文件夹：-

我的清单json包含以下内容：-

{
  "name": "xyz",
  "short_name": "xyz",
  "icons": [
    {
      "src": "/xyz/static/img/icons/xy-icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/xyz/static/img/icons/xy-icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "start_url": "xyz/index.html",
  "scope": ".",
  "display": "standalone",
  "background_color": "#0628b9",
  "theme_color": "#000000"
}

我正在为服务工作者使用Workbox插件，我也尝试过与普通服务工作者一起使用，如下所示：-

sw.js

var VERSION = '20';

self.addEventListener('install', function(e) {
  e.waitUntil(caches.open(VERSION).then(cache => {
    return cache.addAll([
      'https://cfjedimaster.github.io/nomanssky/client/index.html'
    ]);
}))
});

self.addEventListener('fetch', function(e) {
  var tryInCachesFirst = caches.open(VERSION).then(cache => {
    return cache.match(e.request).then(response => {
      if (!response) {
    return handleNoCacheMatch(e);
  }
  // Update cache record in the background
  fetchFromNetworkAndCache(e);
  // Reply with stale data
  return response
});
});
  e.respondWith(tryInCachesFirst);
});

self.addEventListener('activate', function(e) {
  e.waitUntil(caches.keys().then(keys => {
    return Promise.all(keys.map(key => {
      if (key !== VERSION)
    return caches.delete(key);
}));
}));
});

function fetchFromNetworkAndCache(e) {
  // DevTools opening will trigger these o-i-c requests, which this SW can't handle.
  // There's probaly more going on here, but I'd rather just ignore this problem. :)
  // https://github.com/paulirish/caltrainschedule.io/issues/49
  if (e.request.cache === 'only-if-cached' && e.request.mode !== 'same-origin') return;

  return fetch(e.request).then(res => {
    // foreign requests may be res.type === 'opaque' and missing a url
    if (!res.url) return res;
  // regardless, we don't want to cache other origin's assets
  if (new URL(res.url).origin !== location.origin) return res;

  return caches.open(VERSION).then(cache => {
    // TODO: figure out if the content is new and therefore the page needs a reload.
    cache.put(e.request, res.clone());
  return res;
});
}).catch(err => console.error(e.request.url, err));
}

function handleNoCacheMatch(e) {
  return fetchFromNetworkAndCache(e);
}

，我在灯塔中的pwa得分是100％。

但是我看不到提示添加到主屏幕。

Answer 1

在测试/调试A2HS时，大部分工作是清除以前的测试和安装。
一遍又一遍。
浏览器会特意记住上次执行的操作，因此不会困扰用户安装提示。
如果您想再次看到提示，可能需要完全清除缓存。

如果您对以前的提示说“否”，则它将在XX个月内不再询问。如果已经安装，则不再询问。

要寻找的一些东西
-在台式机Chrome浏览器中
-从chrome：// apps /
删除图标 -如果不起作用，则可能需要清除缓存

添加到主屏幕提示未使用清单json

1 个答案: