Добавить на главный экран мини-информационная панель не отображается на некоторых устройствах - PullRequest
0 голосов
/ 05 марта 2019

Я пытаюсь внедрить моего первого работника службы PWA, и я ссылался только на документацию Google.На данный момент мой manifest.json завершен, и работник службы представляет собой простой код, как показано ниже.

// sw.js
var CACHE_NAME = "MyFirstPWA";
var filesToCache = [
   // some css and js files to cache
];

self.addEventListener('install', function (e) {
    e.waitUntil(caches.open(CACHE_NAME).then(function (cache) {
        return cache.addAll(filesToCache);;
    }).then(function (e) {
       return self.skipWaiting();
    }));
});

self.addEventListener('activate', function (event) {
    event.waitUntil(caches.keys().then(function (cacheNames) {
        return Promise.all(cacheNames.map(function (cacheName) {
            return caches.delete(cacheName);
        }));
    }));
});

self.addEventListener('fetch', function (event) {
    event.respondWith(caches.match(event.request).then(function (response) {
        return response || fetch(event.request);
    }).catch(function (e) {
        console.log(e);
    }));
});

// Manifest.json
{
  "name": "MyFirstPWA",
  "short_name": "MyFirstPWA",
  "icons": [
    {
      "src": "/images/icons/icon-96x96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "/images/icons/icon-128x128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "/images/icons/icon-144x144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "/images/icons/icon-152x152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "/images/icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/images/icons/icon-384x384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "/images/icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "start_url": "/?utm_source=pwa&utm_medium=pwa",
  "orientation": "portrait",
  "display": "standalone",
  "theme_color": "#0054a6",
  "background_color": "#ffffff",
  "scope": "/",
  "splash_pages": null
}

Рабочий статус функции мини-информационной панели Google, как показано ниже.

Person vs Device working of mini-info bar

Я хочу знать, что я что-то упустил или неправильно реализовал?Пожалуйста, предложите.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...