Why is my "add to home screen" web application "Install Banner" not showing up in my web application

Question

I created a worker-service file and manifest.json, to display the “Add to Home Screen” web application, “Install Banner” for Chrome browser users.

It does not work properly.

Here is my manifest.jsonfile

{
  "name": "MySite",
  "short_name": "Mysite",
  "start_url": "./?utm_source=homescreen",
  "icons": [{
      "src": "assets/cacheable/images/shortcut/120x120.png",
      "sizes": "128x128",
      "type": "image/png"
    }, {
      "src": "assets/cacheable/images/shortcut/142x142.png",
      "sizes": "142x142",
      "type": "image/png"
    }, {
      "src": "assets/cacheable/images/shortcut/192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    }, {
      "src": "assets/cacheable/images/shortcut/192x192.png",
      "sizes": "384x384",
      "type": "image/png"
    }],
  "orientation": "portrait" ,
  "background_color": "#fff",
  "display": "standalone",
  "theme_color": "#fff"
}

Please let me know if I forgot to add something?

Answer 1

First, check to see if your manifest meets the requirements for displaying web application banners.

Requirements

() -: *:

• - :
  • ( )
  • 144x144 png,
  • ( )
  • start_url,
• HTTPS ( ).
• , , .

, , . .

, :

• Chrome DevTools,
• .

, URL- ( Chrome).

:

. , , URL

, 1. , 2. start_url URL -. , !

, ( !) Chrome (Android). ! , , !

* , ( !). " " 2017

** , . **

Answer 2

manifest.json . @Extricate .

, : - ?
- , - , -, ,

 'Site cannot be installed: the page does not work offline' 

, , chrome A2HS APP INSTALL BANNERS, .

-, devtools chrome, Application. manifest.json. LHS . ,

 'Site cannot be installed: the page does not work offline' 

PFA

Answer 3

In your js service work file add this line:

self.addEventListener('fetch', function(event) {});